Как инициализировать событие клавиатуры с заданным char / keycode в расширении Chrome?

Если у кого-то есть проблема, с которой я столкнулся, с запуском клавиатуры с определенным кодом клавиши. Это один способ.

Во-первых, я безуспешно попытался ответить @RobW выше. Код ключа не передается, всегда не определен.

Затем я просмотрел ответ @ disya2, который действительно сработал.

Итак, вот код: -

Манифест

"permissions": [
    "debugger"
  ],

ContentScript.js

chrome.runtime.sendMessage({ pressEnter: true });

Background.js

chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
    if(message.pressEnter){
        chrome.tabs.query({active: true}, function(tabs) {
            chrome.debugger.attach({ tabId: tabs[0].id }, "1.0");
            chrome.debugger.sendCommand({ tabId: tabs[0].id }, 'Input.dispatchKeyEvent', { type: 'keyUp', windowsVirtualKeyCode:13, nativeVirtualKeyCode : 13, macCharCode: 13  });
            chrome.debugger.sendCommand({ tabId: tabs[0].id }, 'Input.dispatchKeyEvent', { type: 'keyDown', windowsVirtualKeyCode:13, nativeVirtualKeyCode : 13, macCharCode: 13  });
            chrome.debugger.detach({ tabId: tabs[0].id });
        });
    }
});

Поскольку Chrome не сохраняет настраиваемые свойства, когда вы инициируете событие из сценария содержимого на странице (и наоборот), внедрите сценарий на страницу, чтобы выполнить это задание. Вот базовый пример, демонстрирующий идею. Его можно использовать, хотя свойства key и keyCode обрабатываются некорректно (их все равно использовать не следует).

// Example: Say, you've got a reference to a DOM element...    
var elem = document.body;
// And you want to "type" "A"
var charCode = 65;

// Now, you want to generate a key event...
triggerKeyEvent(elem, charCode);

// triggerKeyEvent is implemented as follows:
function triggerKeyEvent(element, charCode) {
    // We cannot pass object references, so generate an unique selector
    var attribute = 'robw_' + Date.now();
    element.setAttribute(attribute, '');
    var selector = element.tagName + '[' + attribute + ']';

    var s = document.createElement('script');
    s.textContent = '(' + function(charCode, attribute, selector) {
        // Get reference to element...
        var element = document.querySelector(selector);
        element.removeAttribute(attribute);

        // Create KeyboardEvent instance
        var event = document.createEvent('KeyboardEvents');
        event.initKeyboardEvent(
            /* type         */ 'keypress',
            /* bubbles      */ true,
            /* cancelable   */ false,
            /* view         */ window,
            /* keyIdentifier*/ '',
            /* keyLocation  */ 0,
            /* ctrlKey      */ false,
            /* altKey       */ false,
            /* shiftKey     */ false,
            /* metaKey      */ false,
            /* altGraphKey  */ false
        );
        // Define custom values
        // This part requires the script to be run in the page's context
        var getterCode = {get: function() {return charCode}};
        var getterChar = {get: function() {return String.fromCharCode(charCode)}};
        Object.defineProperties(event, {
            charCode: getterCode,
            which: getterCode,
            keyCode: getterCode, // Not fully correct
            key: getterChar,     // Not fully correct
            char: getterChar
        });

        element.dispatchEvent(event);
    } + ')(' + charCode + ', "' + attribute + '", "' + selector + '")';
    (document.head||document.documentElement).appendChild(s);
    s.parentNode.removeChild(s);
    // The script should have removed the attribute already.
    // Remove the attribute in case the script fails to run.
    s.removeAttribute(attribute);
}

Это простой пример, который запускает событие keypress для символа «A». Если вы хотите инициировать более релевантные ключевые события, не используйте triggerKeyEvent три раза (потому что это имеет небольшие накладные расходы). Вместо этого измените функцию triggerKeyEvent так, чтобы она запускала все события (keydown, keypress, keyup и / или input) с правильными параметрами.

Если вам нужно изменить altKey, shiftKey и т. Д., Просто измените функцию.
Итог: приведенный мной пример очень прост и может быть изменен в соответствии с вашими потребностями.

Читать далее

Если вы хотите изменить реализацию в соответствии со спецификацией, прочтите эти источники:

• W3C: Спецификация событий DOM уровня 3, раздел Типы событий клавиатуры < / а>
• W3C: Спецификация событий DOM уровня 3, приложение B: Устаревшие ключевые атрибуты: keyCode, charCode и which.

Если вы хотите узнать больше о концепции внедрения сценария в сценарий содержимого, см.:

• Переполнение стека: Создание расширения Chrome - внедрение кода на страницу с помощью сценария содержимого

Я обнаружил, что протокол отладчика Chrome v1.1 - это однозначный ответ на имитацию событий клавиш и мыши из расширения Google Chrome. Часть протокола доступна через chrome.debugger API.