有很多瀏覽器的調試協(xié)議的第三方客戶端。本節(jié)介紹一個示例。

Bracket

Bracket 是一個基于 Web 的 IDE ，使用 Chrome 調試協(xié)議啟用調試，實時編輯 HTML / CSS。

http://wiki.jikexueyuan.com/project/chrome-devtools/images/ref_brackets.png" alt="brackets.png" />

• Brackets 網站。從 download.brackets.io 下載該客戶端。源代碼在 Github 上
• blog post from Mark DuBois 給了 Brackets 工作的總概。

DevTools App

DevTools App 是一個 Chrome 應用程序，可以讓你輕松嘗試不同版本的 DevTools。

http://wiki.jikexueyuan.com/project/chrome-devtools/images/ref_devtoolsapp.png" alt="devtoolsapp.png" />

例如你可以輕松嘗試

• 庫中最新的 DevTools 源代碼
• 內置的 DevTools
• 本地服務器提供的 Devtools

為了使用，你必須這樣打開 --remote-debugging-port=9222

從 Chrome Web Store 安裝 DevTools Apps 到 Chrome。 源代碼托管在 Github 上。

Light Table

Light Table 是一個新的 IDE，需要一個新的方法來安排開發(fā)者的工作區(qū)。Light Table 目前在 alpha 。它不是開源的，但 alpha 版本現(xiàn)在是免費提供的。

http://wiki.jikexueyuan.com/project/chrome-devtools/images/ref_lighttable.png" alt="lighttable.png" />

• 從官方網站下載
• 這篇 Blog 描述了在版0.4.0 的新功能，包括 DevTools 的整合。

NodeJS

大量模型被開發(fā)，使用 Node 腳本的 Chrome 調試器

chrome-remote-interface (Chrome 遠程接口)

Chrome遠程接口模型 包裝一個節(jié)點式的 JavaScript API 調試協(xié)議。

npm install -g chrome-remote-interface

http://wiki.jikexueyuan.com/project/chrome-devtools/images/ref_chrome-remote.png" alt="chrome-remote.png" />

看看哪個 NPM 項目中使用 Chrome 的遠程接口

crconsole

crconsole 模型為 Chrome 控制臺提供了一個命令行接口。 它使用 chrome-remote-interface 模型與 Chrome 調試協(xié)議交互。

automated-chrome-profiling（Chrome 自動化分析）

[一個基礎配置，通過 Node.js 自動JS分析]( recipe for automating JS profiling through Node.js)，檢查到存活在協(xié)議系統(tǒng)的其他應用程序

chrome-debug-protocol (Chrome 調試協(xié)議)

Chrome 調試協(xié)議模型在 Chrome中用 JavaScript 和 TypeScript 創(chuàng)建自動測試自動檢測，這很容易實現(xiàn)。

npm install -g chrome-debug-protocol

Sublime Text

Sublime Web 監(jiān)測項目增加了 Chrome 集成調試器到流行的 Sublime Text 編輯器中。你可以通過 Sublime Text 包管理器安裝它。

• 官方頁面有概述和安裝說明
• 源代碼托管在 Github

Telemetry

Telemetry 所使用的 Chromium 項目多個測試版本的 Chrome 瀏覽器，用來測試框架性能。它使用調試協(xié)議來遠程控制的 Chrome 實例。

• 介紹Telemetry 在 Chromium.org

Vim

Chrom.vim 是 Vim 編輯器的一個實驗插件，提供了一些基礎的 Chrome 操作,適應 Vim 需求。

• vim-chrome on Github

WebDriver

Selenium 瀏覽器自動化工具使用 WebDriver API 來抽象與不同的瀏覽器的交互。Chrome 上 WebDriver 的實現(xiàn) 使用 Chrome 瀏覽器調試協(xié)議。

• Selenium WebDriver project

WebStorm

WebStorm 是一款商業(yè)化的 IDE，支持在 Chrome 上調試和在線編輯。WebStorm 使用一個 Chrome 插件，集成了 Chrome 調試器。

• 從 JetBrains 下載
• 最新調試器特性的描述截屏

Python

chrome_remote_shell 為 python 應用提供了一個很好的 API 層。