iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

循序漸進學習 Javascript 測試 系列

主要內容為學習 TESTING JAVASCRIPT with Kent C. Dodds 系列課程的心得與筆記。

鐵人鍊成 | 共 30 篇文章 | 32 人訂閱 訂閱系列文 RSS系列文
DAY 11

Day11 實戰 Jest 配置:搞定前端測試配置,了解 Jest 如何在 Node 環境測試 Browser code

確保測試時讓 Babel 編譯 modules 在前端專案裡,我們通常會使用 Webpac 搭配 Babel Loader 來編譯瀏覽器不相容的語法,Webpa...

2020-09-26 ‧ 由 TWGD 分享
DAY 12

Day12 實戰 Jest 配置:Jest Snapshots 幫助撰寫跟維護 assertions

為什麼需要 Snapshot testing? 假設我們有個檔案 super-heros.js ****export getFlyingSuperHeros ,...

2020-09-27 ‧ 由 TWGD 分享
DAY 13

Day13 實戰 Jest 配置:Jest moduleDirectories

配置 moduleDirectories 讓 Jest 支援自訂的 Module Resolution 有時候,專案可能有些 modules 會被多個文件頻繁引...

2020-09-28 ‧ 由 TWGD 分享
DAY 14

Day14 實戰 Jest 配置:增進 Development Experience

使用 Jest Watch Mode 加速測試開發 目前若要執行測試的話,都要 npm run test 一次,在開發階段每次更新檔案都要執行一次重複的動作,有...

2020-09-29 ‧ 由 TWGD 分享
DAY 15

Day15 實戰 Jest 配置:以不同的配置跑測試

使用 —config Flag 及 testMatch Option 以不同的配置跑測試 假設專案除了前端的程式碼之外,也有單純運行在 node.js 環境的程...

2020-09-30 ‧ 由 TWGD 分享
DAY 16

Day 16 測試 React 元件:render 元件及使用 Jest DOM & dom-testing-library

使用 ReactDOM 來 Render 被測試元件 假設現在有一個 <FavoriteNumber /> 元件,我們要測試它是否有 render...

2020-10-01 ‧ 由 TWGD 分享
DAY 17

Day 17 測試 React 元件:使用 React Testing Library 測試元件的狀態

昨天我們學習了如何在測試裡 render 元件,並使用 testing library 家族的 jest-dom 及 dom-testing-library 來...

2020-10-02 ‧ 由 TWGD 分享
DAY 18

Day 18 測試 React 元件:測試元件的 Event Handlers

目前為止我們已經了解該如何使用 React Testing Library 的 render 跟 debug 來 測試元件的狀態了。 今天我們將繼續探索如何測試...

2020-10-03 ‧ 由 TWGD 分享
DAY 19

Day 19 測試 React 元件:Mock HTTP Requests

如果元件內有牽涉 HTTP requests ,我們通常需要在測試中 mock 它們。今天將學習如何測試元件的時候 mock 這些 HTTP requests。...

2020-10-04 ‧ 由 TWGD 分享
DAY 20

Day 20 測試 React 元件:測試 Error Boundary 元件

在 React 應用程式中,Error Boundary 是一種用來捕捉錯誤的元件,今天我們來學習如何測試 Error Boundary。先看一下元件的程式碼:...

2020-10-05 ‧ 由 TWGD 分享