Hydration Error with elements containing mixture of text and other elements.

[dev-inigmas]

Describe the bug

Hydration errors are being caused by elements containing a mix of text and other elements (perhaps only components? most testing may be needed).

• this caused a hydration error:

  <p class="whitespace-nowrap">
    "Updated "
    <DateTimeView time=updated />
  </p>```

• this does not cause hydration errors:

  <p class="whitespace-nowrap">
    <span>"Updated "</span>
    <DateTimeView time=updated />
  </p>```

Another example:

<div class="col-start-1 col-span-6">
  "Title:"
  <NotificationTitle>{notif_title}</NotificationTitle>
</div>

vs

<div class="col-start-1 col-span-6">
  <span>"Title:"</span>
  <NotificationTitle>{notif_title}</NotificationTitle>
</div>

Leptos Dependencies

leptos        = { version="0.7.1", features=["nightly"] }
leptos_axum   = { version="0.7.1" }
leptos_meta   = { version="0.7.1" }
leptos_router = { version="0.7.1", features=["nightly"] }

To Reproduce

afaik - render view!s with a Transition|Suspense as an ancestor that loads a Resource. I've only tried in a "real" app so far. I can try to get a small example to break later if needed.

Expected behavior

Expected to be able to mix text and elements without hydration errors.

Additional context
If it's needed, let me know, and I'll try to throw together a small sample project.

[gbj]

Please include a minimal reproduction: i.e., a small, self-contained example that compiles as is, without requiring other code from your project, and reproduces the bug.

[dev-inigmas]

I was able to reproduce 3385 easily. But this one is proving more elusive - even though I had to scour my app at work for all such instances to get rid of hydration errors. Guess I'll try some more tomorrow.