wdio-devtools-service: adding debuggerAddress parameter (#3841)

## Proposed changes

Fix #3744 . 

[//]: # (Describe the big picture of your changes here to communicate to the maintainers why we should accept this pull request. If it fixes a bug or resolves a feature request, be sure to link to that issue.)

## Types of changes

[//]: # (What types of changes does your code introduce to WebdriverIO?)
[//]: # (_Put an `x` in the boxes that apply_)

- [x] Bugfix (non-breaking change which fixes an issue)

## Checklist

[//]: # (_Put an `x` in the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code._)

- [x] I have read the [CONTRIBUTING](https://github.com/webdriverio/webdriverio/blob/master/CONTRIBUTING.md) doc
- [x] I have added tests that prove my fix is effective or that my feature works
- [x] I have added necessary documentation (if appropriate)

## Further comments

I'm not sure that my implementation will work :). 
1) Is adding `constructor` will add possibility to add parameter in wdio config like I wrote in `README.md`?
2) Could someone help with tests. I'm not familiar with mocking stuff?

[//]: # (If this is a relatively large or complex change, kick off the discussion by explaining why you chose the solution you did and what alternatives you considered, etc...)

### Reviewers: @webdriverio/technical-committee

packages/wdio-devtools-service/README.md

@@ -35,10 +35,13 @@ In order to use the service you just need to add the service to your service lis
 // wdio.conf.js
 export.config = {
   // ...
-  services: ['devtools'],
+  services: [['devtools', {
+      debuggerAddress: '10.0.0.3:9222'
+  }]],
   // ...
 };
 ```
+- `debuggerAddress` - optional parameter, you could set host and port.
 
 ## Usage
 

packages/wdio-devtools-service/src/index.js

@@ -7,7 +7,8 @@ const log = logger('@wdio/devtools-service')
 const UNSUPPORTED_ERROR_MESSAGE = 'The @wdio/devtools-service currently only supports Chrome version 63 and up'
 
 export default class DevToolsService {
-    constructor () {
+    constructor (options = {}) {
+        this.options = options
         this.isSupported = false
     }
 
@@ -27,8 +28,14 @@ export default class DevToolsService {
         }
 
         try {
-            const { host, port } = await findCDPInterface()
-            const client = await getCDPClient(host, port)
+            let debuggerAddress
+            if (this.options.debuggerAddress) {
+                const [host, port] = this.options.debuggerAddress.split(':')
+                debuggerAddress = { host, port: parseInt(port, 10) }
+            } else {
+                debuggerAddress = await findCDPInterface()
+            }
+            const client = await getCDPClient(debuggerAddress)
             this.commandHandler = new CommandHandler(client, global.browser)
         } catch (err) {
             log.error(`Couldn't connect to chrome: ${err.stack}`)

packages/wdio-devtools-service/src/utils.js

@@ -42,7 +42,7 @@ export async function findCDPInterface () {
     return { host: 'localhost', port }
 }
 
-export function getCDPClient (host, port) {
+export function getCDPClient ({ host, port }) {
     return new Promise((resolve) => CDP({
         host,
         port,

packages/wdio-devtools-service/tests/service.test.js

@@ -1,6 +1,7 @@
 import DevToolsService from '../src'
 
 import logger from '@wdio/logger'
+import { getCDPClient } from '../src/utils'
 
 jest.mock('../src/commands', () => {
     class CommandHandlerMock {
@@ -52,14 +53,25 @@ test('if not supported by browser', async () => {
 })
 
 test('if supported by browser', async () => {
-
     const service = new DevToolsService()
     service.isSupported = true
     await service.before()
     expect(service.commandHandler.cdp).toBeCalledWith('Network', 'enable')
     expect(service.commandHandler.cdp).toBeCalledWith('Page', 'enable')
 })
 
+test('initialised with the debuggerAddress as option', async () => {
+    const options = {
+        debuggerAddress: 'localhost:4444'
+    }
+    const service = new DevToolsService(options)
+    service.isSupported = true
+    await service.before()
+    expect(getCDPClient).toBeCalledWith({ host: 'localhost', port: 4444 })
+    expect(service.commandHandler.cdp).toBeCalledWith('Network', 'enable')
+    expect(service.commandHandler.cdp).toBeCalledWith('Page', 'enable')
+})
+
 test('initialization fails', async () => {
     jest.mock('../src/utils', () => ({
         findCDPInterface: () => {

packages/wdio-devtools-service/tests/utils.test.js

@@ -11,7 +11,7 @@ jest.mock('fs', () => ({
 }))
 
 test('getCDPClient', async () => {
-    const cdp = await getCDPClient('localhost', 1234)
+    const cdp = await getCDPClient({ host: 'localhost', port: 1234 })
     expect(CDP.mock.calls).toHaveLength(1)
     expect(CDP.mock.calls[0][0].port).toBe(1234)
     expect(CDP.mock.calls[0][0].host).toBe('localhost')