前端單元測試jest入門

安裝jest及命令執行

npm

install -g jest  # 安裝
jest # 在專案根目錄下執行jest命令, 或者jest 執行單個檔案的單元測試
jest --coverage # 執行單元測試並計算測試覆蓋率

相容es6(es2015)

a. 根目錄下建立檔案: 「babel.config.js」

b. 新增如下配置

module.exports =}]

,['@babel/preset-react']]
,    plugins:
['@babel/plugin-syntax-jsx'
,'@babel/plugin-transform-modules-commonjs']}
;// 2. 需要安裝上面出現的所有模組
npm install @babel/preset-env @babel/preset-react @babel/plugin-syntax-jsx @babel/plugin-transform-modules-commonjs

引入babel的plugin模組

相容css

// package.json中的配置

"jest":}
,// 2. 安裝identity-obj-proxy模組
npm install identity-obj-proxy

import attendance from

'../attendance/attendance'
import react from
'react'
;import
"@testing-library/jest-dom/extend-expect"
;import
from
'@testing-library/react'
;jest.
mock
('react-router-dom',(
)=>}}
})test
('attendance test',(
)=>
);

前端單元測試框架jest總結

1 jest 環境搭建 檢視是否安裝成功 cmd進入 front end testing demo example目錄下輸入命令 npm install安裝所需要的依賴包 只有第一次需要安裝依賴包 安裝完成後，輸入npm test執行用例 選擇a執行所有的用例 輸入p是選擇執行哪個檔案的用例 2 j...

jest單元測試實踐總結及react單元測試

jest 是facebook推出的一款測試框架，整合了 mocha，chai，jsdom，sinon等功能。和 mocha 和 chai 的功能很像，甚至可以相容部分 mocha 和 chai 的語法。可以這麼寫 import react from react import from enzyme ...

在VS Code中除錯Jest單元測試

隨著react的流行，jest也成很多專案廣泛使用的測試框架。由於jest預設是併發執行測試，在日常的工作中發現很多同學對於如何除錯jest單元測試犯難。這些小細節有時真是 會者不難，難者不會 這裡給大家介紹如何在code中除錯jest測試的小技巧。注意 這裡需要node v8.4.之前的版本v8有...