Question

总体而言，我要实现的目标是将自定义元素注入dom。我看到它正在被注入，但是我收到一条TypeError: this.functionName is not a function消息。

我已经类似定义了我的组件：

class Foo extends HTMLElement{
  constructor() {
    super();
  }

  connectedCallback() {
    this.doSomething();
  }

  doSomething() {
    //does something.
  }
}

当调用doSomething()时，我收到函数未定义错误。我尝试重命名该函数，定义其他函数并尝试调用它们，但是没有任何效果。

我的清单的定义类似于：

{"content_scripts"[{
"js":["custom-elements.min.js", "MyWebComponent.js"],
"run_at": "document_start"}]}

我也尝试了polyfill webcomponents-bundle.js，但是收到了TypeError: Bh is null消息，并决定不对代码进行混淆，因为该代码被混淆了。

我应该注意，该扩展程序在Chrome和Safari甚至Edge中都可以正常使用。

编辑：这可能并不明显，但是我正在使用“自定义元素” v1 polyfill https://github.com/webcomponents/custom-elements。

编辑：在Firefox的插件Slack频道中与某人交谈之后，我了解到这是一个已知的问题，其中函数只是“丢失”了。此外，对dom属性的访问也受到限制，这可能是由于浏览器扩展的内置安全限制所致。我的解决方法是仅使用document.createElement('my-element-name')创建我的自定义元素，然后再附加属性。

Web组件不适用于Firefox扩展

0 个答案: