Как правильно внедрить iframe в DOM с помощью Safari App Extensions?

Я портирую свое WebExtension на Safari, используя расширение приложения Safari.

Мое расширение - это вставка iframe в DOM, поэтому я подумал, чтобы что-то вроде этого сценария внедрения было загружено как SFSafariContentScript,

document.addEventListener('DOMContentLoaded', function(e) {
    var newElement = document.createElement("script");
    newElement.src = safari.extension.baseURI + "bundle.js";
    document.body.insertBefore(newElement, document.body.firstChild);
});

Дело в том, DOMContentLoaded Кажется, что событие запускается снова, когда вводится мой iframe, что приводит к бесконечному циклу.

Такое поведение отличается от того, что вы ожидаете от простого сценария внедрения с двумя файлами. index.html а также index.js это работает, как ожидалось.

───────┬───────────────────────────────────────────────────────────────────
       │ File: index.html
───────┼───────────────────────────────────────────────────────────────────
   1   │ <html>
   2   │   <head>...</head>
   3   │   <body><div>...</div></body>
   4   │   <script src="index.js"></script>
   5   │ </html>
───────┴───────────────────────────────────────────────────────────────────
───────┬───────────────────────────────────────────────────────────────────
       │ File: index.js
───────┼───────────────────────────────────────────────────────────────────
   1   │ document.addEventListener('DOMContentLoaded', function(e) {
   2   │   var newElement = document.createElement('script');
   3   │   newElement.src = './bundle.js';
   4   │   document.body.insertBefore(newElement, document.body.firstChild);
   5   │ });
───────┴───────────────────────────────────────────────────────────────────

Если я заменю addEventListener по setTimeout из нескольких секунд в моем расширении приложения Safari мое расширение корректно внедряется и работает хорошо, но выбор произвольного времени для внедрения iframe мне кажется грязным.

Как правильно внедрить iframe в DOM с помощью Safari App Extensions?

1 ответ

Решение

Свертывание моего кода между этим условием сделало трюк, который был в документации Apple в части Inject Scripts.

if (window.top === window) {
    // The parent frame is the top-level frame, not an iframe.
    // All non-iframe code goes before the closing brace.
    document.addEventListener('DOMContentLoaded', function(e) {
        var newElement = document.createElement("script");
        newElement.src = safari.extension.baseURI + "bundle.js";
        document.body.insertBefore(newElement, document.body.firstChild);
    });
}
Другие вопросы по тегам