Thử nghiệm tự động hóa với Playwright đang trở nên phổ biến mỗi ngày và có nhiều công cụ có sẵn để giúp bạn trở thành bậc thầy trong lĩnh vực này. Đôi khi phần khó nhất là chọn đúng. Kiểm thử tự động hóa là một công cụ tuyệt vời đang trở nên phổ biến nhờ tính linh hoạt và dễ sử dụng, đặc biệt là với JavaScript. Nhà viết kịch được coi là một trong những người chạy thử nghiệm giao diện người dùng nhanh nhất. Trong bài viết này, chúng tôi sẽ thảo luận về quá trình viết bài kiểm tra đầu tiên của bạn với Playwright bằng cách sử dụng với các ví dụ về mã. Playwright JavaScript Cài đặt nhà viết kịch Trước khi chúng tôi bắt đầu viết trường hợp thử nghiệm đầu tiên của mình, bạn cần cài đặt Playwright. Bạn có thể thực hiện việc này bằng cách chạy lệnh sau trong thiết bị đầu cuối của mình bên trong IDE. Tôi cũng khuyên bạn nên cài đặt (miễn phí và tuyệt vời để tạo các thử nghiệm đầu tiên của bạn) VScode npm install playwright Viết bài kiểm tra đầu tiên của chúng tôi 🍾 trường hợp thử nghiệm Khởi chạy google.com Tìm kiếm nhà viết kịch Kiểm tra Nhà viết kịch trong tiêu đề sau khi tìm kiếm Đóng trình duyệt Trước tiên hãy bắt đầu viết kiến trúc của bài kiểm tra của chúng tôi. const { chromium } = require('playwright'); describe('Google Search Test', () => { let browser; let page; beforeAll(async () => { }); afterAll(async () => { }); it('should return result search in google ', async () => { }); }); luôn xảy ra một lần trước tất cả các bài kiểm tra. Nó khá thuận tiện để sử dụng để thiết lập các yêu cầu kiểm tra trước khi kiểm tra thực tế. beforeAll Ví dụ: tạo dữ liệu cho các thử nghiệm thông qua API hoặc khởi tạo các biến mà bạn sẽ sử dụng trong các thử nghiệm. có cùng ý tưởng với beforeAll. afterAll Nó xảy ra sau tất cả các bài kiểm tra chỉ một lần. Bạn có thể sử dụng để đóng trình duyệt hoặc thực hiện một số hành động để xóa dữ liệu sau khi chạy thử nghiệm. Chúng tôi cần các biến này để hoạt động với trình duyệt và trang sau này. let browser; let page; Đây là phần thân bài kiểm tra, nơi chúng tôi sẽ viết bài kiểm tra thực tế của mình. it('should return result search in google ', async () => { }); Hãy thêm mở một trình duyệt bên trong beforeAll beforeAll(async () => { browser = await chromium.launch(); // here you can use any other browser if you want page = await browser.newPage(); await page.goto('https://www.google.com'); }); Bên trong chúng tôi đã khởi chạy Chrome và điều hướng đến google.com. beforeAll, Hãy thêm một cơ thể thử nghiệm it('should return search results', async () => { await page.fill('id=input', 'Automation testing'); // you an search any other text here await page.press('id=input', 'Enter'); await page.waitForNavigation(); const title = await page.title(); expect(title).toContain('Automation testing'); }); Kết quả của chúng ta ⬆️ Chúng tôi tìm đầu vào trên một trang và viết Nhà viết kịch ở đó. là một phương pháp mà bạn thường sử dụng để nhập giá trị vào đầu vào mà bạn muốn kiểm tra. fill await page.fill('id=input', 'Automation testing'); Chúng tôi mô phỏng nhấn Enter khi chúng tôi đang ở trong đầu vào này. await page.press('id=input', 'Enter'); Chúng tôi đợi cho đến khi tải trang. Vì vậy, chúng tôi sẽ không tiếp tục thử nghiệm trước khi trang được tải đầy đủ. await page.waitForNavigation(); Cuối cùng, chúng tôi sử dụng chức năng để lấy tiêu đề của trang kết quả tìm kiếm. title const title = await page.title(); Sử dụng xác nhận, chúng tôi kiểm tra xem tiêu đề có chứa Nhà viết kịch hay không (hoặc một chuỗi khác mà chúng tôi đang tìm kiếm để xác nhận rằng chúng tôi đã chuyển hướng đến đúng trang) expect(title).toContain('Automation testing'); Hãy thêm đóng trình duyệt bên trong afterAll afterAll(async () => { await browser.close(); }); Bên trong chúng tôi đóng trình duyệt sau khi kiểm tra tất cả afterAll, Chạy thử nghiệm của bạn Điều này sẽ chạy tất cả các bài kiểm tra của bạn npx playwright test Nếu bạn muốn chạy một tệp thử nghiệm cụ thể npx playwright test your-file.js Khi bạn chạy thử nghiệm, Playwright cũng tạo các báo cáo HTML, rất hữu ích để gỡ lỗi. Nó chia bài kiểm tra của bạn thành các bước và nếu bạn có một bài kiểm tra không thành công, bạn luôn có thể biết lỗi xảy ra ở đâu và sửa lỗi nhanh hơn. Chạy cái này để mở báo cáo của bạn npx playwright show-report Hình ảnh chính cho bài viết này được tạo bởi của HackerNoon thông qua lời nhắc "nhà phát triển viết mã". Trình tạo hình ảnh AI
