javascript - 在默认 NightWatch 浏览器实例中启用和修改 Chome 扩展(特别是 ModHeader 扩展)

Question

我正在使用 NightWatch.js 并进行一些 UI 测试，我想用一些额外的 desiredCapabilities 启动默认浏览器实例(即启用扩展并应用一些特定值)。 p>

注意:我可以执行这些操作，但不能在默认浏览器实例 中执行。

为了完全清楚，手动执行操作如下所示: 扩展链接: https://chrome.google.com/webstore/detail/modheader/idgpnmonknjnojddfkpgkljpfnnfcklj

我能够启用扩展并使用存储在 pageObject 文件中的此命令更新值:

setChromeOptions(url) {
  const chromeCapabilities = webdriver.Capabilities.chrome();

  // setting chrome options
  const chromeOptions = {
    args:

    // path to local ModHeader extension
    ['--load-extension=/Users/raja.bellebon/AppData/Local/Google/Chrome/User Data/Default/Extensions/idgpnmonknjnojddfkpgkljpfnnfcklj/2.1.2_0/'],
  };

  chromeCapabilities.set('chromeOptions', chromeOptions);
  const driver = new webdriver.Builder().withCapabilities(chromeCapabilities).build();
  driver.get('chrome-extension://idgpnmonknjnojddfkpgkljpfnnfcklj/_generated_background_page.html');

  // setup ModHeader extension with the header value
  driver.executeScript(`
    localStorage.setItem('profiles', JSON.stringify([{ /* eslint-env browser*/
      title: 'Selenium',
      hideComment: true,
      appendMode: '',
      headers: [
      { enabled: true, name: 'X-Static-Homepage', value: 'true' },
      ],
      respHeaders: [],
      filters: [],
    }]))`);
  driver.get(url);
  return this;
}

该函数在测试开始时调用(作为第一步或在 before 内)。当我执行代码时，会打开第二个浏览器窗口并在其中执行操作。同时，主(或默认)浏览器实例没有扩展名。 如何在主浏览器实例中修改扩展程序？

看了几个博客后，我发现我可能需要修改 conf.js 并在那里应用我的代码，但我无法获取/修改当前驱动程序。

我一直头痛不已...任何帮助将不胜感激，谢谢!

Answer 1

抱歉回复晚了。我只是想出了如何去做，所以如果你将来需要它，我想分享。

首先，在您的 nightwatch.json 文件中，设置所需的功能，如下所示:

"desiredCapabilities": {
    "javascriptEnabled": true,
    "acceptSslCerts": true,
    "browserName": "chrome",
    "chromeOptions": {
      "args": ["--load-extension=/home/pratik/.config/google-chrome/Default/Extensions/idgpnmonknjnojddfkpgkljpfnnfcklj/2.1.2_0"]
    }
  }

然后在你的测试中，

before: (client) => {
  modHeaderPage = client.page.modHeaderPage();
  modHeaderPage.setHeader();
  homePage = client.page.homePage();
}

您的页面对象如下所示:

module.exports = { 
  elements: {},
  commands: [{
    setHeader() {

      // set the context on the extension so the localStorage can be accessed
      const url = 'chrome-extension://idgpnmonknjnojddfkpgkljpfnnfcklj/2.1.2_0/settings.tmpl.html'; // modHeader extension
      this.navigate(url).waitForElementPresent('body', 20000);

      // setup ModHeader with header
      this.api.execute(`
        localStorage.setItem('profiles', JSON.stringify([{ /* eslint-env browser*/
          title: 'Selenium',
          hideComment: true,
          appendMode: '',
          headers: [
            { enabled: true, name: 'Header_Name', value: 'Header_Value' },
          ],
          respHeaders: [],
          filters: [],
     }]))`);
    },
  }],
};