I. Chuẩn bị

1.Update lên cypress mới nhất (ở thời điểm này là 9.2.1)

npm install --save-dev cypress@9.2.1

2. Open cypress window

Cách 1:

npx cypress open

Cách 2:

Sửa file package.json

"scripts": {
   "cp:open": "cypress open"
}

Run:

npm run cp:open

Nếu run lần 1 gặp lỗi timeout 30000 miliseconds, thì hãy chạy lại thêm lần nữa.

3. Tạo file mới

• Tạo folder: CypressAuto\cypress\integration\first-test

• Tạo file: start.spec.js

II. Một vài lệnh đơn giản

1.Mở 1 trang web

it("open web", () => {
    cy.visit("https://courses.letskodeit.com/practice");
});

Run test

2. Click radio box

Để xác định element, bạn sẽ dùng cy.get(selector)

cy.get("#bmwradio")

Để click thì dùng click()

cy.get("#bmwradio").click();

3. Put text into input field

dùng type(text)

cy.get("#name").type("sample text");

4. Input keys

Bạn muốn gõ 1 vài key trên bàn phím như: Enter, Ese, shift…, thì viết theo cú pháp {key_name}

it("todo mvc", () => {
    cy.visit("https://todomvc.com/examples/react/#/");
    cy.get(".new-todo").type("task #110 {enter}");
});

Mình điền text = “task #110”, rồi mình ấn Enter

5. Chỉ run 1 test duy nhất.

Vì cypress sẽ tự động run lại toàn bộ test nếu mình chỉ chỉnh sửa 1 tí code nên nếu mình chỉ muốn run lại 1 test thôi thì chỉ cần thêm .only

it("todo mvc" ... ) 

--> it.only("todo mvc", ...)

Lưu ý: Khi mình run 2 test ở 2 domain (URL) khác nhau thì snapshot của 1 test sẽ bị mất, đó là điểm hạn chế của cypress.

6. Xem document

Để có thể xem được document của từng command trên cypress, bạn cần thêm reference vào đầu file.

/// <reference types="cypress" />

Code của cả bài:

/// <reference types="cypress" />

it("open web", () => {
    cy.visit("https://courses.letskodeit.com/practice");
    cy.get("#bmwradio").click();
    cy.get("#name").type("sample text");
});

it("todo mvc", () => {
    cy.visit("https://todomvc.com/examples/react/#/");
    cy.get(".new-todo").type("task #110 {enter}");
});

III. Tổng kết

Mình cũng đang học dò dẫm, bạn nào biết rồi thì đừng buông lời nặng nhẹ. Vậy thôi, hẹn các bạn ở bài tiếp theo.