在 Cypress 上執行測試用例後，我們需要除錯並瞭解日誌以防失敗。Cypress 具有向用戶提供有關失敗發生前後發生了什麼事件的資訊的功能。以上螢幕截圖顯示了執行的測試用例的完整日誌，以及透過/失敗結果。如果我們透過單擊它進一步調查該步驟，則已對其執行操作的元素將用紅色圓圈突出顯示。例如，螢幕截圖中的 type 命令。在進一步調查中，我們發現我們有 ... 閱讀更多

Cypress 有一系列可以應用於瀏覽器上任何元素的通用斷言。斷言是檢查點，用於確認自動化測試用例的測試步驟是透過還是失敗。因此，它檢查被測應用程式的預期狀態。Cypress 將 Chai、JQuery 和 Sinon 庫捆綁用於斷言。一些斷言與元素以及父命令相關聯，不能用作獨立命令。例如，should()。但是，有一些斷言直接作用於元素，並且不依賴於其他命令。例如，expect()。 ... 閱讀更多

除了 Cypress 用於唯一識別元素的 css 選擇器之外，還有一個 Cypress 外掛可以自動為每個元素提供 css。此外掛稱為 Open Selector Playground，並隨 Cypress Test Runner 一起提供。此外掛顯示在 Test Runner 視窗的左上方。我們需要單擊它，然後監視我們想要識別的元素。監視該元素後，css 選擇器值會預設填充。要識別該元素，請監視該元素。請注意，css 值會填充為 #gsc-i-id1 以及 ... 閱讀更多

Cypress 必須識別頁面上的元素才能對其執行操作。元素的唯一識別是在 Cypress 中使用 jQuery 選擇器完成的，該選擇器基本上源自 css 選擇器。其他自動化工具（如 Selenium）支援 id、name、classname、link text、partial link text、xpath 和 css 選擇器等定位器。編寫 css 選擇器的規則如下：使用類名屬性。基於唯一類名的元素選擇是在 (.) 符號的幫助下完成的。自定義 css 表示式應為 (.classname)。讓我們考慮以下 html ... 閱讀更多

Cypress 支援 Chrome、Firefox、Microsoft Edge 和 Electron 瀏覽器來執行測試用例。一旦我們在我們的機器上下載 Cypress，它就會自動捆綁 Electron 瀏覽器。瀏覽器會定期更新到較新版本。為了匹配這一點，Cypress 還會修復已釋出瀏覽器最新版本中的問題。但是，對於每個 Electron 瀏覽器版本，Cypress 都會進行徹底測試，並且所有測試用例都應透過。在從測試執行程式執行測試用例時，我們必須從測試執行程式右上角出現的下拉列表中選擇要執行的瀏覽器 ... 閱讀更多

完成 Cypress 安裝併成功設定測試執行程式後，我們將在 examples 資料夾下建立一個 JavaScript 檔案。這屬於 Cypress 框架模板提供的整合資料夾。為了建立 Cypress 測試，我們需要遵循任何 Javascript 測試框架，如 Jasmine 或 Macha。我們必須實現我們的 Cypress 測試，並藉助這些框架使其可執行。Mocha 框架預設情況下與 Cypress 安裝捆綁在一起。我們將遵循下面列出的規則，因為 Mocha 或 Jasmine 框架支援：首先，我們應該有一個 ... 閱讀更多

Cypress 測試執行程式是此工具的重要功能之一。測試執行程式基本上是使用 Cypress 開始任何測試用例執行的入口。在執行測試用例中的每個步驟時，Cypress 允許我們監控對被測應用程式上的命令的執行。在我們完成 Cypress 的安裝後，工具在終端上會提供一個建議：您可以透過執行以下命令開啟 Cypress：node_modules/.bin/cypress open接下來，我們將從專案路徑執行命令 node_modules/.bin/cypress open。執行此命令後，使用者將收到通知，告知 Cypress 正在首次執行 ... 閱讀更多

要執行 Cypress 安裝，首先我們需要下載 Node，因為要使用 Javascript 工具，我們需要在系統中安裝 Node。接下來，我們需要訪問官方網站：https://nodejs.com.tw/en/download/ 並根據系統要求下載。對於 Windows 系統，我們只需要一步一步地執行步驟。它將儲存在 Program files 中。我們需要在環境變數中設定 node 主目錄的路徑。接下來，為了使用 Cypress，我們需要在系統中安裝一個編輯器。我們可以下載 Microsoft Visual Studio Code 編輯器來編寫 ... 閱讀更多

下圖描述了 Cypress 架構。大多數自動化測試工具（如 Selenium）透過從瀏覽器外部執行並透過網路執行遠端命令來執行。Cypress 具有完全不同的功能。Cypress 位於瀏覽器本身。在 Cypress 的後臺，存在 Node.js 伺服器。Node 伺服器和 Cypress 不斷互動、調整和執行操作，以相互支援。因此，Cypress 可以訪問應用程式的前端和後端。這有助於它同時對應用程式上的即時事件採取行動並執行 ... 閱讀更多

Cypress 是未來測試前端現代 Web 應用程式的工具。它旨在克服工程師和開發人員在測試基於 React 和 AngularJS 的 Web 應用程式時面臨的障礙。它是一個快速、輕鬆且可靠的工具，用於測試在瀏覽器上執行的任何應用程式。Cypress 通常與 Selenium 進行比較。但是，在架構和基礎方面，Cypress 和 Selenium 之間存在許多差異。Cypress 針對以下列出的目的：單元測試整合測試端到端流程測試因此，Cypress 用於測試在 ... 閱讀更多