JSFoo Coimbatore 2019

JSFoo Coimbatore 2019

On building faster, performant and secure web applications

Kaleeaswari S


Jest for React

Submitted Apr 19, 2019

Why do we even need to test our code?
How do we assure each and every line works as expected?
How do we know if the code can work end-to-end?
How do we know if the code can handle all possible use cases?
Modifying or extending the existing code, does it break the existing code?
How do we measure the code performance?
The answer to all these questions is writing test for the code.

Does writing test, takes more time?
Are we going to run the code for each possible use case to validate the code?
When a good refactored code is modified/extended, are we going to run the code for all the use cases to validate the existing functionality is not broken?
If no tests, are we going to create documents for all the code written? Also are we going to modify the document for every code change?
So, writing test saves all the time spent in these things.

Why React?
React has taken the front-end world for its extra simplicity and flexibility which gives a fast learning curve..
React builds the application with its component based architecture, making it easy to develop and maintain.
And another important feature of React is virtual DOM which solves the bottleneck, web performance.

Testing React applications using Jest
Jest is a testing tool, that makes unit testing easy in javascript.
Enzyme is a testing tool with a set of utility methods for rendering components and interacting with elements and which are specific to React.

This talk will focus on how to write a robust react application with Jest and Enzyme.


Why is testing required? Testing react applications using Jest.

Speaker bio

Have gained good experience and learnings by developing a data heavy single page application leveraging the React’s easy to learn and write framework. And to mention, it was test driven development using Jest testing framework.


{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}