My experience with testing a React app on different devices

by Luuk Hafkamp

It’s the year 2018 and React is booming in the world of front-end development. React took the top spot as the most essential Javascript library in the front-end tooling survey and claimed 2nd place in the most loved frameworks, libraries and tools list in the Stack Overflow survey.

I've been working on the Passenger documentation during my time as an intern at Phusion. My new and improved Passenger docs contain a lot of components and app-like-features, which is why I decided that it might be a good idea to use React for this project.

I was as excited about learning React as I was sceptical.

Manual testing vs technology

Sceptical in particular about how well React would perform on multiple devices and in various browsers. I decided to do some tests to see what I’m really getting into. While nowadays you can use nice tools like BrowserStack, I preferred to see the evidence for myself. Seeing as I don’t have a bunch of devices in my disposal I needed to find some place that does. I came across OpenDeviceLab.com, a website where you can find companies who let you use their device lab for testing.

I found a company called Marviq. Marviq is a company that creates high-quality custom software. I decided to send an email to ask if I could swing by and they immediately replied with a big ol' yes!


A selection of some of the devices I could use to test my app.

A week later they warmly welcomed me into their company, helped me with everything I needed and even asked me to have lunch with them. I was pleasantly surprised by the hospitality, after all they were the ones giving me the opportunity to use their equipment! A big thanks to Marviq.

But now: testing time.

My expectation for React support

I assumed that with React’s popularity, it would support most devices. The documentation states that “React supports all popular browsers, including Internet Explorer 9 and above, although some polyfills are required for older browsers such as IE 9 and IE 10”. Seeing as anything below IE 11 is not supported by Microsoft anymore I didn’t really want to bother with polyfills yet and went with a clean create-react-app.

Actual, real-life React support

First things first. My React app worked just fine on modern devices. If you have a recent model iPhone or the latest Macbook naturally your React app will manage. Big shocker. The thing I was more curious about is how badly is my app going to break in IE 11?


The app in my favourite worst browser.

I’d say, from a scale of Internet Explorer to 10, it’s pretty bad. I should have read the Javascript Environment Requirements article instead of assuming that “React supports all popular browsers, including Internet Explorer 9 and above, although some polyfills are required for older browsers such as IE 9 and IE 10.” was all there is to it. Partly my bad for not clicking every link and reading thoroughly enough. However, it would be nice if Facebook would provide a list that shows exactly which browsers need polyfills or don’t work at all. And even then, after applying the polyfills that the documentation recommended, IE 11 still gave me the same result with no console errors in sight.

Granted the percentage of IE users is dropping by the month and nowadays most users are already using React apps like Facebook and Instagram on a daily basis. What did surprise me a bit is that it didn’t work on some of the “older” devices like the iPad-mini.


iPad model a1432 vs iPad model a1584.

To be fair, most devices didn’t connect to the sweet internet for a long while so it’s more likely to be a browser problem. Luckily most common browsers nowadays update themselves in a background process. This means that your everyday user is very likely to benefit from the latest features, even if they are carrying around old relics!

React works fine for browsers up to par

For now my conclusion is that React works great on devices that have their browsers (not you IE) up-to-date. Do be warned about the recommended polyfills, they will not solve all your browser problems by simply adding them. After I added polyfills to my project I still got a whole bunch of nothing on the older versions of the more common browsers.

To end this article about testing I grant you this little gem where I am trying to download IE 11 using IE 8 on the official website for doing just that:

The internet is a wonderful place.