iT邦幫忙

jest相關文章
共有 59 則文章

技術 【Day53】ChatGPT幫我完成工作:寫Jest單元測試!NestJS & Knex & Jest!

這一篇要來介紹使用ChatGPT來撰寫Jest單元測試的結果 有關Jest的介紹,可以看這兩篇:【Day30】ChatGPT請教教我:Jest 單元測試(上)...

技術 【Day31】ChatGPT請教教我:Jest 單元測試(下) - 完整語法&教學

上一篇將討論了Jest的基本介紹和安裝 Jest基本上就是針對「小單元」進行題目與答案的設計在輸入指定的input的情況下,必定獲得固定的output,且能夠預...

鐵人賽 自我挑戰組 DAY 30

技術 【Day30】ChatGPT請教教我:Jest 單元測試(上) - 基本介紹&起始安裝

上個章節中,有提到Nx有自動整合Jest單元測試的事情這個章節的起始安裝會先分成兩個部分: 非使用Nx框架,從頭開始安裝Jest單元測試並運行 使用Nx框架,...

鐵人賽 SideProject30 DAY 28

技術 Day 28 自動化測試 jest

Day 28 自動化測試 jest 在開源專案中,為了要確保程式碼的品質,並讓使用這個 SDK 的開發者能放心的使用,通常我們會寫一些自動化測試程式。 設定自動...

鐵人賽 Modern Web DAY 14

技術 [Day 14] 理解整合測試(ㄧ)

整合測試(Integration Test)與單元測試的區別如其字面上意思。整合測試是針對多個單元測試之間的交互進行測試。通常也使用 Jest、Mocha.js...

鐵人賽 自我挑戰組 DAY 13

技術 [Day 13] 測試思維 & 單元測試 - (9) 每個測試都該是獨立的,那些你該清的 api mock data

