javascript调试
本文是Microsoft的Web开发系列的一部分。 感谢您支持使SitePoint成为可能的合作伙伴。
2015年4月，我们在Microsoft的工程师和技术推广人员团队发布了Vorlon.js ，这是一个开源，可扩展，与平台无关的工具，用于远程调试和测试JavaScript。
当我们在Microsoft Build Developer Conference主题演讲期间启动该项目时，我们只有三个插件：DOM Explorer，Interactive Console和Modernizr。 目前我们知道，Vorlon等项目成功的关键在于插件的数量和质量。 当您要调试网站时，您不想做很多复杂的事情。 您只想选择正确的插件并获取正确的信息。
这就是为什么我们将此项目开源。 我们知道您有很多想法可以为Web开发人员提供出色的调试体验。
因此，两个月以来，共发出了66个请求，78个问题和547次提交：我们很自豪地宣布，我们（您和您的团队）刚刚发布了Vorlon.js 0.0.15版！ 您可以通过克隆我们的GitHub存储库或使用npm命令工具（ npm install –g vorlon ）来安装它。
注意 ：如果您仍然想知道Vorlon.js是什么，请先阅读David Catuhe的这篇文章：_ http://blogs.msdn.com/b/eternalcoding/archive/2015/04/30/why-we-made -vorlon-js以及如何使用它来调试您JavaScript-remotely.aspx ）。
让我们看一下此版本中的新增功能。
新插件
XHR Panel在这里可以帮助您获取通过XMLHttpRequest完成的请求的列表。 您可以使用播放按钮选择启用或禁用录制。
XHR面板
Network Monitor在Vorlon中为您提供了查看浏览器和Web服务器之间完成的所有网络交换的功能。 它提供了资源名称，服务器域，请求类型，持续时间（以毫秒为单位）和漂亮的可视时间轴！
资源浏览器为您提供有关客户端浏览器实例本地存储内容的信息。 有关于会话 ， Cookie和本地存储的数据 。 当您要调试本地缓存或登录/持久性用户数据问题时，此功能非常有用。
NG Inspector是AngularJS的$scope调试器。 您可以轻松访问存储在每个合并范围中的所有值。 第一个版本为您提供信息，将来的版本将使您能够编辑示波器。
插件改进
DOM资源管理器已得到改进。
以前，此插件每次更改时都会将所有DOM数据从客户端发送到仪表板。 这对表演产生了巨大的影响。 现在，此问题已解决，您可以通过手动单击刷新按钮或在“ 设置”窗格上激活自动刷新来从客户端刷新DOM。 自动刷新功能更智能，如果在客户端浏览器上可用，则使用MutationObserver 。
附加功能：当客户端更改DOM时，刷新按钮中的圆形指示器变为红色！
免费学习PHP！
全面介绍PHP和MySQL，从而实现服务器端编程的飞跃。
原价$ 11.95 您的完全免费
如您所见，“ DOM浏览”窗格更漂亮，更易于阅读。
现在，您可以单击它来编辑HTML内容和属性。 当按ENTER键时，更改将应用于客户端。
DOM突出显示功能更易于访问。 当您的鼠标移到Vorlon仪表板中DOM资源管理器上的DOM元素上时，就会发生这种情况。
您也可以右键单击元素以删除或编辑内容。 这是启用属性删除的最佳人体工程学方法。
在右窗格中，您可以获得更多的信息，而现在只有真正CSS代码。
布局选项卡为您提供了用于经典F12工具的信息：页边距，填充，边框和尺寸信息。
计算样式包含相同的内容，其中包含所有显式和隐式继承CSS样式。
HTML选项卡是在DOM中编辑文本的更好工具。 您可以通过单击保存按钮来制作断线并应用更改。
最后， 设置部分是您可以在其中激活DOM自动刷新的位置。
Interactive Console也具有一些新功能。
我们有windows.onerror ， console.dir和复杂的object日志支持。 您可以使用可视树在对象属性中导航。 过滤器仅用于显示日志的子集，您可以使用类似搜索的文本区域进行过滤。
其他变更和改进
我们在代码组织和结构中做了很多其他更改，这些更改在插件和功能中不直接可见。
例如，我们重命名了catalog.json文件并将其移动到服务器文件夹中，该文件包含插件列表和一些参数。 现在将其称为config.json因为某些参数与插件无关。 为了避免复制粘贴并简化调试和使用，我们还在config.json的插件配置中添加了一个enabled布尔参数。 如果对特定插件为false，则不会将其加载到仪表板中，也不会在生成的vorlon.js文件中发送给客户端。
我们还将插件分成两个单独的文件。 最初，一个插件仅由一个包含仪表板和客户端代码JavaScript文件组成。 当我们开始这个项目时，这很容易。 现在创建了更复杂的插件，出于优化原因，我们将其分为两个不同的文件： yourplugin.client.js和yourplugin.dashboard.js 。
您可以阅读更多有关我们在GitHub存储库上可用的whatsnew.md文件中所做的更改的信息。
下一步是什么？
我们现在正在开发包含新插件和核心改进功能的下一个版本。 身份验证，webgl，webaudio都是列表的一部分！
正如我所说，我们希望该项目成为Web开发人员的项目。 如果您有想法，可以：
- 在GitHub上提交问题
- 自己创建并提交拉取请求（我们每天对此进行审查！）
_注意：为了帮助您学习如何创建插件，我编写了此简介 。
让我们一起在Vorlon.js上共同努力，使调试体验更轻松，更好。
不要忘记关注我们的团队推特帐户 ！
使用JavaScript进行更多操作
本文是Microsoft技术福音专家开发的Web开发系列文章的一部分，内容涉及实用JavaScript学习，开源项目以及互操作性最佳实践，包括Microsoft Edge浏览器和新的EdgeHTML呈现引擎 。
我们鼓励您使用dev.modern.IE上的免费工具跨浏览器和设备进行测试，包括Microsoft Edge（Windows 10的默认浏览器）：
- 扫描您的站点以查找过期的库，布局问题和可访问性
- 在Mac，Linux和Windows上使用虚拟机
- 在您自己的设备上远程测试Microsoft Edge
- GitHub上的编码实验室：跨浏览器测试和最佳实践
我们的工程师和宣传人员在Microsoft Edge和Web平台上进行了深入的技术学习：
- Microsoft Edge Web Summit 2015 （新浏览器，受支持的新网络平台标准以及来自JavaScript社区的嘉宾演讲者会期待什么）
- 哇，我可以在Mac和Linux上测试Edge和IE！ （来自Rey Bango）
- 在不中断网络的情况下推进JavaScript （摘自Christian Heilmann）
- 使Web正常工作的Edge渲染引擎 （来自Jacob Rossi）
- 使用WebGL释放3D渲染 （来自David Catuhe，包括vorlon.JS和babylonJS项目）
- 托管的Web应用程序和Web平台创新 （来自Kevin Hill和Kiril Seksenov，包括歧管 .JS项目）
Web平台的更多免费跨平台工具和资源：
翻译自: https://www.sitepoint.com/remotely-debug-and-test-javascript-with-new-vorlon-js-plug-ins/
javascript调试
635
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
