2

Web サイトに利便性を追加する Chrome 拡張機能を開発しています。
ページの DOM にアクセスできますが、そのページの「ファーストパーティ」JS と対話する必要もありますが、これは拡張機能からは実行できません。

ページに任意のタグを挿入できます (特に<script>タグも)。

{
    html: '<div onclick="doSomething(this, \'someName\')"></div>'
}

挿入されるコードを最小限に抑えたいと思います。

ページから JS 変数を取得するためにイベント リスナーをページに挿入しようとしましたが、問題が発生しました。
aCustomEventが拡張機能から Web サイトまたはその逆に渡され、CustomEvent.detail特定のタイプのオブジェクト (少なくとも関数とエラー) がどこかに含まれている場合、全体CustomEvent.detailが削除される、つまり null に設定されるようです。

スクリプト (extension.js):

(function()
{
    var script = document.createElement('script');
    script.innerHTML = [
"window.addEventListener('xyz', function(ev)",
"    {                                      ",
"        console.log('after dispatch:');    ",
"        console.log(ev.detail);            ",
"    });                                    ",
    ].join('\n');
    document.head.appendChild(script);
    // JSON-serializable data
    var e = new CustomEvent('xyz', { detail: { x: 42, name: 'Schroedinger' } });
    console.log('before dispatch:')
    console.log(e.detail);
    window.dispatchEvent(e);
    // non-JSON-serializable data
    var detail = { x: 42, name: 'Schroedinger' };
    detail.detail = detail; // Create circular reference
    e = new CustomEvent('xyz', { detail: detail });
    console.log('before dispatch:')
    console.log(e.detail);
    window.dispatchEvent(e);
    // data with function
    e = new CustomEvent('xyz', { detail: { x: 42, name: 'Schroedinger', func: function(){} } });
    console.log('before dispatch:');
    console.log(e.detail);
    window.dispatchEvent(e);
    // data with error object
    e = new CustomEvent('xyz', { detail: { x: 42, name: 'Schroedinger', err: new Error() } });
    console.log('before dispatch:');
    console.log(e.detail);
    window.dispatchEvent(e);
})();

出力 (読みやすいようにパラグラフ化):

before dispatch:
Object {x: 42, name: "Schroedinger"}
after dispatch:
Object {x: 42, name: "Schroedinger"}

before dispatch:
Object {x: 42, name: "Schroedinger", detail: Object}
after dispatch:
Object {x: 42, name: "Schroedinger", detail: Object}

before dispatch:
Object {x: 42, name: "Schroedinger", func: function (){}}
after dispatch:
null

before dispatch:
Object {x: 42, name: "Schroedinger", err: Error at chrome-extension://...}
after dispatch:
null

私は当初、JSON シリアライズ可能性が問題だと思っていましたが、JSON シリアライズされた場合に循環参照が壊れる場合、イベントでは問題なく循環参照が渡されます。コンソールに何もないことを除いて、クロスオリジン以外の画像がキャンバスを汚染
するのと同じように、特定のオブジェクトがイベントの詳細を「汚染」しているように感じます。

この動作に関するドキュメントを見つけることができませんでした。(Paul S. が示唆したように) Chromeのアクセス許可リストには、そのための「特権」はないようです。

Chrome 40.0.2214.115m、43.0.2357.124m、および 48.0.2547.0-dev でテスト済み。

4

1 に答える 1