Focus and unfocus don't work with Blits

[carlosg]

Hello everyone,

I need help, I’m using LightningJS with Blits. I created 2 components, component A (parent) and B (child), I have a problem with the native ‘focus’ and ‘unfocus’ functions, I don’t know why, but when you focus on component B and then focus on component A, it works!, but when you focus on component A and try to focus on component B it doesn’t work, the native ‘focus’ and ‘unfocus’ methods of component B are not executed.

I check the Blits demo in this repository:
https://blits-demo.lightningjs.io/#

I tried to create 2 components similar to this page (in my case I created a menu and a banner with many selectable elements):
https://blits-demo.lightningjs.io/#/demos/focushandling

[carlosg]

This example has the same ‘error’ with ‘focus’ and ‘unfocus’.

When the blits demo loaded, you can see this page (image 1):

Now, if you press left key, the menu shows! (image 2):

If you want to return to buttons you need press rigth key, the menu is hidden, but doesn’t focus any button. (In my case is the same bug) Image 3.

Only if you press right key again, the second button is focused (I don’t know why), but the native methods ‘focus’ and ‘unfocus’ of component doesn’t execute too. Image 4

[michiel]

Hi @carlosg I tested this and I can indeed reproduce it.

It seems like you’ve stumbled upon a bug that got introduced recently when we did an update to the focus handling.

The main issue in the example app is that when setting the focus back to the parent from a focused child, the focus lifecycle hook doesn’t trigger again (which is responsible for delegating the focus further on).

I’ve just pushed a fix for this issue to the fix/refocus-parent branch. The team is doing some due diligence checking, before we will release this (probably somewhere tomorrow if all is good). In the mean time you’re more than welcome to check out that branch and see if it fixes the issue in your app as well.

If not, then please let us know, so we can dig further!

-Michiel

[carlosg]

Hello @michiel,

Thanks for your feedback and for tracking down the bug. I tried the Blits demo with the ‘fix/refocus-parent’ branch but it didn’t resolve the error I look forward to future changes.

I again, thanks for your comments

[michiel]

Blits 0.7.4 has just been released a few minutes ago which has the focus fix I mentioned before.

The hosted version of the Example app has also been redeployed (0.7.0) and the issue seems to be resolved now: https://blits-demo.lightningjs.io/#/demos/focushandling

Please take a look and let me know if this solves your issue as well.

Thanks, Michiel

[carlosg]

Thanks @michiel it works but I have a new problem I’m using Blits version 0.7.0 (this version doesn’t have the fix) and when I update Blits version to 0.7.4 some components doesn’t show. Can you publish the fix in 0.7.0 blits version, please?

[michiel]

Hey @carlosg, good to hear that the focus fix works at least

I can’t really publish this fix to v0.7.0, instead I think we should try to figure out why some other of your components broke between 0.7.0 and 0.74 and see how we can address that.

Are you getting any errors? Can you pinpoint a specific version of blits in this range that introduced the issue?

Also, if you’re able to share any code (either public or in DM), I’m happy to take a look as well.

[carlosg]

Awesome @michiel, my project works, I was able to resolve and update the blits version successfully.