測試您的UI

注意

自AEM 6.5起,已棄用hobbes.js UI測試架構。 Adobe不打算對其進行進一步的增強,並建議客戶使用Selenium自動化。

請參閱已棄用和已移除的功能

AEM提供AEM UI測試自動化的架構。 使用框架時,直接在Web瀏覽器中編寫並運行UI測試。 架構提供用於建立測試的javascript API。

AEM測試架構使用Hobbes.js,這是以Javascript撰寫的測試程式庫。 Hobbes.js架構是在開發程式中為測試AEM而開發。 此架構現已可供公開使用,以測試您的AEM應用程式。

注意

如需API的完整詳細資訊,請參閱Hobbes.js 檔案

測試結構

在AEM內使用自動化測試時,下列辭彙是您務必了解的重要項目:

動作 Action​是網頁上的特定活動,如點按連結或按鈕。
測試案例 測試案例​是由一個或多個​操作​組成的特定情況。
測試套裝 測試套裝​是一組相關的​測試案例,這些測試案例共同測試特定使用案例。

執行測試

檢視測試套裝

開啟測試主控台,查看已註冊的測試套裝。 「測試」面板包含測試套裝及其測試案例的清單。

通過​全局導航 — >工具>操作 — >測試​導航到工具控制台。

chlimage_1-63

開啟主控台時,測試套裝會列在左側,並附上可依序執行所有測試套裝的選項。 右側以方格背景顯示的空格是測試執行時顯示頁面內容的預留位置。

chlimage_1-64

運行單個測試套件

測試套裝可個別執行。 當您執行測試套裝時,頁面會隨著測試案例及其動作執行而變更,結果會在測試完成後顯示。 圖示會指出結果。

勾選記號圖示表示通過的測試:

「X」圖示表示測試失敗:

若要執行測試套裝:

  1. 在「測試」面板中,按一下或點選您要執行的「測試案例」名稱,以展開「動作」的詳細資訊。

    chlimage_1-65

  2. 按一下或點選​執行測試​按鈕。

  3. 測試執行時,預留位置會以頁面內容取代。

    chlimage_1-66

  4. 點選或按一下說明以開啟​Result​面板,以檢閱測試案例的結果。 點選或按一下​Result​面板中的測試案例名稱會顯示所有詳細資料。

    chlimage_1-67

運行多項測試

測試套裝會依其顯示在主控台中的順序執行。 您可以深入檢視測試,以查看詳細結果。

chlimage_1-68

  1. 在「測試」面板上,點選或按一下您要執行之測試套裝標題下方的​執行所有測試​按鈕,或​執行測試​按鈕。

  2. 若要檢視每個測試案例的結果,請點選或按一下測試案例的標題。 點選或按一下​Result​面板中的測試名稱會顯示所有詳細資訊。

    chlimage_1-69

建立和使用簡單測試套裝

下列程式會逐步引導您使用We.Retail內容來建立和執行測試套裝,但您可以輕鬆修改測試,以使用不同的網頁。

如需建立自己測試套裝的完整詳細資訊,請參閱Hobbes.js API檔案

  1. 開啟CRXDE Lite。 (https://localhost:4502/crx/de)

  2. 按一下右鍵/etc/clientlibs資料夾,然後按一下​建立>建立資料夾。 鍵入myTests作為名稱,然後按一下​確定

  3. 按一下右鍵/etc/clientlibs/myTests資料夾,然後按一下​建立>建立節點。 使用以下屬性值,然後按一下​OK:

    • 名稱: myFirstTest
    • 類型: cq:ClientLibraryFolder
  4. 將下列屬性新增至myFirstTest節點:

    名稱 類型
    categories String[] granite.testing.hobbes.tests
    dependencies 字串[] granite.testing.hobbes.testrunner
    注意

    僅限AEM Forms

    若要測試適用性表單,請將下列值新增至類別和相依性。 例如:

    類別: granite.testing.hobbes.tests, granite.testing.hobbes.af.commons

    相依性: granite.testing.hobbes.testrunner, granite.testing.hobbes.af

  5. 按一下「全部保存」。

  6. 按一下右鍵myFirstTest節點,然後按一下​建立>建立檔案。 將檔案命名為js.txt,然後按一下​OK

  7. js.txt檔案中,輸入以下文本:

    #base=.
    myTestSuite.js
    
  8. 按一下「儲存全部」,然後關閉js.txt檔案。

  9. 按一下右鍵myFirstTest節點,然後按一下​建立>建立檔案。 將檔案命名為myTestSuite.js,然後按一下​OK

  10. 將下列程式碼複製到myTestSuite.js檔案,然後儲存檔案:

    new hobs.TestSuite("Experience Content Test Suite", {path:"/etc/clientlibs/myTests/myFirstTest/myTestSuite.js"})
       .addTestCase(new hobs.TestCase("Navigate to Experience Content")
          .navigateTo("/content/we-retail/us/en/experience/arctic-surfing-in-lofoten.html")
       )
       .addTestCase(new hobs.TestCase("Hover Over Topnav")
          .mouseover("li.visible-xs")
       )
       .addTestCase(new hobs.TestCase("Click Topnav Link")
          .click("li.active a")
    );
    
  11. 導覽至​Testing​主控台,嘗試您的測試套裝。

本頁內容