Electron: elemen input yang dihapus dari DOM menggunakan ^Z hingga undo stack-nya kosong

Dibuat pada 3 Des 2015 · 3Komentar · Sumber: electron/electron

Repro minimal: https://Gist.github.com/DanielDignam/b49084941a2f731501d5

Kami menggunakan node 4.1.1, Chrome 45.0.2454.85, dan Electron 0.35.2, di Windows 10

Jalankan aplikasi terlampir. Perhatikan ^Z melaporkan dengan benar ke konsol. Ketik sesuatu ke dalam kotak input dan tekan tombol untuk menghapus elemen dari DOM. Tekan ^Z perhatikan itu tidak dilaporkan. Tekan ^Z lagi dan perhatikan benar.

Jika Anda menjalankan ulang dan menempelkan sesuatu ke dalam kotak teks N kali, Anda akan melihat jumlah ^Z yang diperlukan sebelum dilaporkan adalah N+1.

Implikasinya adalah bahwa kotak input masih memproses peristiwa meskipun tidak lagi berada di DOM, dan tidak meneruskan ^Z sampai ia mengosongkan tumpukan Undo-nya.

Ini memecah undo di aplikasi kita di mana tindakan undo aplikasi tidak akan dipulihkan pada ^Z jika bidang input telah digunakan dan kemudian dihapus dari DOM.

Kami ingin membatalkan status lain dalam aplikasi kami ketika tidak ada formulir/input.

<!DOCTYPE html>
<html>
<head>
    <title>Hello World!</title>
</head>
<body id='body'>
<h1>Hello World!</h1>
We are using node <script>document.write(process.versions.node)</script>,
Chrome <script>document.write(process.versions.chrome)</script>,
and Electron <script>document.write(process.versions.electron)</script>.
<script>
    function removeInput(event) {
        var i = document.getElementById("foo");
        var b = document.getElementById("body");
        b.removeChild(i);
    }
    const remote = require('electron').remote;
    const Menu = remote.Menu;
    const MenuItem = remote.MenuItem;
    var template = [
        {
            label: 'Edit',
            submenu: [
                {
                    label: 'Undo',
                    accelerator: 'CmdOrCtrl+Z',
                    click: function () {
                        console.log('Undo called');
                    },
                    enabled: true
                }
            ]
        }];
    menu = Menu.buildFromTemplate(template);
    Menu.setApplicationMenu(menu);
</script>
<input id='foo' type='text'/>
<input type='button' onclick='removeInput()'/>
</body>
</html>

Sumber

DanielDignam

Semua 3 komentar

Ini adalah bug Chromium saat menangani input DOM, saya pikir solusinya adalah menangani input dengan acara DOM secara manual alih-alih mengandalkan akselerator Menu.

Untuk memperbaikinya, kita harus menggali kode sumber Chromium, tetapi itu terlalu banyak pekerjaan. Melaporkannya ke Chromium sepertinya tidak akan berhasil juga karena untuk mereproduksinya Anda harus menambahkan item menu khusus ke Chrome, yang tidak mungkin.

Saya menutup ini karena tidak akan diperbaiki karena mungkin tidak ada yang akan memeriksanya, dan Anda dapat mengatasinya dengan mendengarkan acara utama DOM.

zcbenz pada 4 Des 2015

Untuk orang-orang yang menemukan masalah ini seperti saya: ini adalah masalah di pelacak bug Chromium, pada saat penulisan ini masih belum diperbaiki.

evgenykochetkov pada 14 Nov 2018

😕3

Saya mengatasinya dengan membuat item menu tanpa akselerator dan mendengarkan acara tombol Ctrl+Z di renderer. Ini bekerja. Namun, bagaimana saya sekarang bisa mendapatkan pintasan "Ctrl+Z" untuk muncul di sebelah "Batalkan" di menu?