Greasemonkey: @ run-at document-startの場合、document.headはnullです。

作成日 2017年06月15日 · 9コメント · ソース: greasemonkey/greasemonkey

環境

ユーザースクリプトのテスト：

// ==UserScript==
// <strong i="15">@name</strong>        HeadTest
// <strong i="16">@namespace</strong>   HeadTest
// <strong i="17">@include</strong>     *
// @run-at      document-start
// <strong i="18">@version</strong>     1
// <strong i="19">@grant</strong>       none
// ==/UserScript==
AddGlobalStyle('body{background-color:red;}');

function AddGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName("head")[0];
    console.log("[Test]: Head: %o", head); //DEBUG
    console.log("[Test]: document.head: %o", document.head); //DEBUG
}

結果を期待する：

[Test]: Head:  <head> 
[Test]: document.head:  <head>

実結果：

[Test]: Head:  undefined
[Test]: document.head:  null

この問題はGM_addStyleにも当てはまります

ソース

byzod

👍5 👎1

最も参考になるコメント

@ the8472現在のdocument-startの動作が正しく、意図的に行われている場合は、スタイルを追加する必要があるたびにオブザーバーを使用する必要があります
何かのようなもの

function addGlobalStyle(css){
  let headHunter = new MutationObserver(
    records => {
    ; check mutation records
    ; is added node's tag name 'head'?
    ; create a style node then throw it in
    ; then disconnect us
   }
  );
  headhunter.observer(document, {childlist : true});
}

document-endの前にスタイルを追加するすべてのスクリプトに必要です。つまらない。

GM_addstyleが私のためにそれを行うか、wikiにいくつかの有用な警告を書くことができることを願っています（「GM_addstyleは@ run-at document-startのスクリプトでは使用できません、使用しないでください」、自分で解決策を見つけてください"など）

byzod 2017年06月23日

👍2

全てのコメント9件

最後の良い点：Firefox 55.0a1（2017-03-17）
https://hg.mozilla.org/mozilla-central/rev/39607304b774591fa6e32c4b06158d869483c312からビルド

最初の悪い点：Firefox 55.0a1（2017-03-17）
https://hg.mozilla.org/mozilla-central/rev/23a4b7430dd7e83a2809bf3dc41471f154301edaからビルド

プッシュログ：
https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=39607304b774591fa6e32c4b06158d869483c312&tochange=23a4b7430dd7e83a2809bf3dc41471f154301eda

バグ1333990が容疑者です。

＃1849も参照してください

janekptacijarabaci 2017年06月15日

👍2

@janekptacijarabaci回避策が見つかりました：

setTimeout(()=>{
    AddGlobalStyle('body{background-color:red;}');
});

それは不安定で信頼できないように見えますが、それは物事を機能させる現在私が見つけることができる最も簡単な方法です。

byzod 2017年06月16日

...そしてドキュメントはまだ間違っています。
https://developer.mozilla.org/en-US/docs/Observer_Notifications#Documents

https://bugzilla.mozilla.org/show_bug.cgi?id=1333990#c128

janekptacijarabaci 2017年06月16日

これはバグではないと思います。 document-startは非常に早い段階で発生します。これにより、コンテンツjavascriptが実行される前に、ユーザースクリプトがページを操作できるようになります。

後で実行する場合は、 document-endを使用するか、ミューテーションオブザーバーを使用して特定の要素が挿入されるのを待ちます。

the8472 2017年06月23日

@ the8472
多分あなたは正しいです。
MDNによると：

ドキュメント要素が挿入されました
ドキュメントのルート要素が作成された直後、ただしスクリプトを実行する前に送信されます。

document-start （ document-element-insertedに基づく）は、 <html></html>が作成された直後に発生します。このとき、 <head>はnullです。

ただし、これにより、ページがレンダリングされる前にスタイルを追加しようとする多くのスクリプトが壊れます（ GM_addstyleをdocument-endで使用すると、ページが点滅していることに気付くでしょう）。

これが意図的に行われているのかわかりません

byzod 2017年06月23日

GM_addStyleはとにかくばかげています<style>タグを<head>に挿入するだけです。必要に応じて、ミューテーションオブザーバーを使用して、自分でそれを行うことができます。

しかし、それが実際の懸念事項である場合は、パッチを適用して、 <head>の存在を確認し、存在しない場合はオブザーバーを使用することができます。

the8472 2017年06月23日

👎2

function addGlobalStyle(css){
  let headHunter = new MutationObserver(
    records => {
    ; check mutation records
    ; is added node's tag name 'head'?
    ; create a style node then throw it in
    ; then disconnect us
   }
  );
  headhunter.observer(document, {childlist : true});
}

document-endの前にスタイルを追加するすべてのスクリプトに必要です。つまらない。

byzod 2017年06月23日

👍2

はい、gm_addstyleを修正する必要があります。

ただし、スクリプトが実行する可能性のある他のすべてのことも、ドキュメントの開始時に同じフープをジャンプして、その点で特別ではないスタイルを追加する必要があります。利用できるDOMはないため、必要なものは何でも待つ必要があります。つまり、ドキュメントの開始時に実行する場合は、とにかくオブザーバーを使用する必要があります。

the8472 2017年06月23日

詳細なレポートをありがとうございますが、これはWAIであり、3.xブランチはとにかく死んでいます。（私は、たとえば、新しいWeb拡張機能の大君主を歓迎します。） GM_addStyleのようなものは、4.xに存在しないことで修正されます。

https://arantius.com/misc/greasemonkey/amazon-url-cleaner.user.jsのような、DOMをまったく必要としないスクリプトが存在するため、できるだけ早く実行する必要があります。

arantius 2017年06月23日

このページは役に立ちましたか？

0 / 5 - 0 評価

Greasemonkey: @ run-at document-startの場合、document.headはnullです。

環境

ユーザースクリプトのテスト：

結果を期待する：

実結果：

最も参考になるコメント

全てのコメント9件

関連する問題