IE9 Compat Inspector
IE9 现已发布,我们希望您能够为 IE 提供与其他浏览器相同的标记,并确保您的站点能够在 IE9 标准模式下良好运行。最近,我们在博客中讨论了为 IE9 准备您的站点,您可以在 Internet Explorer 9 兼容性手册中找到可能会对您的站点产生影响的更改列表,还可在 Internet Explorer 9 开发人员指南中找到更完整的更改内容列表。今天,我们将介绍一种有助于加速站点准备过程的新资源:Compat Inspector。
关于 Compat Inspector
Compat Inspector 是一种基于 JavaScript 的测试工具,可在站点运行时分析站点。Compat Inspector 报告导致在标准模式中出现问题的交互模式。这使您能够迅速识别问题,而无需熟记大量文档,无需在站点的全部代码中进行搜索。我们在 IE9 开发过程中开发了 Compat Inspector,旨在加速识别各站点中共同问题的过程。在这个过程中,IE 团队的许多成员为构成 Compat Inspector 规则的测试用例集做出了贡献。现在,我们将这种工具奉献给您。请访问 Compat Inspector Test Drive,在试用后再将其用于您自己的站点。
Compat Inspector 设计用于帮助站点迁移到 IE9 标准模式,而非在旧式模式下运行。您可能仍然需要参考上述文档来了解一些问题。最佳模式是首先使用 Compat Inspector,如果未得到任何结果,再回头查阅文档。
如何使用这种工具?
要使用 Compat Inspector,请在您希望测试的各页面的所有其他脚本之前添加以下脚本:
<script src="https://ie.microsoft.com/testdrive/HTML5/CompatInspector/inspector.js"></script>
注意 : 如果您拥有 Fiddler , 可以将 这个代码片段 添加到您的 FiddlerScript 中 , 自动在您访问的所有页面上加载 Compat Inspector ( 如果您的页面使用了框架 , 这种方法将非常有帮助 ) 。如果您还没有安装 FiddlerScript Editor 扩展 ,我建议您立即安装。
添加了上述脚本之后,在 IE9 中打开并开始使用您的页面。显式测试任何已知无法正确工作的交互(仅分析执行的代码)。Compat Inspector 将保留与检测到的问题相关的所有错误和警告的总计。页面右上角的汇总视图显示结果:
单击展开这个视图,了解检测到的各问题的具体信息,此处也提供了相关文档的链接:
大多数错误和警告还提供了两项用于进一步调查的操作:“Verify”(验证)和“Debug”(调试)。
“验证”工作流
部分测试用例具有内置的“验证器”,可模拟旧版行为。这允许您确认问题根本原因,之后再更改代码。
先决条件 : 打开了 Compat Inspector 的具体信息视图,并且显示了包含名为“Verify”的复选框的错误或警告消息。
- 重复最初触发了错误或警告的步骤
- 如果问题仍然存在
- 如果仍然显示错误或警告消息,请为其他各消息重复第 1 步到第 4 步
- 否则,Compat Inspector 将无法完全确认此问题。如需其他帮助,请参阅 IE9 文档。
- 如果您已经确定了问题的根本原因
-
- 刷新页面
- 按照下面的“Debug”工作流在代码中定位各条消息的来源
- 按照所显示的错误/警告消息中的说明解决问题
- 注意 : 同时请注意控制存在问题的代码执行的任何 “ if IE ” 检查。通常情况下,如果与其他现代浏览器使用相同的代码,则 IE9 的表现最佳。
“调试”工作流
Compat Inspector 还能通过“debug”功能帮助您隔离代码中出现问题的位置。
先决条件 : 打开了 Compat Inspector 的具体信息视图,并且显示了包含名为“Debug”的复选框的错误或警告消息。
6. 切换到 F12 开发人员工具右侧的“Call stack”子选项卡
8. 观察 F12 开发人员工具的左侧部分,查看触发错误或警告的代码
它是如何工作的?
Compat Inspector 利用了 IE9 中引入的功能。Compat Inspector 的核心在于使用 ECMAScript 第 5 版 getter/setter 覆盖本机 API,依靠浏览器来通过 WebIDL 正确地公开 API。随后,Compat Inspector 利用这些覆盖来跟踪页面与本机平台之间的交互。这使它能够在执行问题代码时,在运行时报告问题。
Compat Inspector 基础结构的其他部分按照需要利用多种其他新功能。部分示例包括 DOM 3 级核心 API、DOM 3 级事件 API 和 CSS3 Border Radius。Compat Inspector 还依靠 IE8 中引入的功能,比如 HTML5 本地存储、HTML5 跨文档消息传递、本机 JSON 支持 和 Selectors API 等。
我的站点可以正常工作了,接下来该做些什么?
在发布之前,从所有页面中删除 Compat Inspector 脚本。Compat Inspector 是一种测试工具,不应该用于生产之中。此后,请随时关注 IE 博客,我们可能会在将来分享新的测试用例。
—Tony Ross,项目经理,Internet Explorer