❤️ 🍰 🌹 🎬 🚴♀️ 🏋️♀️ 💻 🚀 💜
這裡記錄了我的學習和開發筆記,歡迎交流 (*´∀`)~♥
© 2024. All rights reserved.
這是我在 2024 年最想聊的一些事。
December 28, 2024 年度回顧 前端測試指南:策略與實踐 Frontend Testing Guide Strategies and Practices WebConf Taiwan 投資 加密貨幣 職涯 閱讀 旅遊 Netflix 影集 電影 生活 JavaScript Patterns 讀書會 The Art of Unit Testing front end testing sharing team work visual testing visual regression testing 團隊合作 學不動了 職涯 讀書會 軟技能 甜點 · 留言
如何撰寫具彈性的測試程式 | 2024 WebConf Taiwan
December 27, 2024 front end testing visual testing WebConf Taiwan AI ChatGPT Chromatic Claude Cypress Frontend Testing Guide Strategies and Practices Integration Test Jest Percy React Testing Library sharing Unit Test visual regression testing 單元測試 整合測試 自動化測試 視覺測試 · 留言
在前端領域,快節奏且不斷革新的開發環境下,如何能在迅速產出的同時保持高品質的程式碼成為一大挑戰,因此「測試」變得十分重要。選擇何種測試方式、如何撰寫和執行測試成為開發者必須深思的議題。缺乏測試的程式碼難以確保品質,而解決這個問題的關鍵在於建立適當的測試策略。因此想藉由這本書來分享我在前端測試領域所積累的實務經驗,希望能對大家有所啟發和幫助。
June 6, 2024 front end testing Frontend Testing Guide Strategies and Practices 前端測試指南:策略與實踐 單元測試 團隊合作 整合測試 端對端測試 自動化測試 視覺測試 AI ChatGPT Cypress DevOps End-to-End Testing GitHub Copilot Integration Test Jest Memori Mixtini Percy pre-commit pre-push React Testing Library sharing TDD team work Unit Test visual regression testing visual testing · 留言
「Visual Testing」MOPCON 2022 逐字稿,歡迎搭配投影片與範例一同服用。
October 15, 2022 visual testing Storybook Percy MOPCON Mixtini Cypress Chromatic 自動化測試 打造高速網站,從網站指標開始!全方位提升使用者體驗與流量的關鍵 視覺測試 visual regression testing Unit Test Jest Integration Test GitHub Actions GitHub End-to-End Testing cypress.io CI/CD 端對端測試 整合測試 單元測試 趨勢科技 Trend Micro pull request sharing · 留言
在動態內容的快照處理上有兩種方法,第一是事先塞入假資料,讓內容維持一致;第二是忽略這個會變動的元素區塊,本文要探討的是如何忽略特定元件。
August 17, 2022 visual testing Chromatic Storybook Mixtini 自動化測試 視覺測試 visual regression testing · 留言
若希望經過特定操作流程後,再做快照,可以嗎?
August 4, 2022 visual testing Chromatic Storybook Mixtini 自動化測試 視覺測試 visual regression testing · 留言
比較 Percy、Chromatic 與 jest-image-snapshot。
July 28, 2022 visual testing Chromatic Percy End-to-End Testing Storybook Cypress cypress.io visual regression testing 自動化測試 視覺測試 端對端測試 · 留言
Cypress + Docker + Chromatic ❤️
April 5, 2022 visual testing Docker Chromatic Cypress 自動化測試 視覺測試 End-to-End Testing 端對端測試 閱讀筆記 Cypress 讀書會 cypress.io visual regression testing 讀書會 · 留言
利用 Chromatic + Storybook 來做 Component-Level 的 Visual Testing。
March 4, 2022 visual testing Chromatic Storybook Percy Mixtini 自動化測試 視覺測試 CI/CD GitHub Actions 讀書會 閱讀筆記 Cypress Cypress 讀書會 visual regression testing · 留言
視覺測試 (visual testing) 是指利用工具自動檢測 UI 變更的一種測試方式。過去我們檢視 UI 的變更,常用的方法大致是 (1) 人眼 (截圖) 比對,比較本次更新與上一版或 mockup 的差異;(2) 工具 diff 由 unit test 或各種測試所產生的快照 (snapshot test)。但這兩種方式都無法很直覺很明確的在第一時間告訴我們到底改了什麼?若能產生指定頁面或元件的圖檔,並且標註更新的部份,這樣在 review 的時候,就更省時更便利了。
February 26, 2022 Percy Storybook visual testing Cypress 視覺測試 自動化測試 GitHub Actions visual regression testing CI/CD End-to-End Testing 端對端測試 讀書會 cron job cypress.io GitHub 閱讀筆記 Cypress 讀書會 · 留言