javascript - 为什么从 Firefox 附加组件读取时 CSSRule 为空？

Question

CSSRule DOM interface包含对应于每种类型的 CSS 规则的常量。规则的类型可以用像

这样的语句来测试

someRule.type == CSSRule.STYLE_RULE

我正在使用 SDK 构建 Firefox 插件。从该加载项的内容脚本文件中读取时，CSSRule 存在但为空。

console.log("CSSRule is " + CSSRule);
for(var key in CSSRule) {
    console.log('key: ' + key + '\n' + 'value: ' + CSSRule[key]);
}
console.log("CSSRule.STYLE_RULE is " + CSSRule.STYLE_RULE);

输出

CSSRule is [object CSSRule]
CSSRule.STYLE_RULE is undefined

当从页面内的 script 或从 Firefox 控制台执行相同的操作时，输出如我所料，CSSRule.STYLE_RULE 设置为 1。

当从 pageMod contentScript 而不是外部内容脚本文件执行时，CSSRule 是 {}。

等待页面完成加载，并使用 window.CSSRule 而不是 CSSRule，不要改变行为。

我已经在 Firefox 45.0.1(当前版本)和今天的 nightly(48.01a 2016-04-10)和 OS X 上测试了这个。

为什么 CSSRule 是空的？除了手动将它们设置为正确的值外，我如何访问这些常量？

Answer 1

这是 bug 898764 .扩展脚本在提供 xray vision 的沙箱中运行关于内容。

这意味着不受信任的 Web 内容定义的属性是不可见的，但所有 IDL 定义的属性和常量的原始实例应该是可见的。

目前以下可能是一种解决方法，但会将您的代码暴露给可能被内容更改或删除的值:

if(!("STYLE_RULE" in CSSRule)) {
   window.CSSRule = unsafeWindow.CSSRule
}

if it works, just run your code as a script on the page instead of directly from the extension. – dandavis

出于安全原因不推荐这样做，如果您想发布它可能无法通过插件审查。