ปัญหาที่เจอ ในการทดสอบ component testing ด้วย Cypress
โดยสิ่งที่ใช้งานประบกอบไปด้วย
- Vite + ReactJS + TypeScript
- มีใช้งาน styled component !!
เมื่อสร้างและ run component testing จะเจอปัญหาดังรูป
การแก้ไขปัญหาเบื้อต้น จะมีใน ISSUE # 22678
มีแนวทางการแก้ไขที่แนะนำมา 2 วิธี ดังนี้
วิธีที่ 1 เพิ่มการอ่าน environment ใน cypress
ด้วยการเพิ่มในไฟล์ cypress/support/component.ts
process = process || { env: {} };
process.env = process.env || {};
วิธีที่ 2 ทำการเพิ่ม config ใน vite.config.ts
ทำการติดตั้ง dependency ชื่อว่า vite-define-envs-plugin
และเพิ่มการอ่าน environment ได้เลย ดังนี้
เพียงเท่านี้ก็แก้ไขได้แบบอ้อม ๆ
หวังว่าทางต้นทางจะแก้ไขให้นะ
