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

in #utopian-io7 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.

Sort:  

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