Opera Dragonfly Manual Karl / toc.markdown

Opera Dragonfly Field Guide Outline


The Opera Dragonfly User Interface

  • Explain common UI elements with screen shot
  • Window controls (close, detach, select debugging context)
  • Global functions

DOM & Style Inspectors

TODO. Include:

  • Selecting document
  • DOM view
  • Editing
  • Viewing styles attached to element
  • Edit styles
  • Deleting styles
  • Disabling styles
  • Colour picker
  • Layout view
  • Properties view

JavaScript Debugger

  • Introduce the debugger and show UI map/screenshot

Source view

  • Selecting a script
  • Source (link to various places like setting break points, DataTips, etc.)
  • Search

Program flow

  • Pausing and continuing execution
  • Step over
  • Step into
  • Step out


// intro text

Types of breakpoints

  • Simple (line or statement)
  • Conditional (advanced breakpoint. Also hit count?)
  • Event (break on event)
  • Error (break on error or exception)
  • New script (break when encountering a new script)

Managing breakpoints

Setting breakpoints
  • Set simple breakpoint
  • Specify a condition
  • Breaking on event
  • Breaking on errors and new scripts
Deleting and disabling breakpoints
  • Temporarily disable a breakpoint
  • Delete a breakpoint
Viewing breakpoints
  • The breakpoint window (might not be needed as probably described under conditional breakpoints. Move before setting breakpoints?)

Viewing variables and state

Inspecting properties

  • describe the inspection panel/stack frame


  • describe how to use data tips

Watches (watchpoints?)

  • Describe how to watch a variable (and expression?)

Network Inspector

  • Description of the tabs and their purpose
  • Resources
  • Make Request
  • Network Options
  • How to identify some basic HTTP issues with Make Request (the dragonfly curl manual)

Resource Inspector


Storage Inspector


Error Log

  • Brief introduction to log.
  • Link to console.log and friends in the command line section.


Colour picker

  • Selecting a colour
  • Options (avg colour, size etc)
  • Storing colours


Console API

Command Line API

Keyboard Shortcuts

Remote Debugging


Stage 1: Network setup

Stage 2: Listen for a connection

Stage 3: Connect to Opera Dragonfly

Debugging pages on a remote device



  • Keyboard shortcut map
  • Definition of terms?
  • How to contribute?
  • what else?