javascript - Chrome 拡張機能から実際の brython コードを挿入する

Question

Inject a script tag with remote srcから取得したコードを取得し、それが実行されるのを待ちます。

function injectScript(src){
    return new Promise((resolve, reject) => {
        const script = document.createElement('script');
        script.src = src;
        console.log(script.src)
        script.setAttribute('type', 'text/javascript');
        script.addEventListener('load', resolve);
        script.addEventListener('error', e => reject(e.error));
        document.head.appendChild(script);
    });
}

書くことで

injectScript((chrome.runtime.getURL("/utils.js")))
    .then(() => {
        console.log("script loaded")
    }).catch(error => {
        console.log(error);
    })

utils.js (以下) からコードを html ページに正常に挿入できますonclick="foo()"

function foo(){
    console.log("bar");
}

さて、私の質問は、injectScript 関数を変更して brython コード (以下) を挿入するにはどうすればよいかということです。type 属性を に設定しようとしましtext/pythonたが、それ以外は同じに保ちましたが、これは機能しません。同様に に変更script.src = srcしscript.textContent = srcても機能しません。いずれの場合も、エラーなしでは何も起こりません。

***python.js***

from browser import document, alert

def hello():
    alert("hello world")

document['mybutton'].bind('click', hello)

編集: brython コードを挿入するために使用される完全なコード (コンソールは「読み込まれた最小スクリプト」と「stdlib スクリプトが読み込まれました」をログに記録しますが、「python が読み込まれました」も警告も「hello world」を記録しません:

 injectScript("https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython.min.js")
    .then(() => {
        console.log('min script loaded!');
        injectScript("https://cdnjs.cloudflare.com/ajax/libs/brython/3.9.5/brython_stdlib.min.js")
            .then(() => {
                console.log('stdlib script loaded!');
                
                injectPython((chrome.runtime.getURL("/python.js")))
                    .then(() => {
                        console.log("python loaded")
                    }).catch(error => {
                    console.log(error)
                })
            }).catch(error => {
                console.error(error);
            });
    }).catch(error => {
        console.error(error);
    });