Add option not to render the React data-attributes during server side rendering

Author: xabikos

src/React.AspNet/HtmlHelperExtensions.cs

@@ -63,49 +63,51 @@ private static IReactEnvironment Environment
 		/// <typeparam name="T">Type of the props</typeparam>
 		/// <param name="htmlHelper">HTML helper</param>
 		/// <param name="componentName">Name of the component</param>
-		/// <param name="props">Props to initialise the component with</param>
+		/// <param name="props">Props to initialize the component with</param>
 		/// <param name="htmlTag">HTML tag to wrap the component in. Defaults to &lt;div&gt;</param>
 		/// <param name="containerId">ID to use for the container HTML tag. Defaults to an auto-generated ID</param>
-                /// <param name="clientOnly">Skip rendering server-side and only output client-side initialisation code. Defaults to <c>false</c></param>
+        /// <param name="clientOnly">Skip rendering server-side and only output client-side initialization code. Defaults to <c>false</c></param>
+        /// <param name="renderReactAttributes">Indicates if the React data-attributes should be rendered during server side rendering</param>
 		/// <returns>The component's HTML</returns>
 		public static IHtmlString React<T>(
 			this IHtmlHelper htmlHelper,
 			string componentName,
 			T props,
 			string htmlTag = null,
 			string containerId = null, 
-			bool clientOnly = false
+			bool clientOnly = false,
+            bool renderReactAttributes = true
 		)
 		{
 			var reactComponent = Environment.CreateComponent(componentName, props, containerId);
 			if (!string.IsNullOrEmpty(htmlTag))
 			{
 				reactComponent.ContainerTag = htmlTag;
 			}
-			var result = reactComponent.RenderHtml(clientOnly);
+			var result = reactComponent.RenderHtml(clientOnly, renderReactAttributes);
 			return new HtmlString(result);
 		}
 
 		/// <summary>
-		/// Renders the specified React component, along with its client-side initialisation code.
+		/// Renders the specified React component, along with its client-side initialization code.
 		/// Normally you would use the <see cref="React{T}"/> method, but <see cref="ReactWithInit{T}"/>
 		/// is useful when rendering self-contained partial views.
 		/// </summary>
 		/// <typeparam name="T">Type of the props</typeparam>
 		/// <param name="htmlHelper">HTML helper</param>
 		/// <param name="componentName">Name of the component</param>
-		/// <param name="props">Props to initialise the component with</param>
+		/// <param name="props">Props to initialize the component with</param>
 		/// <param name="htmlTag">HTML tag to wrap the component in. Defaults to &lt;div&gt;</param>
 		/// <param name="containerId">ID to use for the container HTML tag. Defaults to an auto-generated ID</param>
-                /// <param name="clientOnly">Skip rendering server-side and only output client-side initialisation code. Defaults to <c>false</c></param>
+        /// <param name="clientOnly">Skip rendering server-side and only output client-side initialization code. Defaults to <c>false</c></param>
 		/// <returns>The component's HTML</returns>
 		public static IHtmlString ReactWithInit<T>(
 			this IHtmlHelper htmlHelper,
 			string componentName,
 			T props,
 			string htmlTag = null,
-			string containerId = null, 
-			bool clientOnly = false
+			string containerId = null,
+            bool clientOnly = false
 		)
 		{
 			var reactComponent = Environment.CreateComponent(componentName, props, containerId);

src/React.Core/IReactComponent.cs

@@ -39,8 +39,9 @@ public interface IReactComponent
 		/// return the rendered HTML.
 		/// </summary>
 		/// <param name="renderContainerOnly">Only renders component container. Used for client-side only rendering.</param>
+        /// <param name="renderReactAttributes">Indicates if the React data-attributes should be rendered during server side rendering</param>
 		/// <returns>HTML</returns>
-		string RenderHtml(bool renderContainerOnly = false);
+        string RenderHtml(bool renderContainerOnly = false, bool renderReactAttributes = true);
 
 		/// <summary>
 		/// Renders the JavaScript required to initialise this component client-side. This will 

src/React.Core/ReactComponent.cs

@@ -79,18 +79,20 @@ public ReactComponent(IReactEnvironment environment, IReactSiteConfiguration con
 		/// return the rendered HTML.
 		/// </summary>
 		/// <param name="renderContainerOnly">Only renders component container. Used for client-side only rendering.</param>
+        /// <param name="renderReactAttributes">Indicates if the React data-attributes should be rendered during server side rendering</param>
 		/// <returns>HTML</returns>
-		public virtual string RenderHtml(bool renderContainerOnly = false)
+        public virtual string RenderHtml(bool renderContainerOnly = false, bool renderReactAttributes = true)
 		{
 			EnsureComponentExists();
 			try
 			{ 
 				var html = string.Empty; 
 				if (!renderContainerOnly) 
-				{ 
-					html = _environment.Execute<string>( 
-						string.Format("React.renderToString({0})", GetComponentInitialiser())
-					);
+				{
+                    var reactRenderCommand = renderReactAttributes
+                        ? string.Format("React.renderToString({0})", GetComponentInitialiser())
+                        : string.Format("React.renderToStaticMarkup({0})", GetComponentInitialiser());
+                    html = _environment.Execute<string>(reactRenderCommand);
 				}
 				return string.Format(
 					"<{2} id=\"{0}\">{1}</{2}>",