https://github.com/hustcc/react-testing-demo

:checkered_flag: Ensure code quality of React components with jest, enzyme, jsdom, eslint.
https://github.com/hustcc/react-testing-demo

enzyme eslint jest jsdom react react-component react-test testing

Last synced: 11 days ago
JSON representation

:checkered_flag: Ensure code quality of React components with jest, enzyme, jsdom, eslint.

• Host: GitHub
• URL: https://github.com/hustcc/react-testing-demo
• Owner: hustcc
• Created: 2017-04-19T01:25:27.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2024-06-18T02:41:42.000Z (5 months ago)
• Last Synced: 2024-10-17T16:04:59.503Z (21 days ago)
• Topics: enzyme, eslint, jest, jsdom, react, react-component, react-test, testing
• Language: JavaScript
• Homepage: https://github.com/hustcc/react-testing-demo
• Size: 10.7 KB
• Stars: 5
• Watchers: 3
• Forks: 2
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# react-testing-demo

> Some simple code / demo about how to to test in React with `jest` + `enzyme` + `eslint`.

[![Build Status](https://travis-ci.org/hustcc/react-testing-demo.svg?branch=master)](https://travis-ci.org/hustcc/react-testing-demo)

## 1. About test

 - E2E test: 10%

 - Integration test: 20%

 - Unit test: 70%

## 2. Introduce

1. test01 ~ test04: **jest**, test logical module.

2. test05: **jest** + **enzyme**, test react component with assert.

3. test06: **jest**, test react component with snapshots.

4. test07: **jest** + **jsdom**, test react component, and mock the document function in `setupFiles`.

## 3. Run

```sh

git clone [email protected]:hustcc/react-testing-demo.git

cd react-testing-demo

npm i 

npm test

```

## 4. Read

1. [聊一聊前端自动化测试](https://github.com/tmallfe/tmallfe.github.io/issues/37)

2. [从工程化角度讨论如何快速构建可靠 React 组件](https://github.com/lcxfs1991/blog/issues/18?hmsr=toutiao.io&utm_medium=toutiao.io&utm_source=toutiao.io)

3. [How React Components Make UI Testing Easy](https://www.toptal.com/react/how-react-components-make-ui-testing-easy)

4. [jest API documents](http://facebook.github.io/jest/docs/api.html)

5. [enzyme API documents](https://github.com/airbnb/enzyme/blob/master/docs/api)

6. [使用 Jest + Enzyme 测试 React 应用](https://www.atatech.org/articles/74344)