Return to site

REACT: Testing a Blur effect 🧪

· fullstack,react

I was doing unit testing on a form that triggers validation styling on the blur event (when losing focus).

So I did a POC.

Here is the code of the form:

 

You see that there are two inputs of type text.

The input text with the name 'a' triggers the displaying of the conditional block named 'c' when we blur from it (lose of focus for getting to the next input).

And here is the related unit test:

 

We render the component.

Then we fire a blur.

And we check the result: when we blur, the conditional block is displayed else nothing appears.