Skip to content

Hydration Bug with Upload and Button Component #394

Open
@tomellm

Description

@tomellm

I really love the File Upload Component as it is shown on the example Website but when I try to use it locally with ssr and hydrate a hydration bug keeps apprearing related to the input tag (as shown in the image at the bottom).

I have tried simplifying my App to the bare minimum but even just the code on the website causes the Bug:

<Upload>
    <Button>
        "upload"
    </Button>
</Upload>

I have made sure to have all of the basic things needed for using thaw with ssr, specifically

  • using the SSRMountStyleProvider
  • using the ConfigProvider
  • activating the ssr and hydrate features when my app has those features active
[dependencies]
leptos = { version = "0.7.0" }
leptos_router = { version = "0.7.0" }
axum = { version = "0.7", optional = true }
leptos_axum = { version = "0.7.0", optional = true }
// -- a few more crates, I can add them if needed
thaw = { git = "https://github.com/thaw-ui/thaw.git", branch="main" }

[features]
hydrate = [
    "leptos/hydrate",
    "thaw/hydrate",
     // -- more things
]
ssr = [
    "leptos/ssr",
    "leptos_meta/ssr",
    "leptos_router/ssr",
    "thaw/ssr",
    "dep:axum",
    "dep:tokio",
    "dep:leptos_axum",
]

Please tell me if there is any info I can provide that I may have forgotten, I would also be happy to try to implement a fix myself given some pointers as this is my first interaction with this codebase.

Thanks in advance for any help

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions