原文 : An Overview of JavaScript Testing in 2021, this article is An Overview of JavaScript Testing in 2021
Test type
- Unit testing
- Integration testing (component testing)
- Functional testing (E2E, end-to-end testing)
The test environment
- The browser
- No interface browser
- Nodejs
Test tool type
Frame comparison table
The framework function | Test lanuchers | Testing structure providers | Assertion functions | Generate and display test progress and summary | Mocks, spies, and stubs | Generate and compare snapshots | Generate code coverage | Browser Controllers | Visual Regression Tools |
Karma | |||||||||
Jasmine | |||||||||
Jest | |||||||||
TestCafe | |||||||||
Cypress | |||||||||
webdriverio | |||||||||
Mocha | |||||||||
Cucumber | |||||||||
Chai | |||||||||
Unexpected | |||||||||
Sinon | |||||||||
enzyme | |||||||||
testdouble | |||||||||
Ava | |||||||||
Instanbul | |||||||||
Blanket | |||||||||
Nightwatch | |||||||||
Nightmare | |||||||||
Phantom | |||||||||
Pupperteer | |||||||||
Applitools | |||||||||
Percy | |||||||||
Wraith | |||||||||
WebdriverCSS | |||||||||
Browser Controllers
Simulate user behavior, such as mouse clicking, dragging, scrolling, code words, and navigation
-
Install drivers such as Selenium, ProTractor, webdriverIO, Nightwatch, Apium
Your code on Node.js <> WebDriver <> FF/Chrome/Safari Driver <> Browser
-
Inject scripts such as testCafe, Cypress
document.getElementByID('someButton').dispatchEvent(clickEvent)
-
Expose the browser’s native API, such as Puppeteer
Your code on Node.js <> Browser's API
Use test frameworks in combination
Like Jest, Jasmine, TestCafe, Cypress is integrated and ready out of the box. Some require combinations such as the common combination of mocha + chai + sinon
It is suggested to consider two aspects: 1. Unit testing and integration testing; 2. End-to-end testing (functional testing). Functional testing is particularly time consuming, especially when testing different browsers
Integration is simple, out of the box, and powerful. The non-integrated ones are more flexible and can be combined arbitrarily
Test framework capabilities required for various test types:
- Unit tests: Assertion Functions and Code Coverage Reporting Tool
Unit testing is generally used for functional programming and as pure as possible, the cleaner the easier it is to test
- Integration tests: Mocks, Spies, and Stubs and Component Snapshot
Integration testing should cover important cross-module processes. Sometimes they extend to processes that span multiple classes, and sometimes to test different systems, such as front-end to back-end interactions
- Functional tests: Control Browsers and Visual Regression Tools
Addendum: Test frameworks are recommended according to the JS framework
- Vue: JEST (Unit Testing) + Vue Testing Library(component Testing) + Cypress (E2E Testing)
- React: Jest (unit test) + enzyme(component test) + cypress(E2E test)
- Angular: Jasmine (unit tests, component tests) + Karma (runner and test reports) + Protractor (E2E tests)
Author’s blog: blog.luojinming.com/archives/89…