React and ASP.NET Core

I’ve been trying out the React JavaScript framework and the integration with ASP.NET Core provided by the ReactJS.NET project. They play fairly nicely together but there are a few issues that I’ll document here to hopefully save others some time.

I couldn’t get the server-side rendering to work on .NET Core but by running ASP.NET Core on the .NET Framework (4.6.2) it worked fine. If you are following the tutorial then you may find that Remarkable also causes problems with the server-side rendering, even with the suggested changes. In this case, simple remove Remarkable, as it doesn’t add much to the tutorial.

The latest version of Visual Studio 2015 has fairly good support for JSX files. The syntax highlighting works well and the auto-formatting is mostly fine, apart from some odd indentation issues. IntelliSense and auto-complete aren’t as good as with C# but perhaps this would be improved if TypeScript was used (due to the static typing).

If you want to unit test your web APIs (that the React app talks to) then you can use xUnit. However, I could only get this to work once and then it stopped discovering new tests, so I had to resort to using MSTest.

Beware of using static lists in your controllers (or injecting them via a repository interface). If you run multiple unit tests in parallel then they will modify the same collection and give you incorrect results or failed tests. This could result in much head-scratching, as the heisenbug won’t appear when the tests are debugged individually.

Also, be careful when testing asynchronous actions on your API. The unit testing framework doesn’t like async methods, so you will need to synchronously call any awaitable operations within your tests (e.g. with .Wait() or .Result).

If you want to unit test the React app itself then Jest looks like a promising option. You could also perform end-to-end tests using something like PhantomJS.

P.S. I’ve written more about web and unit testing in my book.

P.P.S. I’m considering writing some tutorials about using React with .NET (perhaps integrating with some TfL or railway APIs). Let me know if this would interest you!

This blog is treeware! If you found it useful then please plant a tree.
Donate a treeDonate a tree🌳🌳