| 1 | <!DOCTYPE html>
|
| 2 | <html>
|
| 3 | <head>
|
| 4 | <meta charset="utf-8">
|
| 5 | <title>Devtron</title>
|
| 6 | <link rel="stylesheet" href="../vendor/bootstrap/css/bootstrap.css">
|
| 7 | <link rel="stylesheet" href="../vendor/photon/css/photon.css">
|
| 8 | <link rel="stylesheet" href="../vendor/github.css">
|
| 9 | <link rel="stylesheet" href="devtron.css">
|
| 10 | <script src="../out/index.js" charset="utf-8"></script>
|
| 11 | </head>
|
| 12 | <body>
|
| 13 |
|
| 14 | <div class="window">
|
| 15 | <div class="window-content">
|
| 16 | <div id="pane-group" class="pane-group">
|
| 17 | </div>
|
| 18 | </div>
|
| 19 | </div>
|
| 20 |
|
| 21 | <template id="requires-table-row">
|
| 22 | <tr>
|
| 23 | <td class="row-module" data-field="moduleName"></td>
|
| 24 | <td class="row-version" data-field="moduleVersion"></td>
|
| 25 | <td class="row-size" data-field="fileSize"></td>
|
| 26 | <td class="row-file" data-field="pathSection">
|
| 27 | <span class="disclosure-arrow" data-field="disclosure"></span>
|
| 28 | <span data-field="fileName"></span>
|
| 29 | <span class="row-directory" data-field="moduleDirectory"></span>
|
| 30 | </td>
|
| 31 | </tr>
|
| 32 | </template>
|
| 33 |
|
| 34 | <template id="ipc-table-row">
|
| 35 | <tr>
|
| 36 | <td class="row-event-name">
|
| 37 | <div class="ipc-icon" data-field="eventIcon"></div>
|
| 38 | <div class="ipc-icon ipc-icon-sync" data-field="syncIcon" title="Synchronous"></div>
|
| 39 | <div data-field="eventName"></div>
|
| 40 | </td>
|
| 41 | <td class="row-event-listener-count" data-field="eventListenerCount"></td>
|
| 42 | <td class="row-event-data">
|
| 43 | <pre><code class="language-javascript" data-field="eventData"></code></pre>
|
| 44 | </td>
|
| 45 | </tr>
|
| 46 | </template>
|
| 47 |
|
| 48 | <template id="emitter-row">
|
| 49 | <tr>
|
| 50 | <td class="row-listener row-emitter">
|
| 51 | <span class="disclosure-arrow" data-field="disclosure"></span>
|
| 52 | <span data-field="emitterName"></span>
|
| 53 | <span class="listener-count" data-field="listenerCount"></span>
|
| 54 | </td>
|
| 55 | </tr>
|
| 56 | </template>
|
| 57 |
|
| 58 | <template id="event-type-row">
|
| 59 | <tr>
|
| 60 | <td class="row-listener row-listener-event-name">
|
| 61 | <span class="disclosure-arrow" data-field="disclosure"></span>
|
| 62 | <span data-field="eventName"></span>
|
| 63 | <span class="listener-count" data-field="listenerCount"></span>
|
| 64 | </td>
|
| 65 | </tr>
|
| 66 | </template>
|
| 67 |
|
| 68 | <template id="listener-code-row">
|
| 69 | <tr>
|
| 70 | <td class="row-listener row-listener-event-code">
|
| 71 | <pre><code class="language-javascript" data-field="listenerValue"></code></pre>
|
| 72 | </td>
|
| 73 | </tr>
|
| 74 | </template>
|
| 75 |
|
| 76 | <template id="modules-view">
|
| 77 | <div class="pane" data-pane="graph">
|
| 78 | <header class="toolbar toolbar-header">
|
| 79 | <div class="toolbar-actions">
|
| 80 | <button data-field="loadButton" class="btn btn-default pull-right">
|
| 81 | <span class="toolbar-icon toolbar-icon-cycle"></span>
|
| 82 | Load Graph
|
| 83 | </button>
|
| 84 | <input data-field="searchBox" class="form-control search-box pull-right" type="text" placeholder="Search modules">
|
| 85 | </div>
|
| 86 | </header>
|
| 87 |
|
| 88 | <div class="tab-group">
|
| 89 | <div data-field="renderProcessTab" class="tab-item active">
|
| 90 | Renderer Process
|
| 91 | </div>
|
| 92 | <div data-field="mainProcessTab" class="tab-item">
|
| 93 | Main Process
|
| 94 | </div>
|
| 95 | </div>
|
| 96 |
|
| 97 | <div class="table-scroller table-scroller-with-tabs">
|
| 98 | <table data-field="renderProcessTable" class="table-striped" tabindex="-1">
|
| 99 | <thead>
|
| 100 | <th>Module</th>
|
| 101 | <th>Version</th>
|
| 102 | <th>Size</th>
|
| 103 | <th>File</th>
|
| 104 | </thead>
|
| 105 | <tbody data-field="renderRequireRows" tabindex="-1">
|
| 106 | </tbody>
|
| 107 | </table>
|
| 108 |
|
| 109 | <table data-field="mainProcessTable" class="table-striped hidden" tabindex="-1">
|
| 110 | <thead>
|
| 111 | <th>Module</th>
|
| 112 | <th>Version</th>
|
| 113 | <th>Size</th>
|
| 114 | <th>File</th>
|
| 115 | </thead>
|
| 116 | <tbody data-field="mainRequireRows" tabindex="-1">
|
| 117 | </tbody>
|
| 118 | </table>
|
| 119 |
|
| 120 | <div class="table-description" data-field="tableDescription">
|
| 121 | This table shows all of the JavaScript files loaded via <code>require</code>
|
| 122 | starting from your application's main entry point.
|
| 123 | <br>
|
| 124 | Click Load Graph to generate a require graph for the renderer process
|
| 125 | and the main process.
|
| 126 | </div>
|
| 127 | </div>
|
| 128 | </div>
|
| 129 | </template>
|
| 130 |
|
| 131 | <template id="events-view">
|
| 132 | <div class="pane hidden" data-pane="listeners">
|
| 133 | <header class="toolbar toolbar-header">
|
| 134 | <div class="toolbar-actions">
|
| 135 | <button data-field="loadButton" class="btn btn-default pull-right">
|
| 136 | <span class="toolbar-icon toolbar-icon-cycle"></span>
|
| 137 | Load Listeners
|
| 138 | </button>
|
| 139 | <input data-field="searchBox" class="form-control search-box pull-right" type="text" placeholder="Search events">
|
| 140 | </div>
|
| 141 | </header>
|
| 142 |
|
| 143 | <div class="table-scroller">
|
| 144 | <table class="table-striped" tabindex="-1">
|
| 145 | <thead>
|
| 146 | <th>Event Listeners</th>
|
| 147 | </thead>
|
| 148 | <tbody data-field="listenersTable" tabindex="-1">
|
| 149 | </tbody>
|
| 150 | </table>
|
| 151 |
|
| 152 | <div class="table-description" data-field="tableDescription">
|
| 153 | This table shows the event names and listeners currently registered
|
| 154 | on core Electron and node.js APIs.
|
| 155 | <br>
|
| 156 | Click Load Listeners to populate it.
|
| 157 | </div>
|
| 158 | </div>
|
| 159 | </div>
|
| 160 | </template>
|
| 161 |
|
| 162 | <template id="ipc-view">
|
| 163 | <div class="pane hidden" data-pane="ipc">
|
| 164 | <header class="toolbar toolbar-header">
|
| 165 | <div class="toolbar-actions">
|
| 166 | <div class="btn-group pull-right">
|
| 167 | <button data-field="recordButton" class="btn btn-default" title="Record IPC events">
|
| 168 | <span class="toolbar-icon toolbar-icon-record"></span>
|
| 169 | Record
|
| 170 | </button>
|
| 171 | <button data-field="hideInternalButton" class="btn btn-default" title="Ignore internal IPC events">
|
| 172 | <span class="toolbar-icon toolbar-icon-funnel"></span>
|
| 173 | Ignore Internal
|
| 174 | </button>
|
| 175 | <button data-field="clearButton" class="btn btn-default" title="Clear events from table">
|
| 176 | <span class="toolbar-icon toolbar-icon-block"></span>
|
| 177 | Clear
|
| 178 | </button>
|
| 179 | <button data-field="docsButton" class="btn btn-default" title="Open Electron IPC docs">
|
| 180 | <span class="toolbar-icon toolbar-icon-book"></span>
|
| 181 | Docs
|
| 182 | </button>
|
| 183 | </div>
|
| 184 | <input data-field="searchBox" class="form-control search-box pull-right" type="text" placeholder="Search events">
|
| 185 | </div>
|
| 186 | </header>
|
| 187 |
|
| 188 | <div class="table-scroller">
|
| 189 | <table class="table-striped" tabindex="-1">
|
| 190 | <thead>
|
| 191 | <th>Channel</th>
|
| 192 | <th>Listeners</th>
|
| 193 | <th>Arguments</th>
|
| 194 | </thead>
|
| 195 | <tbody data-field="ipcTable">
|
| 196 | </tbody>
|
| 197 | </table>
|
| 198 |
|
| 199 | <div class="table-description" data-field="tableDescription">
|
| 200 | This table shows the inter-process communication (IPC) events sent
|
| 201 | and received between the renderer process and the main process.
|
| 202 | <br>
|
| 203 | Click Record to start monitoring and displaying IPC traffic.
|
| 204 | </div>
|
| 205 | </div>
|
| 206 | </div>
|
| 207 | </template>
|
| 208 |
|
| 209 | <template id="lint-view">
|
| 210 | <div class="pane hidden" data-pane="lint">
|
| 211 | <header class="toolbar toolbar-header">
|
| 212 | <div class="toolbar-actions">
|
| 213 | <button data-field="lintButton" class="btn btn-default pull-right">
|
| 214 | <span class="toolbar-icon toolbar-icon-cycle"></span>
|
| 215 | Lint App
|
| 216 | </button>
|
| 217 | </div>
|
| 218 | </header>
|
| 219 |
|
| 220 | <div class="table-scroller">
|
| 221 | <table class="table-striped" tabindex="-1">
|
| 222 | <thead>
|
| 223 | <th>Lint Checks</th>
|
| 224 | </thead>
|
| 225 | <tbody>
|
| 226 | <tr>
|
| 227 | <td data-field="outdated" class="alert hidden" role="alert">
|
| 228 | <p>
|
| 229 | <span class="lint-icon"></span>
|
| 230 | <strong class="lint-title">Using latest Electron version</strong>
|
| 231 | </p>
|
| 232 | <p data-field="outdatedDescription">
|
| 233 | Your application is using version <span data-field="versionLabel"></span>
|
| 234 | and the latest version released is <span data-field="latestLabel"></span>.
|
| 235 |
|
| 236 | <br><br>
|
| 237 | View the <a href="http://electron.atom.io/releases.html">Electron release notes</a>.
|
| 238 | </p>
|
| 239 | </td>
|
| 240 | </tr>
|
| 241 |
|
| 242 | <tr>
|
| 243 | <td data-field="usingAsar" class="alert hidden" role="alert">
|
| 244 | <p>
|
| 245 | <span class="lint-icon"></span>
|
| 246 | <strong class="lint-title">Using an asar archive</strong>
|
| 247 | </p>
|
| 248 | <p data-field="asarDescription">
|
| 249 | Your application is not bundled in an <code>.asar</code> archive.
|
| 250 | Asar bundles your entire application into a single file which
|
| 251 | makes your app quicker to install/update as well as improves the
|
| 252 | code loading performance in many environments.
|
| 253 |
|
| 254 | <br><br>
|
| 255 | View the <a href="http://electron.atom.io/docs/latest/tutorial/application-packaging">asar instructions</a>.
|
| 256 | </p>
|
| 257 | </td>
|
| 258 | </tr>
|
| 259 |
|
| 260 | <tr>
|
| 261 | <td data-field="crashListener" class="alert hidden" role="alert">
|
| 262 | <p>
|
| 263 | <span class="lint-icon"></span>
|
| 264 | <strong class="lint-title">Listening for crash events</strong>
|
| 265 | </p>
|
| 266 | <p data-field="crashDescription">
|
| 267 | Your application is not listening for the <code>crashed</code> event on
|
| 268 | the <code>webContents</code> property of the <code>BrowserWindow</code>.
|
| 269 | It is important to listen for this event to report when it happens
|
| 270 | and notify the user about what happened.
|
| 271 |
|
| 272 | <br><br>
|
| 273 | Listen for this event by adding: <code>myWindow.webContents.on('crashed', function () { })</code>
|
| 274 | <br>
|
| 275 | View the <a href="http://electron.atom.io/docs/latest/api/web-contents/#event-crashed">docs</a>.
|
| 276 | </p>
|
| 277 | </td>
|
| 278 | </tr>
|
| 279 |
|
| 280 | <tr>
|
| 281 | <td data-field="unresponsiveListener" class="alert hidden" role="alert">
|
| 282 | <p>
|
| 283 | <span class="lint-icon"></span>
|
| 284 | <strong class="lint-title">Listening for unresponsive events</strong>
|
| 285 | </p>
|
| 286 | <p data-field="unresponsiveDescription">
|
| 287 | Your application is not listening for the <code>unresponsive</code> event on
|
| 288 | the <code>BrowserWindow</code>. It is important to listen for this
|
| 289 | event to report when it happens and to notify the user about what
|
| 290 | has happened.
|
| 291 |
|
| 292 | <br><br>
|
| 293 | Listen for this event by adding: <code>myWindow.on('unresponsive', function () { })</code>
|
| 294 | <br>
|
| 295 | View the <a href="http://electron.atom.io/docs/latest/api/browser-window/#event-unresponsive">docs</a>.
|
| 296 | </p>
|
| 297 | </td>
|
| 298 | </tr>
|
| 299 |
|
| 300 | <tr>
|
| 301 | <td data-field="uncaughtListener" class="alert hidden" role="alert">
|
| 302 | <p>
|
| 303 | <span class="lint-icon"></span>
|
| 304 | <strong class="lint-title">Listening for uncaughtException events</strong>
|
| 305 | </p>
|
| 306 | <p data-field="uncaughtDescription">
|
| 307 | Your application is not listening for the <code>uncaughtException</code>
|
| 308 | event on the main <code>process</code>. Electron shows a dialog with a
|
| 309 | stack trace by default if you do not provide a listener for this event.
|
| 310 | It is important to listen for this event to report when it happens
|
| 311 | and possibly notify the user about what has happened.
|
| 312 |
|
| 313 | <br><br>
|
| 314 | Listen for this event by adding <code>process.on('uncaughtException', function () { })</code> in the main process.
|
| 315 | <br>
|
| 316 | View the <a href="https://nodejs.org/api/process.html#process_event_uncaughtexception">docs</a>.
|
| 317 | </p>
|
| 318 | </td>
|
| 319 | </tr>
|
| 320 | </tbody>
|
| 321 | </table>
|
| 322 |
|
| 323 | <div class="table-description" data-field="tableDescription">
|
| 324 | This pane shows warnings about potential issues or missing
|
| 325 | functionality in your application.
|
| 326 | <br>
|
| 327 | Click Lint App to inspect the running application.
|
| 328 | </div>
|
| 329 | </div>
|
| 330 | </div>
|
| 331 | </template>
|
| 332 |
|
| 333 | <template id="about-view">
|
| 334 | <div class="pane hidden" data-pane="about">
|
| 335 | <header class="toolbar toolbar-header">
|
| 336 | <div class="toolbar-actions">
|
| 337 | <button data-field="issueButton" class="btn btn-default pull-right">
|
| 338 | <span class="toolbar-icon toolbar-icon-bug"></span>
|
| 339 | Report Issue
|
| 340 | </button>
|
| 341 | </div>
|
| 342 | </header>
|
| 343 |
|
| 344 | <div class="padded table-scroller">
|
| 345 | <h3>Devtron <small data-field="versionLabel"></small></h3>
|
| 346 | <p>A dev tools extension for Electron</p>
|
| 347 | <p><a href="https://github.com/electron/devtron">https://github.com/electron/devtron</a></p>
|
| 348 |
|
| 349 | <h4>Keyboard Shortcuts</h4>
|
| 350 |
|
| 351 | <h5>Panes</h5>
|
| 352 | <div class="keybinding"><kbd>Alt + Up Arrow</kbd> — Navigate to previous pane</div>
|
| 353 | <div class="keybinding"><kbd>Alt + Down Arrow</kbd> — Navigate to next pane</div>
|
| 354 | <div class="keybinding"><kbd>Ctrl + E / Cmd + E</kbd> — Reload the pane</div>
|
| 355 |
|
| 356 | <h5>Tables</h5>
|
| 357 | <div class="keybinding"><kbd>Left Arrow</kbd> — Collapse selected item</div>
|
| 358 | <div class="keybinding"><kbd>Right Arrow</kbd> — Expand selected item</div>
|
| 359 | <div class="keybinding"><kbd>Up Arrow</kbd> — Select previous item</div>
|
| 360 | <div class="keybinding"><kbd>Down Arrow</kbd> — Select next item</div>
|
| 361 |
|
| 362 | </div>
|
| 363 | </div>
|
| 364 | </template>
|
| 365 |
|
| 366 | <template id="sidebar-view">
|
| 367 | <div class="pane pane-sm sidebar">
|
| 368 | <ul class="list-group">
|
| 369 | <li class="list-group-item active" data-field="requireLink" data-pane-link="graph">
|
| 370 | <div class="sidebar-icon sidebar-icon-graph"></div>
|
| 371 | Require Graph
|
| 372 | </li>
|
| 373 | <li class="list-group-item" data-field="eventsLink" data-pane-link="listeners">
|
| 374 | <div class="sidebar-icon sidebar-icon-events"></div>
|
| 375 | Event Listeners
|
| 376 | </li>
|
| 377 | <li class="list-group-item" data-field="ipcLink" data-pane-link="ipc">
|
| 378 | <div class="sidebar-icon sidebar-icon-ipc"></div>
|
| 379 | IPC
|
| 380 | </li>
|
| 381 | <li class="list-group-item" data-field="lintLink" data-pane-link="lint">
|
| 382 | <div class="sidebar-icon sidebar-icon-lint"></div>
|
| 383 | Lint
|
| 384 | </li>
|
| 385 | <li class="list-group-item" data-field="aboutLink" data-pane-link="about">
|
| 386 | <div class="sidebar-icon sidebar-icon-about"></div>
|
| 387 | About
|
| 388 | </li>
|
| 389 | </ul>
|
| 390 | </div>
|
| 391 | </template>
|
| 392 |
|
| 393 | </body>
|
| 394 | </html>
|