7

我使用 Dart Polymer 创建 Web 组件。为了调试 CSS 样式，我在 Dartium 中启动应用程序并使用 Chrome DevTools 检查样式。

问题是<style>标签中定义的所有样式<polymer-element>都没有出现在 DevTools 中，尽管它们被正确应用了！我在哪里可以找到这些款式？

4

3 回答 3

9

以下是使其工作的步骤：

  1. 在内置 Chromium 中打开任何 Dart 项目
  2. 按 F12 打开开发工具
  3. 点击右上角的齿轮图标
  4. 在元素类别下启用选项“显示阴影 DOM”
  5. 转到 Elements 面板，您将看到具有所有样式的组件 DOM

希望它对你有用。

感谢： http: //oliversmith.io/technology/2012/05/19/inspecting-the-shadow-dom-in-google-chrome-inspector/

于 2014-05-21T13:05:04.787 回答
1

刚刚找到解决办法：打开DevTools后刷新页面

问题的可能原因：

当 DevTools 打开时，Dart Editor 报告：

DevTools 已关闭调试器连接。

DevTools 一次只支持一个连接的调试器（例如 Editor 或 Chrome DevTools）。您要重新连接吗？（必须先关闭 DevTools）

所以可能会有来自 Dart Editor Debugger 的一些干扰。当与 Dart Editor Debugger 的连接关闭并刷新页面时，DevTools 可以正常工作。

这个解决方案暂时有效，但有更好的方法吗？还是 Chrome DevTools 或 Dart 编辑器中的错误？

于 2013-10-11T11:15:20.343 回答
1

这是一个已知的devtools 错误。随意加注星标以获取有关其状态的任何更新。

于 2013-10-18T08:33:39.650 回答