為什麼要清除 mocking api function? 先說最終目的:避免每個 test case 的結果互相干擾 在單元測試的藝術中 (Section 8....

鐵人賽 Modern Web DAY 11

技術 [Day 11] 理解單元測試(二)- 簡介 Jest

今天要來簡介一下最廣為使用的測試框架 - Jest。其 官方文件 寫得十分平易近人。 安裝與運行 首先,於專案中安裝 jest。npm install --sa...

鐵人賽 影片教學 DAY 4

技術 為專案中加入 Jest,避免未來的自己踩到現在挖的坑 👍

閱讀別人的 Code 是有一定難度的,包含過去自己寫的也是一樣的道理。 所以修改程式碼時,都會難免產生 bug 以及產生更多工作機會,而各種測試都可以有效的避免...

鐵人賽 Modern Web DAY 9

技術 測試工具 Jest 跟 Cypress

NX 的 Next 模板在建立時已經預設有 Jest 跟 React Testing Library ,可以直接寫測試。 import { render } f...

鐵人賽 Modern Web DAY 1

技術 [Day 1] 為什麼要寫Custom Hook與測試

前言 當我們還是新手時,常常寫了一大堆程式碼,程式碼越來越亂,UI與邏輯瘋狂耦合,發生bug又找不到在哪,又發現好多地方都是差不多的功能,卻每個地方都寫不一樣,...

鐵人賽 DevOps DAY 24

技術 Day 24 — 做點小小研究:測試開發網站流程

30天也剩沒幾天了,現在才要進入 devops?! 圖片來源:Docker (@Docker) / Twitter 前面基礎建設都弄好了接下來就以簡易的前...

鐵人賽 Modern Web

技術 Extra07 - Jest - 單元測試框架

此篇為番外,為選入本篇的原因為 Jest 的功能與單元測試的方式多元且複雜,此篇僅能做初步的介紹,因此放於番外作補充。 隨著 TDD 的流行,單元測試在現在...

鐵人賽 Modern Web DAY 29

技術 Day 29 - 實戰演練 — 元件單元測試

測試會用到的工具是 React Testing Library,後續對元件有改動時也可以使用 Snapshot testing。 基本上測試撰寫的 SOP 就...

鐵人賽 Modern Web DAY 22

技術 [Day22] Vue 3 單元測試 (Unit Testing) - Testing Vuex

今天這篇文章主要想介紹兩個重點: 測試使用 Vuex 的元件 測試 Vuex 本身 Testing Component with Vuex 下面是一個使用了...

鐵人賽 Modern Web DAY 21

技術 [Day21] Vue 3 單元測試 (Unit Testing) - Props & Computed

Props 與 Computed 是開發元件最常使用的屬性,下面的範例是一個運用 Props 與 Computed 的簡單例子。 import { ref, c...

鐵人賽 Modern Web DAY 20

技術 [Day20] Vue 3 單元測試 (Unit Testing) - Form Elements Handling

幾乎每個網站都會使用到表單元素 (Form Elements),例如登入頁、註冊頁就有非常多個輸入框(<input>)在其中,又或者是網站的 hea...

鐵人賽 Modern Web DAY 19

技術 [Day19] Vue 3 單元測試 (Unit Testing) - Event Handling

Event Handling 在開發元件時一定少不了會需要觸發事件的時候,像是 click 事件、input 事件等等,所以我來用簡單的 Counter 來示範...

鐵人賽 Modern Web DAY 18

技術 [Day18] Vue 3 單元測試 (Unit Testing) - Conditional rendering & Elements visibility

Conditional Rendering 在寫元件時最常見的就是會使用 v-if 來動態插入和刪除元素,我們馬上來看看下面的範例程式。 const Compo...

鐵人賽 Modern Web DAY 17

技術 [Day17] Vue 3 單元測試 (Unit Testing) - Vue Test Utils + Jest 基本範例 & 核心語法

在開始進入複雜的內容之前,我想先帶大家認識幾個會大量出現在每一個測試程式碼裡的核心語法,這些語法如果不了解的話可能就沒辦法看懂之後的測試程式碼,所以我們趕快開始...

鐵人賽 Modern Web DAY 16

技術 [Day16] Vue 3 單元測試 (Unit Testing) - Vue Test Utils + Jest 基本介紹 & 安裝

什麼是單元測試? 單元測試 (Unit Testing) 是針對程式碼的最小單位來進行正確性檢驗的測試工作,並確保程式碼不會在迭代維護的過程中出現 Bug,通過...

鐵人賽 Modern Web DAY 24

技術 【Day24】來到了測試的總整理啦 ヽ(‘ ∇‘ )ノ

來到測試的尾聲,來把前面所學的整理一下吧! First Step => 要進行測試,我們勢必要有東西給它測試,而且也要有可以進行測試的套件 利用以...

鐵人賽 Modern Web DAY 23

技術 【Day23】計數器減號按紐及測試小練習,先別偷看解答R ~ (⁎˃ᆺ˂)

這篇要來個小小練習,增加一個減號的按鈕,並針對其結果作一個單元測試。 先別往下看,給自己五到十分鐘... 再往下看解答 ! 首先,和累加的按鈕一樣,我們先在畫...

鐵人賽 Modern Web DAY 22

技術 【Day22】判斷計數器數字初始值是否為0且按下增加的按鈕時結果是否正確 「(°ヘ°)

上一篇針對了計數器Component做了三個單元測試,Component、計數器按鈕、計數器的數字是否正常顯示, 還少了兩個單元測試 => 計數器數字的初...

鐵人賽 Modern Web DAY 21

技術 【Day21】補上data-test屬性及判斷Component和按鈕及數字是否正確顯示(╯✧∇✧)╯

基本上我們會用到 計數器這整個Component (div) 、顯示數字 (span)、按鈕(button)這三個DOM, 所以先在我們的Component上加...

鐵人賽 Modern Web DAY 20

技術 【Day20】建立計數器的Test,並提供測試使用的方法 ୧☉□☉୨!

上一篇我們把計數器Component完成了,這篇要來寫這個計數器的測試了! 首先我們要先建立一個屬於它的測試檔案 (還記得之前有提過說測試檔案的名稱要是那個Co...

鐵人賽 Modern Web DAY 19

技術 【Day19】用Bootstrap和Fontawesome來刻我們的計數器吧 (´∀`)!!

我們先來畫我們的計數器吧! 為了讓我們的計數器精美一點點點, 我們先來安裝React的fontAwesome(一些icon)和React的bootstrap吧!...

鐵人賽 Modern Web DAY 18

技術 【Day18】在使用者模式移除data-test屬性,淺談React Hook (•‿•)

上一篇有提到,我們可以在使用者模式(Production mode)將屬性隱藏起來不讓使用者看到。 首先~我們先來安裝一個babel套件 npm install...

鐵人賽 Modern Web DAY 17

技術 【Day17】 data-test這個屬性是用來幹嘛的...? 這東西能吃嗎 (╯✧∇✧)╯ !?

其實在html裡,我們可以給予以data開頭的屬性, data-test這個屬性只是方便我們來辨別它是測試用的屬性 在html標籤上鑲入data-test屬...

鐵人賽 Modern Web DAY 16

技術 【Day16】單元測試不用每次都寫一樣的東西吧!? 把常用的function寫成共用的吧୧☉□☉୨!

首先!! 我們先來建立渲染Component的function (這邊用的會是es6的箭頭函式) const setup=()=>shallow(<...

鐵人賽 Modern Web DAY 15

技術 【Day15】Enzyme的兩個常用渲染API及Jest的幾個API,和..設計測試的幾個要點 (・θ・)

為了讓我們的測試看起來乾淨,就跟寫Code一樣,淺顯易懂是原則,所以我們要把握以下兩點! DRY(Don't Repeat Yourself) =>...