![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1519423243/oijmlocl4mfbmk8dsynl.png)



#### What Will I Learn?
- Electron Debugger
- How to use

#### Requirements
Write here a bullet list of the requirements for the user in order to follow this tutorial.

- Electron JS
- Node JS

#### Difficulty
- Basic


#### Getting Started

In this tutorial I'm going to explain the usage of debugger

Process: [Main](https://electronjs.org/docs/glossary#main-process)

Chrome Developer Tools has a [special binding](https://electronjs.org/docs/api/debugger) available at JavaScript runtime that allows interacting with pages and instrumenting them.

```
const {BrowserWindow} = require('electron')
  let win = new BrowserWindow()

  try {
    win.webContents.debugger.attach('1.1')
  } catch (err) {
    console.log('Debugger attach failed : ', err)
  }

  win.webContents.debugger.on('detach', (event, reason) => {
    console.log('Debugger detached due to : ', reason)
  })

  win.webContents.debugger.on('message', (event, method, params) => {
    if (method === 'Network.requestWillBeSent') {
      if (params.request.url === 'https://www.github.com') {
        win.webContents.debugger.detach()
      }
    }
  })

  win.webContents.debugger.sendCommand('Network.enable')
```

### [Instance Methods](https://electronjs.org/docs/api/debugger#instance-methods)

#### [`debugger.attach([protocolVersion])`](https://electronjs.org/docs/api/debugger#debuggerattachprotocolversion)

-   `protocolVersion` String (optional) - Requested debugging protocol version.

Attaches the debugger to the `webContents`.

#### [`debugger.isAttached()`](https://electronjs.org/docs/api/debugger#debuggerisattached)

Returns `Boolean` - Whether a debugger is attached to the `webContents`.

#### [`debugger.detach()`](https://electronjs.org/docs/api/debugger#debuggerdetach)

Detaches the debugger from the `webContents`.

#### [`debugger.sendCommand(method[, commandParams, callback])`](https://electronjs.org/docs/api/debugger#debuggersendcommandmethod-commandparams-callback)

-   `method` String - Method name, should be one of the methods defined by the remote debugging protocol.
-   `commandParams` Object (optional) - JSON object with request parameters.
-   `callback` Function (optional) - Response

    -   `error` Object - Error message indicating the failure of the command.
    -   `result` Any - Response defined by the 'returns' attribute of the command description in the remote debugging protocol.

Send given command to the debugging target.

### [Instance Events](https://electronjs.org/docs/api/debugger#instance-events)

#### [Event: 'detach'](https://electronjs.org/docs/api/debugger#event-detach)

-   `event` Event
-   `reason` String - Reason for detaching debugger.

Emitted when debugging session is terminated. This happens either when `webContents` is closed or devtools is invoked for the attached `webContents`.

#### [Event: 'message'](https://electronjs.org/docs/api/debugger#event-message)

-   `event` Event
-   `method` String - Method name.
-   `params` Object - Event parameters defined by the 'parameters' attribute in the remote debugging protocol.

Emitted whenever debugging target issues instrumentation event.