title: Nightwatch tests fail when running in docker using selenium/chromedriver
body: <p>I am running my whole system using docker-compose and I am trying to execute my end-to-end tests (written with Nightwatch) using a selenium/chrome service that is in the same network. My frontend is VueJS and the image is built from a node base image. I am running the tests with <strong>docker-compose exec frontend npm run test-selenium</strong> and getting the following output:</p>
  <pre><code>&gt; frontend@0.1.0 test-selenium
  &gt; nightwatch -c nightwatch-selenium.conf.js
  
  
  [Login Test] Test Suite
  ──────────────────────────────────────────────
  ℹ Connected to chrome on port 4444 (1494ms).
    Using: chrome (102.0.5005.61) on LINUX.   
  
  
    Running login:
  ───────────────────────────────────────────────────────────────────────────────────────────────────
    ℹ Loaded url http://frontend:8090/login in 2049ms
    NoSuchElementError: An error occurred while running .click() command on &lt;Element [name=@loginBt]&gt;: Timed out while waiting for element &quot;#loginBt&quot; with &quot;css selector&quot; to be present for 5000 milliseconds.
         at Object.login (/app/tests/loginTest.js:8:8)
    NoSuchElementError: An error occurred while running .setValue() command on &lt;Element [name=@emailField]&gt;: Timed out while waiting for element &quot;input[name = &quot;email&quot;]&quot; with &quot;css selector&quot; to be present for 5000 milliseconds.
         at Page.fillUpData (/app/tests/page-objects/loginPage.js:13:21)
         at Object.login (/app/tests/loginTest.js:9:8)
    NoSuchElementError: An error occurred while running .setValue() command on &lt;Element [name=@passField]&gt;: Timed out while waiting for element &quot;input[name = &quot;password&quot;]&quot; 
  with &quot;css selector&quot; to be present for 5000 milliseconds.
         at Page.fillUpData (/app/tests/page-objects/loginPage.js:13:21)
         at Object.login (/app/tests/loginTest.js:10:8)
    NoSuchElementError: An error occurred while running .click() command on &lt;Element [name=@submitBt]&gt;: Timed out while waiting for element &quot;button[name = &quot;submit&quot;]&quot; with 
  &quot;css selector&quot; to be present for 5000 milliseconds.
         at Object.login (/app/tests/loginTest.js:11:8)
    ✖ Testing if the URL contains '/cards' in 5000ms - expected &quot;contains '/cards'&quot; but got: &quot;http://frontend:8090/login&quot; (5143ms)
      at Object.login (/app/tests/loginTest.js:12:15)
  
  
  FAILED: 1 assertions failed and  4 errors (28.22s)
  </code></pre>
  <p>When running tests locally, everything is working just fine. For local tests, I am using the chrome driver installed as dev dependency, accessing the frontend using <strong>http://localhost:8090/</strong>.</p>
  <p>It is my first time dealing with E2E tests in docker, so I am not really sure what is going wrong. Any help is appreciated. Please find the source code below. Let me know if I need to add any more information.</p>
  <ul>
  <li><strong>package.json</strong></li>
  </ul>
  <pre class="lang-json prettyprint-override"><code>&quot;scripts&quot;: {
     ...
      &quot;test&quot;: &quot;nightwatch&quot;,
      &quot;test-selenium&quot;: &quot;nightwatch -c nightwatch-selenium.conf.js&quot;,
     ...
    },
  </code></pre>
  <ul>
  <li><strong>docker-compose.yml</strong></li>
  </ul>
  <pre class="lang-yaml prettyprint-override"><code>services:
    frontend:
      build:
        context: card-market-frontend/
        dockerfile: Dockerfile
      command: npm run serve
      working_dir: /app
      ports:
        - &quot;8090:8090&quot;
  
    chrome:
      image: selenium/standalone-chrome:latest
      hostname: chrome
      privileged: true
      shm_size: 2g  
  </code></pre>
  <ul>
  <li>When running the tests with the <strong>test-selenium</strong> command I am using the nightwatch.conf below:</li>
  </ul>
  <pre class="lang-js prettyprint-override"><code>const chromedriver = require(&quot;chromedriver&quot;);
  
  require(&quot;dotenv&quot;).config();
  
  module.exports = {
    src_folders: [&quot;/tests&quot;],
    page_objects_path: [&quot;tests/page-objects&quot;],
  
    test_workers: false,
  
    selenium: {
      start_process: false,
  
      cli_args: {
        &quot;webdriver.chrome.driver&quot;: chromedriver.path,
      },
    },
  
    webdriver: {
      start_process: false,
    },
  
    test_settings: {
      default: {
        selenium_port: 4444,
        selenium_host: &quot;chrome&quot;,
  
        screenshots: {
          enabled: true,
          path: &quot;tests_output/&quot;,
          on_failure: true,
        },
  
        desiredCapabilities: {
          browserName: &quot;chrome&quot;,
          chromeOptions: {
            w3c: false,
            args: [&quot;--no-sandbox&quot;],
          },
        },
      },
    },
  };
  </code></pre>
  <ul>
  <li>My page object <strong>loginPage.js</strong></li>
  </ul>
  <pre class="lang-js prettyprint-override"><code>module.exports = {
    url: `http://frontend:8090/login`,
    elements: {
      logoutBt: &quot;#logoutBt&quot;,
      loginBt: &quot;#loginBt&quot;,
      emailField: 'input[name = &quot;email&quot;]',
      passField: 'input[name = &quot;password&quot;]',
      submitBt: 'button[name = &quot;submit&quot;]',
    },
    commands: [
      {
        fillUpData(selector, data) {
          return this.setValue(selector, data);
        },
      },
    ],
  };
  </code></pre>
  <ul>
  <li>The test that is running <strong>loginTest.js</strong></li>
  </ul>
  <pre class="lang-js prettyprint-override"><code>module.exports = {
    login(browser) {
      const page = browser.page.loginPage();
      const email = &quot;coolEmail@gmail.com&quot;;
      const pass = &quot;coolPass&quot;;
      page
        .navigate()
        .click(&quot;@loginBt&quot;)
        .fillUpData(&quot;@emailField&quot;, email)
        .fillUpData(&quot;@passField&quot;, pass)
        .click(&quot;@submitBt&quot;)
        .assert.urlContains(&quot;/cards&quot;);
    },
  };
  </code></pre>