Javascript console warning when Server-side rendering is disabled

[kpkozak]

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]

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

[kpkozak]

The latest one, 3.4.1
I've found indeed similar thing - #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.