Learn how to use lighthouse in continuous integration system. We will see an example with travis ci.
Puppeteer is a library which allows you to remotely control the chrome browser. It means that puppeteer can do things with browser, that you do. Can you type a webpage address in address bar of chrome and open it? Puppeteer can do it to. See the script below. Save this file as index.js Run the […]
Use bind functions or arrow functions to access react instance inside the event handler
Learn about the hooks in React in step by step way and know about the useState hook.
The idea of this tutorial is to explain the comparison between the testing using the react testing library, enzyme and react test utils library This tutorial will also help you understand how the unit testing and its concept work in different libraries, and you will be able to appreciate the pros and cons of them.
Learn to write unit test cases for routes, async functions, timer functions, states, redux, lifecycle methods, charts in React. We will look into setting up the environment and conclude with different types of testing tools available in React.
There are many libraries available for React.JS testing. You would have probably heard about Jest, Enzyme, React Test Utils, React Testing Library, Dom Testing Library and many more. There are other libraries that help you assert in the unit testing library like chai, expect, sinon. In this tutorial, we are going to look into testing […]
Learn how to add button at bottom in recylerview in android
Purecomponent, as the name suggests, is a component which has same output for a given prop and state. When our React component are pure(as stated above), we can use PureComponent to have the performance gain. TL;DR PureComponent has shouldComponentUpdate function overriden. This function does shallow comparison of the props and state. Due to this unnecessary […]
We are going to write two tests – one of the test will be brittle (it will test the implementation) and other test will be non-brittle (it will test the functionality). App.js Here the functionality of component is that when the user clicks on button, the number is updated on screen. The implementation is done […]
Error boundary catch errors in components below their component tree in declarative fashion. You can also use try/catch to catch and handle the errors in React, but that is applicable only for imperative code. But error boundary allow you to wrap the components so that error is contained inside them, and do not break the […]
Introduction Snapshot testing, as the name refers, is taking the snapshot of the component and then testing if it has changed from previous one. The previous snapshot of the component is source of truth. So any deviation from the previous snapshot will result in test failing. This type of testing allows you to test the […]
Error boundary catch errors in components below their component tree in a declarative fashion. You can also use try/catch to catch and handle the errors in React, but that is applicable only for imperative code. But error boundary allows you to wrap the components so that error is contained inside them, and do not break […]
Gatsby is a static site generator in React. It uses React components, then serves static using GrapQL. Themes were recently introduced in Gatsby. Let us understand themes in Gatsby. Why are Gatsby themes useful? When you build your site in Gatsby, the content of the site and the layout/theme of the site are all in […]
Difference between react-testing-library and enzyme on setup, concept, forceUpdate or shallow/deep rendering of the component
Learn why react hooks are useful and what are the advantages of using React Hooks.
Snapshot testing works by serializing the webpage and comparing it with the latest value. But when it comes to dynamically generated values, it will fail. Like if you have a list that contains the primary key as shown below. When you store the snapshot for the first time, the keys will be 234, 456,789. When […]
If you are a React developer, then you would be able to relate to this tutorial. In this tutorial, we are going to answer questions that you always had in back of the mind when developing React applications, but you always postponed answering them.