Merge branch 'master' of https://github.com/reactjs/React.NET

Author: Daniel15

site/jekyll/_posts/2015-03-02-1.4.0-release.md

@@ -8,7 +8,7 @@ I'm happy to announce the release of ReactJS.NET 1.4! This release adds support
 
 Full list of changes:
 
- * [#47](https://github.com/reactjs/React.NET/issues/47) and [#94](https://github.com/reactjs/React.NET/pull/94) — Support for ASP.NET 5. You must be using Visual Studio 2015 CTP6 and ASP.NET 5 Beta 3. Documentation will be added to the site shortly.
+ * [#47](https://github.com/reactjs/React.NET/issues/47) and [#94](https://github.com/reactjs/React.NET/pull/94) — [Support for ASP.NET 5](/getting-started/aspnet5.html). You must be using Visual Studio 2015 CTP6 and ASP.NET 5 Beta 3. Documentation will be added to the site shortly.
  * [#86](https://github.com/reactjs/React.NET/issues/86) — `console` calls such as `console.log` during server-side rendering will automatically be propagated to the client-side. This can greatly assist in debugging server-side rendering. Nicer debugging tools will come in the future!
  * [#96](https://github.com/reactjs/React.NET/issues/96) — Bundle V8 support by default, stop relying on MSIE engine as much.
  * [#97](https://github.com/reactjs/React.NET/issues/97) — Upgrade to JSPool 0.2. This improves the handling of JavaScript engines by recycling them after a number of uses, which ensures memory usage doesn't keep growing over time.

site/jekyll/getting-started/aspnet5.md

@@ -0,0 +1,65 @@
+---
+id: aspnet5
+layout: docs
+title: Getting Started on ASP.NET 5
+---
+
+Getting started with ReactJS.NET on ASP.NET 5 and MVC 6 requires a few more steps compared to previous versions of ASP.NET and MVC. A more fully featured tutorial will be released once the stable release of ASP.NET 5 is out.
+
+Note that ASP.NET 5 is still in beta, and so there may still be some sharp edges. ReactJS.NET requires at least Visual Studio 2015 CTP6 and ASP.NET 5 Beta 3. Additionally, ReactJS.NET does not support the Core CLR at this point in time, so you will need to ensure your project is not referencing it. Remove the `"aspnetcore50": { }` line from your `project.json` file.
+
+Once this has been removed, install the `React.AspNet` package through NuGet. After the package is installed, ReactJS.NET needs to be initialised in your `Startup.cs` file (unfortunately this can not be done automatically like in previous versions of ASP.NET with WebActivator). At the top of the file, add:
+```
+using React.AspNet;
+```
+
+Directly above:
+
+```csharp
+// Add MVC services to the services container.
+services.AddMvc();
+```
+
+Add:
+
+```csharp
+services.AddReact();
+```
+
+
+Directly above:
+
+```csharp
+// Add static files to the request pipeline.
+app.UseStaticFiles();
+```
+
+Add:
+
+```csharp
+app.UseRequestServices();
+app.UseReact(config =>
+{
+  // ES6 features are enabled by default. Uncomment the below line to disable them.
+  // See http://reactjs.net/guides/es6.html for more information.
+  //config.SetUseHarmony(false);
+  // Uncomment the below line if you are using Flow
+  // See http://reactjs.net/guides/flow.html for more information.
+  //config.SetStripTypes(true);
+  // If you want to use server-side rendering of React components,
+  // add all the necessary JavaScript files here. This includes
+  // your components as well as all of their dependencies.
+  // See http://reactjs.net/ for more information. Example:
+  //config
+  //  .AddScript("~/Scripts/First.jsx")
+  //  .AddScript("~/Scripts/Second.jsx");
+});
+```
+
+Finally, add this to `Views/_GlobalImport.cshtml` (or create it if it doesn't exist):
+
+```csharp
+@using React.AspNet
+```
+
+Once ReactJS.NET has been configured, you will be able to use [on-the-fly JSX to JavaScript compilation](http://reactjs.net/getting-started/usage.html) and [server-side rendering](http://reactjs.net/guides/server-side-rendering.html).

site/jekyll/index.md

@@ -20,6 +20,7 @@ id: home
       other .NET languages, focusing specifically on ASP.NET MVC (although it
       also works in other environments). It assumes you already have some basic
       knowledge about React. It is cross-platform and can run on Linux via Mono.
+      Now with support for [ASP.NET 5 Beta](/getting-started/aspnet5.html)!
       Take a look at [the tutorial](/getting-started/tutorial.html) to see how
       easy it is to get started with React and ReactJS.NET!
     </p>

site/public/2015

@@ -0,0 +1 @@
+../jekyll/_site/2015

src/React.AspNet/HtmlHelperExtensions.cs

@@ -66,21 +66,23 @@ private static IReactEnvironment Environment
 		/// <param name="props">Props to initialise 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>
 		/// <returns>The component's HTML</returns>
 		public static IHtmlString React<T>(
 			this IHtmlHelper htmlHelper,
 			string componentName,
 			T props,
 			string htmlTag = null,
-			string containerId = null
+			string containerId = null, 
+			bool clientOnly = false
 		)
 		{
 			var reactComponent = Environment.CreateComponent(componentName, props, containerId);
 			if (!string.IsNullOrEmpty(htmlTag))
 			{
 				reactComponent.ContainerTag = htmlTag;
 			}
-			var result = reactComponent.RenderHtml();
+			var result = reactComponent.RenderHtml(clientOnly);
 			return new HtmlString(result);
 		}
 
@@ -95,21 +97,23 @@ public static IHtmlString React<T>(
 		/// <param name="props">Props to initialise 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>
 		/// <returns>The component's HTML</returns>
 		public static IHtmlString ReactWithInit<T>(
 			this IHtmlHelper htmlHelper,
 			string componentName,
 			T props,
 			string htmlTag = null,
-			string containerId = null
+			string containerId = null, 
+			bool clientOnly = false
 		)
 		{
 			var reactComponent = Environment.CreateComponent(componentName, props, containerId);
 			if (!string.IsNullOrEmpty(htmlTag))
 			{
 				reactComponent.ContainerTag = htmlTag;
 			}
-			var html = reactComponent.RenderHtml();
+			var html = reactComponent.RenderHtml(clientOnly);
 			var script = new TagBuilder("script")
 			{
 				InnerHtml = reactComponent.RenderJavaScript()
@@ -132,4 +136,4 @@ public static IHtmlString ReactInitJavaScript(this IHtmlHelper htmlHelper)
 			return new HtmlString(tag.ToString());
 		}
 	}
-}
+}

src/React.Core/IReactComponent.cs

@@ -38,8 +38,9 @@ public interface IReactComponent
 		/// Renders the HTML for this component. This will execute the component server-side and
 		/// return the rendered HTML.
 		/// </summary>
+		/// <param name="renderContainerOnly">Only renders component container. Used for client-side only rendering.</param>
 		/// <returns>HTML</returns>
-		string RenderHtml();
+		string RenderHtml(bool renderContainerOnly = false);
 
 		/// <summary>
 		/// Renders the JavaScript required to initialise this component client-side. This will 
@@ -49,4 +50,4 @@ public interface IReactComponent
 		/// <returns>JavaScript</returns>
 		string RenderJavaScript();
 	}
-}
+}

src/React.Core/ReactComponent.cs

@@ -78,15 +78,20 @@ public ReactComponent(IReactEnvironment environment, IReactSiteConfiguration con
 		/// Renders the HTML for this component. This will execute the component server-side and
 		/// return the rendered HTML.
 		/// </summary>
+		/// <param name="renderContainerOnly">Only renders component container. Used for client-side only rendering.</param>
 		/// <returns>HTML</returns>
-		public virtual string RenderHtml()
+		public virtual string RenderHtml(bool renderContainerOnly = false)
 		{
 			EnsureComponentExists();
 			try
-			{
-				var html = _environment.Execute<string>(
-					string.Format("React.renderToString({0})", GetComponentInitialiser())
+			{ 
+				var html = string.Empty; 
+				if (!renderContainerOnly) 
+				{ 
+					html = _environment.Execute<string>( 
+						string.Format("React.renderToString({0})", GetComponentInitialiser())
 					);
+				}
 				return string.Format(
 					"<{2} id=\"{0}\">{1}</{2}>",
 					ContainerId,

src/React.Tests/Core/ReactComponentTest.cs

@@ -63,6 +63,25 @@ public void RenderHtmlShouldWrapComponentInDiv()
 			Assert.AreEqual(@"<div id=""container"">[HTML]</div>", result);
 		}
 
+		[Test]
+		public void RenderHtmlShouldNotRenderComponentHTML()
+		{
+			var environment = new Mock<IReactEnvironment>();
+			environment.Setup(x => x.Execute<bool>("typeof Foo !== 'undefined'")).Returns(true);
+			environment.Setup(x => x.Execute<string>(@"React.renderToString(React.createElement(Foo, {""hello"":""World""}))"))
+				.Returns("[HTML]");
+			var config = new Mock<IReactSiteConfiguration>();
+
+			var component = new ReactComponent(environment.Object, config.Object, "Foo", "container")
+			{
+				Props = new { hello = "World" }
+			};
+			var result = component.RenderHtml(renderContainerOnly: true);
+
+			Assert.AreEqual(@"<div id=""container""></div>", result);
+			environment.Verify(x => x.Execute(It.IsAny<string>()), Times.Never);
+		}
+
 		[Test]
 		public void RenderHtmlShouldWrapComponentInCustomElement()
 		{

src/React.Tests/Mvc/HtmlHelperExtensionsTests.cs

@@ -33,7 +33,7 @@ private Mock<IReactEnvironment> ConfigureMockEnvironment()
 		public void ReactWithInitShouldReturnHtmlAndScript()
 		{
 			var component = new Mock<IReactComponent>();
-			component.Setup(x => x.RenderHtml()).Returns("HTML");
+			component.Setup(x => x.RenderHtml(false)).Returns("HTML");
 			component.Setup(x => x.RenderJavaScript()).Returns("JS");
 			var environment = ConfigureMockEnvironment();
 			environment.Setup(x => x.CreateComponent(
@@ -54,5 +54,27 @@ public void ReactWithInitShouldReturnHtmlAndScript()
 			);
 
 		}
+
+		[Test]
+		public void ReactWithClientOnlyTrueShouldCallRenderHtmlWithTrue()
+		{
+			var component = new Mock<IReactComponent>();
+			component.Setup(x => x.RenderHtml(true)).Returns("HTML");
+			var environment = ConfigureMockEnvironment();
+			environment.Setup(x => x.CreateComponent(
+				"ComponentName",
+				new {},
+				null
+			)).Returns(component.Object);
+
+			var result = HtmlHelperExtensions.React(
+				htmlHelper: null,
+				componentName: "ComponentName", 
+				props: new { }, 
+				htmlTag: "span",
+				clientOnly: true
+			);
+			component.Verify(x => x.RenderHtml(It.Is<bool>(y => y == true)), Times.Once);
+		}
 	}
 }