createSelector fails with Suspense

[ibosev]

I created a new project from the template projects to test some of solid functionalities. Wanted to try createSelector to listen to location pathname changes and set active class in navigation.
https://github.com/ibosev/solid-template/blob/140a18a4f034cf83ef4c2c9eeaaf82c5997c5401/src/app.tsx#L17

It all works for all routes, but /about. Seems that about page, as it has a component breaks the selector and it is never called again after rendering the component.
https://github.com/ibosev/solid-template/blob/140a18a4f034cf83ef4c2c9eeaaf82c5997c5401/src/app.tsx#L39

To Reproduce

1. Go to page/route without Suspense component. Selector gets called and classList gets updated.
2. Switch to component with Suspense. Selector gets called and classList gets updated.
3. Switch back to another component without Suspense. Selector never gets called again, classList no longer updated.

Code: https://github.com/ibosev/solid-template

[lxsmnsyc]

The root cause might be this: https://github.com/ibosev/solid-template/blob/140a18a4f034cf83ef4c2c9eeaaf82c5997c5401/src/pages/about.tsx

useData internally calls createResource iiirc, and createResource suspends the component immediately for valid fetch. So, the <About> page itself needs to be wrapped in <Suspense> and not the component that reads the data from useData.

[ryansolid]

I mean both are approaches should be valid, one Suspends the page and the other just that component. That being said the data component doesn't appear to have any resources so I imagine there is nothing to Suspend. You would need a higher up Suspense to catch the component's lazy load There as a bug recently that I introduced in 1.1.1 around Suspense that only got resolved in 1.1.5 I believe in terms of executing effects coming out of transitions. It's worth a shot as a first try to see if that helps.

[ibosev]

The root cause might be this: https://github.com/ibosev/solid-template/blob/140a18a4f034cf83ef4c2c9eeaaf82c5997c5401/src/pages/about.tsx

useData internally calls createResource iiirc, and createResource suspends the component immediately for valid fetch. So, the <About> page itself needs to be wrapped in <Suspense> and not the component that reads the data from useData.

I don't get it why this should affect the selector isSelected (https://github.com/ibosev/solid-template/blob/140a18a4f034cf83ef4c2c9eeaaf82c5997c5401/src/app.tsx#L17) and the change of the location pathname. Suspending a component should not affect the router, right?

And also - why does it break completely? No matter what other link you try to select the selector never gets called anymore.

[ryansolid]

I'm pretty sure I see the bug. I am setting the main world instead of the transition world under Transitions. I'm actively working in this area so might be a few days until I get a fix out.

[ryansolid]

Should be fixed in 1.1.6. Both recent bugs are symptoms of the same problem. A situation where Transitions can be resumed mid-batch causing a weird entanglement.