元素在chromedriver DOM中显示，但量角器显示失败：元素不可交互

Question

我在量角器测试套件中收到错误Failed: element not interactable。

基本上，我试图单击一个复选框，但它告诉我不能执行此操作，因为该元素未显示在DOM上。但是，当我运行测试套件并弹出Chromedriver浏览器并通过模拟测试运行时，我可以在屏幕上看到我要单击的元素！

这是浏览器通过测试运行时的屏幕截图。

我已经验证了元素确实存在于DOM上，并且具有expect(elementToTest.isPresent()).toBe(true)的作用，并且它通过得很好。当我执行expect(elementToTest.isDisplayed()).toBe(true)时，它返回false。

现在，我尝试通过使用browser.driver.manage().window().maximize();最大化浏览器窗口来解决此问题，但此操作无济于事。

我尝试将鼠标悬停并滚动到该元素，等待其可单击，等待其显示，使浏览器进入休眠状态，但随后这些返回Timeout错误。

所以，我不知道该怎么办。任何帮助将大有帮助。

describe('purposes page', () => {
  beforeEach(() => {
    utils.clearCookies();
    browser.driver.manage().window().maximize();
    browser.waitForAngularEnabled(false);
    browser.get("/");
    browser.sleep(800);
    element(by.css('[class*=introV2_rejectAll]')).click();
  });

  describe('purpose controls', () => {
    it('clicking a toggle works', () => {
      const switchEl = element(by.css('[class*=switch_switch]'));
      const parentEl = element(by.css('[class*=purposes_active]'));
      expect(switchEl.getAttribute('class')).toContain('switch_isSelected');
      expect(parentEl.getText()).not.toContain('Inactive');

      switchEl.click();
      browser.sleep(800);
      expect(switchEl.getAttribute('class')).not.toContain('switch_isSelected');
      expect(parentEl.getText()).toContain('Inactive');
    });
  }

switchEl.click();语句是失败的测试。返回的错误消息如下所示：

Failures:
1) purposes page purpose controls clicking a toggle works
  Message:
    Failed: element not interactable
      (Session info: chrome=77.0.3865.120)
    Build info: version: '3.141.59', revision: 'e82be7d358', time: '2018-11-14T08:25:53'
    System info: host: 'IAB-MAC-00012.local', ip: '2601:600:8180:1d50:c88e:3c0c:171c:663e%en0', os.name: 'Mac OS X', os.arch: 'x86_64', os.version: '10.14.6', java.version: '13'
    Driver info: driver.version: unknown
  Stack:
    WebDriverError: element not interactable
      (Session info: chrome=77.0.3865.120)
    Build info: version: '3.141.59', revision: 'e82be7d358', time: '2018-11-14T08:25:53'
    System info: host: 'IAB-MAC-00012.local', ip: '2601:600:8180:1d50:c88e:3c0c:171c:663e%en0', os.name: 'Mac OS X', os.arch: 'x86_64', os.version: '10.14.6', java.version: '13'
    Driver info: driver.version: unknown
        at Object.checkLegacyResponse (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/error.js:546:15)
        at parseHttpResponse (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/http.js:509:13)
        at /Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/http.js:441:30
        at processTicksAndRejections (internal/process/task_queues.js:85:5)
    From: Task: WebElement.click()
        at thenableWebDriverProxy.schedule (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/webdriver.js:807:17)
        at WebElement.schedule_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/webdriver.js:2010:25)
        at WebElement.click (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/webdriver.js:2092:17)
        at actionFn (/Users/zackcarlson/Desktop/Git/cmp/node_modules/protractor/built/element.js:89:44)
        at Array.map (<anonymous>)
        at /Users/zackcarlson/Desktop/Git/cmp/node_modules/protractor/built/element.js:461:65
        at ManagedPromise.invokeCallback_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:1376:14)
        at TaskQueue.execute_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:3084:14)
        at TaskQueue.executeNext_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:3067:27)
        at /Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:2927:27Error
        at ElementArrayFinder.applyAction_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/protractor/built/element.js:459:27)
        at ElementArrayFinder.<computed> [as click] (/Users/zackcarlson/Desktop/Git/cmp/node_modules/protractor/built/element.js:91:29)
        at ElementFinder.<computed> [as click] (/Users/zackcarlson/Desktop/Git/cmp/node_modules/protractor/built/element.js:831:22)
        at UserContext.<anonymous> (/Users/zackcarlson/Desktop/Git/cmp/spec/purposes.spec.js:103:15)
        at /Users/zackcarlson/Desktop/Git/cmp/node_modules/jasminewd2/index.js:112:25
        at new ManagedPromise (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:1077:7)
        at ControlFlow.promise (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:2505:12)
        at schedulerExecute (/Users/zackcarlson/Desktop/Git/cmp/node_modules/jasminewd2/index.js:95:18)
        at TaskQueue.execute_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:3084:14)
        at TaskQueue.executeNext_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:3067:27)
    From: Task: Run it("clicking a toggle works") in control flow
        at UserContext.<anonymous> (/Users/zackcarlson/Desktop/Git/cmp/node_modules/jasminewd2/index.js:94:19)
        at /Users/zackcarlson/Desktop/Git/cmp/node_modules/jasminewd2/index.js:64:48
        at ControlFlow.emit (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/events.js:62:21)
        at ControlFlow.shutdown_ (/Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:2674:10)
        at /Users/zackcarlson/Desktop/Git/cmp/node_modules/selenium-webdriver/lib/promise.js:2599:53
    From asynchronous test: 
    Error
        at Suite.<anonymous> (/Users/zackcarlson/Desktop/Git/cmp/spec/purposes.spec.js:96:5)
        at Suite.<anonymous> (/Users/zackcarlson/Desktop/Git/cmp/spec/purposes.spec.js:95:3)
        at Object.<anonymous> (/Users/zackcarlson/Desktop/Git/cmp/spec/purposes.spec.js:3:1)

Answer 1

问题是因为该元素位于DOM中，但是在UI中呈现需要花费一些时间。因此，您应该在访问元素之前添加一些等待时间。

如果等待不起作用，请尝试下面的javascript执行程序

ele = element(by.css('[class*=switch_switch]'));
await browser.executeScript('arguments[0].click()', ele);

希望它对您有帮助