S
SolidJS•2y ago
Sreeni

Transition state getting lost after an await inside ResourceFetcher

https://playground.solidjs.com/anonymous/c2f53a7d-9e76-4711-8e81-aa6bc2de12c6 Check the above link to see it in action Say if we have the following signal 
const [show, setShow] = createSignal(false);
const [show, setShow] = createSignal(false);
And if we call setShow(true) within startTransition 
startTransition(() => setShow(true));
startTransition(() => setShow(true));
And somewhere inside ResourceFetcher the value of show() is different above & below an await point as shown below 
  console.log('show=', show()); // true
  await new Promise((r) => setTimeout(r, 1));
  console.log('show=', show()); // false !!!
  console.log('show=', show()); // true
  await new Promise((r) => setTimeout(r, 1));
  console.log('show=', show()); // false !!!
Solid Playground
Quickly discover what the solid compiler will generate from your JSX template
4 Replies
Raqueebuddin Aziz
Raqueebuddin Aziz•2y ago
If you do use an actual resource with createResource then transitions will work correctly 
const Greeting = lazy(async () => {
  createResource(show, async show => {
    console.log('show=', show);
    await new Promise((r) => setTimeout(r, 3000));
    console.log('show=', show);
  })
  return import("./tab1");
});
const Greeting = lazy(async () => {
  createResource(show, async show => {
    console.log('show=', show);
    await new Promise((r) => setTimeout(r, 3000));
    console.log('show=', show);
  })
  return import("./tab1");
});
this works
Sreeni
SreeniOP•2y ago
That works because it's passed in as a value and not a signal anymore. Check the updated link using createResource and the value of a signal show2 is getting lost. Does it mean, we cannot access other signals/store inside createResource other than the one being passed as a param? https://playground.solidjs.com/anonymous/cb2803bc-4039-4e5b-832e-5e6e22b79828
Solid Playground
Quickly discover what the solid compiler will generate from your JSX template
Raqueebuddin Aziz
Raqueebuddin Aziz•2y ago
Any signals the resource depends on you need to pass it as a source because suspense with transitions creates a fork of all the sources If you don't pass it as a source, nothing stops the signal from changing You can pass multiple sources like () => [a(), b()]
Sreeni
SreeniOP•2y ago
Got it. Thanks

Did you find this page helpful?