Cùng học Cypress (phần 1): Cypress là gì? ưu, nhược điểm

Đây là bài đầu tiên về loạt bài “Cùng học Cypress”, hi vọng là good start cho 1 series mới trên blog của mình. Nói thật, trước đây mình chưa từng học Cypress, chỉ đọc vài dòng giới thiệu. Mình viết series này đúng theo tinh thần 1 người mới học và chia sẻ lại những điều vừa tìm hiểu. Về background, mình nghĩ là mình cũng giống như nhiều bạn, biết chút ít syntax của Javascript (dùng trong postman), ngoài ra thì tất cả đều là mới.

I. Cypress là gì?

Cypress là tool phục vụ cho UI Automation test và chính xác là dành cho web. Nó có chức năng tương đương với Selenium, nhưng được viết bằng javascript và có cách hoạt động hoàn toàn khác biệt.

Nó được giới thiệu là nhanh, đáng tin cậy hơn selenium và có thể dùng cho nhiều level test, từ Unit, Integration đến End-to-end Test. Vì nó được định hình là framework nên chắc chắn nó sẽ có nhiều tính năng tốt hơn selenium, cái đơn thuần là library. Những bài sau mình sẽ trải nghiệm dần những tính năng đó.

II. Sự khác biệt của Selenium và Cypress

1. Architecture

a.Selenium

All You Need To Know About Selenium WebDriver Architecture | Edureka
copy from https://www.edureka.co/blog/selenium-webdriver-architecture/
  1. Ở Client, code test sử dụng thư viện selenium sẽ được chuyển thành nội dung của những request gửi đến cho Driver của Browser.
  2. Những Driver này nhận request và thực thi trên Browser
  3. Sau đó, trả kết quả về cho Client.

Chốt lại: Selenium không tác động trực tiếp lên trang web của chúng ta, nó điều khiển thông qua Driver.

b.Cypress

copy from https://github.com/cypress-io/cypress-documentation/issues/872
  1. Nodejs process sẽ khởi tạo 1 browser với proxy.
  2. Browser này sẽ được hiển thị với 2 iframes. 1 cái là cypress (domain: localhost) và 1 cái là application của chúng ta (domain riêng). Bởi vì các iframes trên browser không thể trao đổi hoặc tương tác lẫn nhau nếu khác domain nên 1 script được cài vào trong application để đổi domain của app thành localhost. Từ đó, cypress có thể access đến các object khác trong app như DOM, Window, LocalStorage…
  3. Cypress cũng tương tác với Nodejs để có thể xin cấp quyền từ hệ điều hành (OS) cho các tác vụ như chụp ảnh hoặc quay video.
  4. Vì browser được khởi tạo cùng với proxy nên cypress quản lý được network ra vào của browser đó, từ đó edit được request và response.

2. Ưu, nhược điểm khác

copy from https://www.toolsqa.com/cypress/what-is-cypress/

III. Tổng kết

Nhìn chung 2 tools đều có điểm mạnh, điểm yếu riêng, rất khó nói tool nào hơn tool nào, chắc tùy bài toán mà dùng cái này thay vì cái kia.

Series sẽ còn rất dài, nên hi vọng mọi người sẽ cho 1 like để ủng hộ tinh thần. Thanks!

+9

Leave a Reply

Your email address will not be published. Required fields are marked *