search

reactjs / React.NET

.NET library for JSX compilation and server-side rendering of React components
https://reactjs.net/
MIT License
2.29k stars 937 forks source link

Javascript console warning when Server-side rendering is disabled #632

Closed kpkozak closed 5 years ago

kpkozak commented 5 years ago

When Server Side rendering is disabled via config (ReactSiteConfiguration.DisableServerSideRendering()), components that are not explicitly marked as client-only throws an error to Javascript console, similar to this: 

Warning: Expected server HTML to contain a matching <div> in <div>.

The possible case is that while rendering JavaScript for ReactComponents, it is checked only if the component is ClientOnly. If it's not , hydrate is used instead of render.
I think that hydrate should be used only if component isn't client only and server-side rendering was not disabled via config.

dustinsoftware commented 5 years ago

What version are you on? There was a similar bug a while ago that has since been fixed..

kpkozak commented 5 years ago

The latest one, 3.4.1 I've found indeed similar thing - https://github.com/reactjs/React.NET/issues/521. It is connected, but I think a different one.

ReactComponent is checking if the component is client only (that means, if clientOnly parameter of @Html.React(... was set to true. However, it is not checking if server side rendering wasn't completely disabled via config (which effectively means that all components are client only, regardless of clientOnly flag). That scenario should also be covered there. So, in ReactComponent.cs, instead of 

writer.Write(this.ClientOnly ? "ReactDOM.render(" : "ReactDOM.hydrate(");

it should be more like

writer.Write(!_configuration.UseServerSideRendering || this.ClientOnly ? "ReactDOM.render(" : "ReactDOM.hydrate(");

My use case was that I configured ReactJS.Net to disable SSR in debug mode to speed up and ease development, and leave it enabled when in release mode or deployed to any non-development environment, but this caused errors listed above on dev machine.

I'll try to do a PR during a weekend if I find some time for it.