WebDriver测试中如何隐藏浮动元素避免截图重复捕获

我们的WebDriver测试需要隐藏一个浮动元素，该元素在浏览器向下滚动页面时会多次被截图捕获。

第一次尝试的代码及报错 #

it('should save Food blog page screenshotsscreenshots', async () => {
    const adjustedURL = new browser();
    await adjustedURL
      .url('en-au/blog/elements-and-templates-food-sustainability/')
      .execute(() => {document.getElementByID("_hjSafeContext_7335155").style["opacity"] = "0";})
      .pause(4000)
      .saveFullPageScreen('AU-Food-blog', {});
  });

收到错误：TypeError: browser is not a constructor

第二次尝试的代码及报错 #

it('should save Food blog page screenshotsscreenshots', async () => {
    await browser
      .url('en-au/blog/elements-and-templates-food-sustainability/')
      .execute(() => {document.getElementByID("_hjSafeContext_7335155").style["opacity"] = "0";})
      .pause(4000)
      .saveFullPageScreen('AU-Food-blog', {});
  });

出现错误：browser.url(...).execute is not a function

后续调整（Edit2） #

发现Intercom的HTML结构发生变化，需要定位.intercom-lightweight-app，尝试以下代码：

it('should save Food blog page', async () => {
    await browser.url('en-au/blog/elements-and-templates-food-sustainability/');
    await browser.pause(7000)
    await browser.execute(() => {document.querySelector(".intercom-lightweight-app").style.display = "none";});
    await browser.execute(() => {document.querySelector(".intercom-lightweight-app").style.position = "relative";});
    await browser.saveFullPageScreen('AU-Food-blog', {});
  });

手动将.intercom-lightweight-app-launcher的opacity设为0时，Intercom组件会消失，但上述WebDriver代码修改后，该组件仍出现在截图中。

内容的提问来源于stack exchange，提问作者Steve