Giới thiệu

• Playwright và VS Code đều là con cưng của nhà Microsoft, nên đương nhiên là sẽ hỗ trợ lẫn nhau tốt.
• Trong bài này, bạn sẽ học được:
• Cách cài đặt Playwright extension cho VS Code
• Cài đặt Playwright bằng VS Code (lần trước là dùng CLI)
• Chạy test
• Debug test
• Generate test

Cài đặt extension

• Bạn có thể click vào link: https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright để cài đặt.
• Hoặc bạn vào Tab extension trên Playwright, search “Playwright Test for VSCode” để cài đặt.
  

Cài đặt Playwright bằng VS Code

• Mở command palette, tìm “Test: Install Playwright”.
• Chọn Install Playwright.
• Tích chọn các option phù hợp
  

Chạy test

• Sử dụng nút tam giác xanh ở cạnh mỗi test
  
• Để hiển thị browser, tích chọn “Show browser”
  
• Để chạy toàn bộ test, click vào nút run ở tab Test
  
• Để chạy trên một trình duyệt cụ thể, chọn profile tại tab test
  
• Có thể chọn nhiều profile
  
• Có thể show trace sau mỗi lần chạy xong
  

Debug test

• Để debug test thì click chuột phải vào hình tam giác xanh (lúc trước dùng để run, chọn debug).
  
• Khi debug có rất nhiều options để điều khiển test:
• Tiếp tục chạy
• Chạy qua dòng hiện tại
• Chạy vào hàm bên trong.
• Thoát khỏi hàm hiện tại.
• Restart tại test.
• Stop debug.
  
• Bạn cũng có thể debug trên nhiều browser khác nhau
  
• Có thể thay đổi cả profile mặc định
  

Generate test

• Phần này nói khá kĩ ở bài codegen rồi, anh em vào đây đọc nhé: Vọc Playwright – Code gen, hoặc xem video cũng được.