You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
write a JSX component function, add that component to a Hono route and add an onClick handler that e.g. logs to the console.
run the app
What is the expected behavior?
When running the code and clicking on the element, it should execute the onClick event.
What do you see instead?
The click handler doesnt even appear in the DOM. In the repro given, I just see a div with no attributes. Needless to say, clicking it does nothing
Additional information
It's not like I want to "render" these components on the client. The route should convert the JSX down to raw html and send it to the client, as you'd expect from a server rendered app. However, I still need to attach client-side code to components, such as click listeners. I think they should just get passed to the html element inside the component and act as if I had written it directly in html.
Please correct me if this is intentional and I'm misunderstanding something.
The text was updated successfully, but these errors were encountered:
This is expected behavior. Your application renders JSX only on the server side. To enable onClick, etc., a client-side JavaScript must be hydrated to the rendered HTML. To do this, you can create the mechanism yourself or use frameworks like HonoX. Or you can use hono/jsx only on the client side as an SPA. Example: https://github.com/yusukebe/hono-jsx-spa.
What version of Hono are you using?
4.6.3
What runtime/platform is your app running on?
Cloudflare Pages
What steps can reproduce the bug?
Repro here: https://github.com/jannisbecker/hono-repro
Essentially
What is the expected behavior?
When running the code and clicking on the element, it should execute the onClick event.
What do you see instead?
The click handler doesnt even appear in the DOM. In the repro given, I just see a div with no attributes. Needless to say, clicking it does nothing
Additional information
It's not like I want to "render" these components on the client. The route should convert the JSX down to raw html and send it to the client, as you'd expect from a server rendered app. However, I still need to attach client-side code to components, such as click listeners. I think they should just get passed to the html element inside the component and act as if I had written it directly in html.
Please correct me if this is intentional and I'm misunderstanding something.
The text was updated successfully, but these errors were encountered: