無法使用 cypress 訪問 html 元素

Question

我正在嘗試使用 cypress 測試登錄功能，但由於某種原因，我無法訪問輸入文本框。 它顯示 Timed out retrying after 4000ms: Expected to find element: runner container, but never found it。

describe("User authentication", () => {
    beforeEach(() => {
      cy.visit("https://lmflf.com");
     
    });
    it("it takes to the correct page", () => {
   
      cy.get('[data-field=password]')
      
    });
    
  });

Answer 1

我可以在您的網頁中看到一個 shadow DOM，在這種情況下，您必須使用.shadow() ( Cypress Docs )。 您的代碼如下所示：

cy.get('view-login').shadow().find('input[data-field="username"]').type('username', {force: true})
cy.get('view-login').shadow().find('input[data-field="password"]').type('password', {force: true})
cy.get('view-login').shadow().find('input[value="personal"]').click()
cy.get('view-login').shadow().find('.ViewLogin__button').click()