Chrome开发工具 对 Chrome 开发工具的贡献

这些标志使得 Chrome 允许 WebSocket 连接到 localhost：9222 并且能够从本地 git repo 运行前端 UI。这里有一个命令行开关的完整列表和它们的作用。 Step 3: 建立检查如果你没有使用开发工具，检查工具的最简单方法是从你的标签移除它们，这样它就会在一个独立的窗口显示。然后点击你的键盘快捷键开启监视（如 cmd-alt-i）。这会开启一个新的开发工具窗口来监视之前的内容。你也可以按照自己的想法来调整这些窗口。一旦打开 Canary，就会打开一个新标签，之后可以浏览任何网页，像 chromium.org。接下来，回到“可视页面”选项卡，http://localhost:9222在这里您将看到关于每一个被监视页面的网格菜单。刷新后可以更新数据。这个网格菜单是的一个小型网络服务器端运行的，该服务器在 Canary 的第一个实例内，而 --remote-debugging-port=9222 参数会传递给该对象。自从Web服务器从您本地的 /blink/Source/devtools 目录下的 git repo 运行时，当点击相关页面时，devtools 文件夹下的全部文件都会被检查。 点击你打开的标签的缩略图。你将会有一个完整的选项卡用于检查其他的选项卡。 很好的工作，到目前为止！ 注意，这个工具实例中指向 http://localhost:8000/front_end/inspector.html 的 URL。这是因为监控 URL 的http://localhost:9222#http://localhost:8000/front_end/inspector.html 是作为一个哈希传给“监视页面” URL 的。它通过 websocket 连接到你本地的仓库，你可能会注意到，它是 URL ?ws=localhost:9222/devtools/ 的一部分。（你也可以使用工具来看看这个 WebSocket 帧数据）。接下来继续进行... 现在，用你的键盘快捷键在窗口中打开工具。你现在已经成功建立检查器了。做得好。现在你可以开始构建和发展本地/blink/Source/devtools/front_end.目录下的 DevTools 前端代码了。 Step 4: 拿到门票现在，你准备好深究代码，并开始开发 devtools 源，首先在 http://crbug.com 找到你更改所需的门票并留下一个评论说你要为它写一份补丁。如果你还没有决定要改变什么，那么先浏览下公开的问题，选择一个你想做的。如果它被分配给你了，请留下你对它的评论。另外，如果没有任何需要更改的问题，此时创建一个新的问题。确保你的描述说清楚了改变是什么以及它为什么需要，然后在底部添加 "patch to follow"。沟通在你开始贡献一张“票”之前，在谷歌开发工具组上打开一个新线程的做法是一个好主意，这样你就可以讨论你不确定或不知道的内容，这些东西可能是你以后工作中需要的。记得不要过度沟通了。步骤5：提取、开发、分支、提交你会发现阅读 Chromium guide 对编写代码有帮助。 从库中提取出最新的文件，并确保您正在使用最新的代码。 git pull --rebase 然后创建一个新的分支，它可以让你做出自己的更改。 git checkout -b yourbugorfeaturename 在你的开发工具中打开工具栏，打开你最喜欢的代码编辑器，开始进入本地库目录 /blink/Source/devtools/front_end。 注：在开发过程中使用的刷新键或按 ALT + R 代替F5，以你使用开发者工具为例，用 Ctrl + R 或 Cmd + R 一定会刷新主页。 在终端编译器上运行你做出的更改：./devtools/scripts/compile_frontend.py 你应该看到“0 error(s), 0 warning(s)”。 你的代码应符合 Blink 编码风格指南 如果适当的话就测试 应通过终止编译器测试 你应该有一个合理的审查规模（较大的修补程序需要更长的时间） 一旦你做出了改变，就把它提交。在你提交的信息中应包括问题代码和指定它的一个工具补丁。 git commit -m "#175024 DevTools: This describes the Goat Teleporter" 将你上次做出的更改并提交到分支中的内容删除掉是个好方法。一旦你的补丁完成，你会想编写和运行相关的布局测试。要开始测试工具布局看 WebKit 布局测试指南。 注意：如果您的补丁需要编写新的单元测试或用户界面测试，则需要将它们应作为补丁的一部分创建。 Step 6: 上传你的补丁在我们评估你做出的贡献之前，你需要签署并提交一份完整的 CLA (Contributor License Agreement)。安装depot_tools要上传你的补丁，你需要安装 depot_tools。depot_tools。这是一个脚本包，用来管理测试和代码审查，它包括 gclient，GCL，和 Git-CL 命令,这些以后将很有用。你仍然希望同步 Chromium 与它的所有依赖项。 通过克隆库下载 depot_tools：git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git 然后，你需要将它添加到您的路径。通过添加以下内容到你的 .bashrc，.bash_profile 或等效的 shell 文件中。这样你就不需要在每次你打开一个新的 shell 时手动重置你的路径。 export PATH="$PATH":path/to/the/depot_tools注：本指南包括 Windows 的步骤，但由于无法添加depot_tools到 Windows 命令行的路径中，所以并没有确认是否有效。然而，你可以用 Cygwin 作为一种替代方案。在这里你可以找到在 Windows 安装depot_tools Cygwin的步骤。上传补丁进行审查如果您的修补程序完成了，所有的测试都通过，上传您的更改：git cl upload --bypass-hooks 你的编辑会提示你写补丁说明。详细解释一下你喜欢的改变。保存并退出编辑器以完成补丁提交。你必须有 codereview.chromium.org 的账户并且之后你需要输入您的凭据。然后，你会得到审查的URL Issue created. URL: https://codereview.chromium.org/18173008". 记下这个网址，你可以去页面查看它的状态。 现在你只需要等待你友好的邻居来评论，以检查它是不是有用的。 清理回到 master 分支。 git checkout master故障诊断工作流程下面是一些来自某些贡献者的代替观点，他们描述了他们的工作流程和一些建议，也许这些内容对你的工作有利。如果你遇到下列步骤中列出的任何问题，我们有文档能够帮助你诊断问题，而你应该能够自己解决这些问题。 选择工作流 #1你要选择两流程中的一个：合并或复位。两者是“数学上等价的”，但是是不同的命令。除非你是个极客超级大师，工作流和思维都有所不同。 大约一半的 Chromium 使用复位工作流。 git checkout -b myAwesomeBranch在该分支上做出更改git commit -是“分支”的一些变化git checkout mastergclient syncgit chec