#3278 causes hydration bugs

[zakstucke]

Describe the bug Sorry I haven't got a repro, but I've realised rc2, at least for me, has a new hydration bug caused by this commit: 8b258b0d2602d66b17653fbb57a69664ed52ade5

Hopefully a look at the changes in that commit might instantly show you what's happened

ERROR: 
      /leptos/tachys/src/html/element/mod.rs:352:14
      Panic: called `Option::unwrap()` on a `None` value

[gbj]

I'm unsurprised that this change caused an issue, but can't take any meaningful action without a reproduction, unfortunately.

[gbj]

In case it's helpful in narrowing things down to reproduce it, here's a description of what that change means.

Previously, reading from a resource would only trigger Suspense if the resource's value was None.

However, this meant that a resource that was re-loading would not trigger Suspense to fall back.

The change means that reading from a resource always adds the resource to that Suspense's set of tasks, and spawns a task to wait for the resource to be ready, and then removes it from the set of tasks.

This does not cause to seem a hydration issue in any of the examples in the repo. (I have manually tested some but not all of them, and the automated tests on those that have them didn't find anything.)

Note also that 3de0414ed59e36f24518037526b67319d9981637 should add a more helpful error message for the hydration error you pasted above, which may help narrow it down.

[zakstucke]

@gbj might have a PR to solve this, still blind to the simple repro though.

[winteler]

Hey @gbj,

Just wanted to mention that I also found an hydration bug with nested <Transition/>. Interestingly, I can reproduce this error with rc1 but it also seems to be fixed when using the PR (rev = "adf22c9d983d49ecbddd59acd9c41c6422678406").

I'll just give more details in case it can help understanding the issue or if someone with a similar case comes here. Here is the error I got:

A hydration error occurred while trying to hydrate an element defined at app/src/icons.rs:214:5.

The framework expected an HTML <div> element, but found this instead:  
<!--  -->

In this case, app/src/icons.rs:214:5 is my loading icon used in the Transition fallback and the error appeared only when the content of the second <Transition/> was empty, e.g. a <Show> with when = false. To confirm that the issue is indeed related to the fallback, I first removed it from the <Transition/> and then put the same fallback in the <Transition> and <Show>. In both cases, the hydration error disappeared.

In the process of trying (and failing '^^) to make a minimal reproduction, I also tried to move the component with the nested <Transition/> to other places (higher in the tree basically), and saw that the hydration error then happened inconsistently, indicating it's probably a race condition.

Please let me know if you want any other information :)

[Nutomic]

I seem to be getting the same problem. Interestingly it only happens with <Transition>, but goes away if I replace occurences of <Transition> with <Suspense>. Maybe there is a relevant difference between these two?

[gbj]

@Nutomic @winteler Thank for your comments but unfortunately there is no action that can be taken unless someone provides a reproducible example, at which point I'm very happy to try to fix it, and everyone can check whether it is indeed the same problem or several different problems.