React Testing Library Setup in the SPA Widget

In this lesson, we'll see how to make a job for the React Testing Library on Educative. Let's begin! :)

We'll cover the following

Dockerfile

We use the Dockerfile we made in the previous lessons, as shown below:

FROM node:8.15
RUN npm -g install eslint
RUN npm -g install eslint-config-airbnb
RUN npm install -g eslint-plugin-import
RUN npm install -g eslint-plugin-jsx-a11y
RUN npm install -g eslint-plugin-react
RUN npm install -g prettier
RUN npm install -g --save-dev jest
RUN npm install -g --save-dev @testing-library/react

As you can see from the code snippet above, we install the react testing library in line 12 :

RUN npm install -g --save-dev @testing-library/react

via the node:8.15 image in line 1.

Note: In case you are only interested in installing and setting up the RTL, you need only have lines 1 and 12 in your Dockerfile. Which will then look as follows:

FROM node:8.15
RUN npm install -g --save-dev @testing-library/react

Dockerjob

Now, all we need is a Docker Job to make multiple RTL tests work in the SPA widget. Here are the Docker Job settings:

Job Name: RTL
InputFileName: foo (can be anything)
Run Script: (not needed)
Run in Live Container: True
App port: 3000
Start Script: cd /usercode && npm i && npm test
widget

From there, navigate to a lesson, add a new SPA widget, select the above Docker Job in the dropdown menu, and add a GitHub Repo for testing. Click Run and it should work.

For an example, see the Core-JS library at https://github.com/zloirock/core-js


That’s a wrap! We hope this guide proved helpful for you.

Happy Course Making From All of Us at Educative! 🎉