title: Unable to Attach remote debugger to Chrome headless in Selenium WebDriver
body: <p>I'm running my E2E test cases using Selenium WebDriver with Chrome headless. this configuration working fine and able run test case.</p>
  
  <p>My code looks like this:</p>
  
  <pre><code> const options = {
          desiredCapabilities: {
              port: PORT,
              browserName: 'chrome',
              chromeOptions: {
                  args: ['disable-infobars' 
                  ,'headless',
                  'disable-gpu',
  
              ],
              //binary: '/Applications/Google Chrome Dev.app/Contents/MacOS/Google Chrome'
              binary: '/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome'
  
              }
          },
          host: envConfig.seleniumUrl,
          deprecationWarnings: false
      };
      this.browser = webdriverio
          .remote(options)
          .init()
          .url(envConfig.appUrl)
          .timeouts('script', 35000)
          .timeouts('implicit', 35000);
  </code></pre>
  
  <p>Some of my test case failing so i am trying to attach chrome debugger using chrome launch option</p>
  
  <blockquote>
    <p>--remote-debugging-port=9222</p>
  </blockquote>
  
  <p><a href="https://developers.google.com/web/updates/2017/04/headless-chrome" rel="nofollow noreferrer">https://developers.google.com/web/updates/2017/04/headless-chrome</a></p>
  
  <p>After adding remote debugging port flag My E2E failing and unable to start </p>
  
  <pre><code> const options = {
          desiredCapabilities: {
              port: PORT,
              browserName: 'chrome',
              chromeOptions: {
                  args: ['disable-infobars' 
                  ,'headless',
                  'disable-gpu',
                  '--remote-debugging-port=5552'
              ],
              //binary: '/Applications/Google Chrome Dev.app/Contents/MacOS/Google Chrome'
              binary: '/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome'
  
              }
          },
          host: envConfig.seleniumUrl,
          deprecationWarnings: false
      };
  </code></pre>
  
  <p>Error is </p>
  
  <pre><code>  chrome not reachable
         (Driver info: chromedriver=2.36.540469 (1881fd7f8641508feb5166b7cae561d87723cfa8),platform=Mac OS X 10.12.6 x86_64) (WARNING: The server did not provide any stacktrace information)
       Command duration or timeout: 60.09 seconds
       Build info: version: '3.8.1', revision: '6e95a6684b', time: '2017-12-01T19:05:32.194Z'
       System info: host: 'xxxxxx', ip: 'xxxxxx', os.name: 'Mac OS X', os.arch: 'x86_64', os.version: '10.12.6', java.version: '1.8.0_161'
       Driver info: driver.version: unknownError: An unknown server-side error occurred while processing the command.
           at end() - hooks.js:47:25
  </code></pre>
  
  <p>how to fix this initialization issue and how to attach chrome dev tools with headless browser. </p>