В целом, что я пытаюсь сделать, это добавить пользовательский элемент в 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.
РЕДАКТИРОВАТЬ: это может быть неочевидно, но я использую полифилл Custom Elements v1 https://github.com/webcomponents/custom-elements.
РЕДАКТИРОВАТЬ: После разговора с кем-то в канале аддонов Slack для Firefox я пришел, чтобы узнатьчто это известная проблема, когда функции просто «пропадают».Также существует ограниченный доступ к свойствам в домене, что, возможно, связано со встроенными ограничениями безопасности для расширений браузера.Моя работа заключается в том, чтобы просто использовать document.createElement('my-element-name')
для создания своих пользовательских элементов, а затем прикрепить свойства позже.