Greasemonkey: document.head adalah nol ketika @run-at document-start

Dibuat pada 15 Jun 2017 · 9Komentar · Sumber: greasemonkey/greasemonkey

Lingkungan

Kunci | Nilai
-- | --
Platform Sistem | AMD64, Windows-10-10.0.14393
Peramban | Edisi Pengembang Firefox (55.0 Beta 1, 64 bit)
Agen Pengguna | Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:55.0) Gecko/20100101 Firefox/55.0
Bangun Konfigurasi | https://hg.mozilla.org/releases/mozilla-beta/rev/6872377277a618b2b9e0d2b4c2b9e51765ac199e
Monyet Gemuk | 3.11

Uji skrip pengguna:

// ==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
}

Hasil yang diharapkan:

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

Hasil Sebenarnya:

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

Masalah ini juga berlaku untuk GM_addStyle

Sumber

byzod

👍5 👎1

Komentar yang paling membantu

@the8472 Jika perilaku document-start saat ini benar dan disengaja, maka kita perlu menggunakan pengamat setiap kali Anda perlu menambahkan gaya
Sesuatu seperti

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});
}

diperlukan untuk setiap skrip yang menambahkan gaya sebelum document-end . Itu membosankan.

Saya harap GM_addstyle dapat melakukannya untuk saya, atau menulis beberapa peringatan yang berguna di wiki ("GM_addstyle tidak tersedia untuk skrip dengan @run-at document-start, jangan gunakan, temukan sendiri solusinya ", dll)

byzod pada 23 Jun 2017

👍2

Semua 9 komentar

Kebaikan terakhir: Firefox 55.0a1 (2017-03-17)
Bangun dari https://hg.mozilla.org/mozilla-central/rev/39607304b774591fa6e32c4b06158d869483c312

Pertama buruk: Firefox 55.0a1 (2017-03-17)
Bangun dari https://hg.mozilla.org/mozilla-central/rev/23a4b7430dd7e83a2809bf3dc41471f154301eda

Pushlog:
https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=39607304b774591fa6e32c4b06158d869483c312&tochange=23a4b7430dd7e83a2809bf3dc41471f154301eda

Bug 1333990 adalah tersangkanya.

Lihat juga #1849

janekptacijarabaci pada 15 Jun 2017

👍2

@janekptacijarabaci Menemukan solusi:

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

Kelihatannya tidak stabil dan tidak dapat diandalkan, tetapi itulah cara paling sederhana yang dapat saya temukan saat ini yang membuat semuanya berfungsi.

byzod pada 16 Jun 2017

...dan dokumentasinya masih salah.
https://developer.mozilla.org/en-US/docs/Observer_Notifications#Documents

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

janekptacijarabaci pada 16 Jun 2017

Saya tidak berpikir ini adalah bug. document-start terjadi sangat awal. Ini memungkinkan skrip pengguna untuk memanipulasi halaman sebelum javascript konten apa pun dieksekusi.

Jika Anda ingin mengeksekusi nanti, gunakan saja document-end atau gunakan pengamat mutasi untuk menunggu elemen tertentu dimasukkan.

the8472 pada 23 Jun 2017

@the8472
Mungkin kau benar.
Menurut MDN:

dokumen-elemen-dimasukkan
Dikirim segera setelah elemen akar dokumen dibuat, tetapi sebelum menjalankan skrip apa pun di dalamnya.

document-start (berdasarkan document-element-inserted ) diaktifkan segera setelah <html></html> dibuat, saat ini, <head> adalah null.

Tetapi ini merusak banyak skrip yang mencoba menambahkan gaya sebelum halaman dirender (jika Anda menggunakan GM_addstyle dengan document-end Anda akan melihat bahwa halaman berkedip) seperti yang berfungsi sebelumnya

Saya tidak yakin ini sengaja

byzod pada 23 Jun 2017

GM_addStyle toh konyol, itu hanya memasukkan tag <style> ke <head> , Anda dapat melakukannya sendiri, dengan pengamat mutasi jika perlu.

Tetapi jika itu masalah sebenarnya, itu bisa ditambal untuk memeriksa keberadaan <head> gunakan pengamat jika tidak.

the8472 pada 23 Jun 2017

👎2

@the8472 Jika perilaku document-start saat ini benar dan disengaja, maka kita perlu menggunakan pengamat setiap kali Anda perlu menambahkan gaya
Sesuatu seperti

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});
}

diperlukan untuk setiap skrip yang menambahkan gaya sebelum document-end . Itu membosankan.

byzod pada 23 Jun 2017

👍2

Ya, gm_addstyle harus diperbaiki.

Tetapi semua hal lain yang mungkin dilakukan skrip juga harus melewati rintangan yang sama saat memulai dokumen, menambahkan gaya yang tidak istimewa dalam hal itu. Tidak ada DOM yang tersedia, jadi Anda harus menunggu apa pun yang Anda butuhkan. Yaitu Anda tetap harus menggunakan pengamat jika Anda menjalankan sesuatu saat memulai dokumen.

the8472 pada 23 Jun 2017

Terima kasih atas laporan terperincinya, tetapi ini WAI, dan cabang 3.x ~ tetap saja mati. (Saya, untuk satu, menyambut tuan ekstensi web baru kami.) Hal-hal seperti GM_addStyle akan diperbaiki dengan tidak pernah ada di 4.x.

Skrip seperti https://arantius.com/misc/greasemonkey/amazon-url-cleaner.user.js ada yang tidak memerlukan DOM sama sekali, dan harus dijalankan secepatnya.