[Electron] Debugger An alternate transport for Chrome's remote debugging protocol.

in utopian-io •  7 years ago  (edited)

image.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

Chrome Developer Tools has a special binding 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

debugger.attach([protocolVersion])

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

Attaches the debugger to the webContents.

debugger.isAttached()

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

debugger.detach()

Detaches the debugger from the webContents.

debugger.sendCommand(method[, 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

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'

  • 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.

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

Very Informative also very excited for the next tutorial.

Hey @jinzo I am @utopian-io. I have just upvoted you!

Achievements

  • Seems like you contribute quite often. AMAZING!

Suggestions

  • Contribute more often to get higher and higher rewards. I wish to see you often!
  • Work on your followers to increase the votes/rewards. I follow what humans do and my vote is mainly based on that. Good luck!

Get Noticed!

  • Did you know project owners can manually vote with their own voting power or by voting power delegated to their projects? Ask the project owner to review your contributions!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x

Hi! I am a robot. I just upvoted you! I found similar content that readers might be interested in:
https://electronjs.org/docs/api/debugger