Alat pembangun · HTML WYSIWYG editor
Mengapa execCommand Dihentikan dan Perkara yang Digunakan oleh Editor Pelayar Sebaliknya
· Bagaimana ia berfungsi
html boleh diedit kandungan aliran kerja pembangun
Merangkumi kenaikan dan kejatuhan document.execCommand, sebab outputnya tidak konsisten, dan sebaliknya cara editor moden membina Pemilihan, Julat dan sebelum input.
Butang tebal satu baris yang berhenti menjadi selamat — dibuka dengan execCommand('bold') dan amaran penamatan
Butang tebal boleh menjadi satu panggilan: fokuskan permukaan pengeditan, kemudian minta `document.execCommand` untuk menggunakan `bold` pada pilihan semasa. ToolAcre masih menggunakan laluan itu kerana pelayar memiliki karet dan julat terpilih di dalam elemen boleh diedit kandungannya. Panggilan padat adalah mudah, tetapi kemudahan tidak menjadikan pokok yang terhasil boleh diramal.
Kod itu menganggap penolakan sebagai kemungkinan biasa. Pembalut arahannya mendapat pengecualian, mengumumkan bahawa pelayar menolak tindakan itu dan mengarahkan penulis ke mod sumber. Saling balik itu lebih jujur daripada menjanjikan bahawa satu klik bar alat sentiasa menghasilkan satu elemen tertentu atau berfungsi secara sama dalam setiap enjin.
Apa yang execCommand lakukan dan dari mana asalnya — menerangkan asal usulnya dalam Internet Explorer awal dan penggunaannya oleh setiap pelayar
Pembalut yang sama memacu senarai tebal, condong, tidak tersusun dan tersusun, mengalih keluar pemformatan, buat asal, buat semula, pemformatan sekat, pautan dan nyahpaut. Itu adalah arahan yang sebenarnya terdapat dalam bar alat; artikel ini tidak memanjangkan senarai dengan penjajaran, warna, fon, jadual, imej atau ciri teks kaya biasa yang tidak pernah didedahkan oleh pelaksanaan.
Setiap arahan dijalankan terhadap DOM yang boleh diedit secara langsung. Selepas itu, panel memuatkan semula sumber, pratonton, kiraan perkataan dan laporan pengalihan keluar daripada innerHTML semasa. Oleh itu, hasil yang disimpan bukanlah log arahan. Ia adalah siri yang ditapis bagi apa jua struktur yang ditinggalkan oleh pelayar selepas melakukan atau menolak operasi yang diminta.
Mengapa perintah API ditamatkan: pelayar boleh menghasilkan bentuk DOM yang berbeza
Penamatan penting kerana API tidak memberikan pengarang editor kontrak struktur yang tepat untuk setiap mutasi. Had ToolAcre secara jelas memberi amaran bahawa tingkah laku berbeza antara enjin, terutamanya di sekitar senarai bersarang. Senarai yang boleh dilihat mungkin boleh diterima manakala pilihan sarang atau pembalutnya berbeza daripada penanda pelayar lain yang dihasilkan.
Tiada sumber repositori menyokong dakwaan bahawa setiap pelayar, versi atau arahan mempunyai hasil keserasian tertentu. Pernyataan selamat adalah lebih sempit: pelaksanaan ini memanggil API yang telah ditamatkan, menangkap penolakan dan menawarkan pengeditan sumber langsung sebagai penetasan pelepasan aksara. Uji pelayar dan operasi yang anda ingin gunakan daripada mengekstrapolasi matriks.
Pemilihan dan Julat adalah alternatif yang berkaitan, tetapi alat ini tidak melaksanakannya
Pemilihan dan Julat boleh menerangkan sempadan DOM yang dipilih dan menyokong manipulasi pokok yang jelas, tetapi ToolAcre tidak melaksanakan enjin pemformatan gantian dengannya. Menamakan API tersebut seolah-olah ia adalah laluan kod semasa akan salah menerangkan produk. Di sini, arahan pelayar kekal sebagai mutator dan sanitizer kekal sebagai sempadan keluaran.
Model tersuai boleh memiliki tanda, blok, urus niaga dan pemetaan pemilihan, tetapi itu adalah seni bina produk yang berbeza dengan ujian yang berbeza. Editor ringan ini sengaja mengelak daripada mendakwa jentera sedemikian. Kontraknya yang boleh disemak ialah tindakan visual boleh mewujudkan DOM yang bergantung kepada pelayar, manakala mod sumber mendedahkan penanda yang ditapis yang sebenarnya akan disalin atau dimuat turun.
beforeinput bukan sebahagian daripada laluan pemformatan editor ini
Pelaksanaan juga tidak memintas `beforeinput` untuk menterjemah niat pengeditan ke dalam transaksi tersuai. Peristiwa input sahaja mencetuskan muat semula selepas pelayar menukar permukaan. Tampal dan lepas adalah pengecualian: peristiwa tersebut dihalang, papan keratan atau muatan pindahannya ditapis dan sahaja HTML atau teks biasa yang terhasil dimasukkan.
Perbezaan itu menghalang tuntutan seni bina yang luas. ToolAcre memiliki pintu tampal tetapi bukan setiap mutasi ketukan kekunci. Perintah menaip, pemadaman, Enter tingkah laku dan bar alat biasa kekal sebagai operasi penyuntingan pelayar. Sanitizer menyemak keluaran bersiri mereka; ia tidak menjadikan editor sebagai rangka kerja terdorong sebelum input atau menormalkan setiap mutasi DOM perantaraan.
Contoh yang berfungsi: periksa output arahan warisan yang sebenarnya dihasilkan oleh editor ini
Untuk semakan konkrit, taip dua ayat pendek, pilih satu frasa dan tekan Bold. Tukar kepada sumber HTML dan periksa elemen di sekeliling frasa itu. ToolAcre memetakan warisan `b` kepada `strong` semasa pembersihan, jadi hasil yang ditapis boleh menjadi semantik walaupun apabila perintah pengeditan langsung pada mulanya memilih teg warisan.
Ulang dengan senarai dan kemudian buat asal. Bar alat menghantar `insertUnorderedList` dan `undo`; ia tidak mengekalkan sejarah aplikasi yang berasingan. Jika pelayar menolak, wilayah status menyatakan demikian. Jika sarang kelihatan ganjil, mod sumber ialah laluan pembetulan yang disokong. Output yang diperhatikan, bukan label butang, adalah bukti.
Perkara ini tidak meliputi: tiada seni bina editor pengganti dilaksanakan di sini
Artikel ini tidak menuntut sokongan untuk sistem arahan gantian moden, urus niaga kolaboratif, pepohon silang pelayar yang menentukan atau timbunan asal tersuai. Ia juga tidak membuat kesimpulan tingkah laku untuk pintasan papan kekunci kerana sumber mentakrifkan tindakan bar alat, bukan pendaftaran pintasan. Ciri yang tidak disokong kekal ditinggalkan dan bukannya keupayaan tersirat.
Keselamatan adalah berasingan daripada pilihan arahan. Penanda senarai dibenarkan mengeluarkan penanda dan pratonton dikotak pasir tanpa skrip, tetapi sanitizer secara eksplisit menafikan penggunaan sebagai penapis XSS input bermusuhan am. Pelayan yang menerima kandungan penerbitan yang tidak dipercayai masih memerlukan bahagian pelayan yang sesuai HTML5-parser sanitizer dan dasar khusus destinasi.
Bawa pulang: miliki DOM, bukan perintah — meringkaskan laluan migrasi dan cara penanda yang terhasil ialah apa yang anda periksa dalam alat WYSIWYG-to-HTML
Miliki hasilnya anda boleh periksa. Dalam editor ini, arahan meminta pelayar untuk memutasi pepohon boleh diedit kandungan, kemudian senarai yang dibenarkan menulis semula penyirian pepohon itu ke dalam subset yang disokong. Mod sumber mendedahkan handoff dan menyediakan permukaan pembaikan praktikal apabila tingkah laku penyuntingan pelayar menyusahkan atau tidak konsisten.
Gunakan sampel pakai buang dalam pelayar yang sama seperti kerja sebenar anda. Gunakan sahaja arahan yang dihantar, periksa pautan dan sarang, uji buat asal sebelum bergantung padanya dan salin HTML yang ditapis sahaja selepas membacanya. Aliran kerja itu menghormati penamatan tanpa berpura-pura ToolAcre telah pun menggantikan pengeditan asas API.