Блог

Я работаю над расширением браузера, которое подчеркивает сложность определенных слов при вводе в gmail. Я использую InboxSDK для основных изменений форматирования.

На базовом уровне логика, которую я написал, делает следующее:

1. Извлеките raw text из композитора (используя InboxSDK)
2. Передайте функцию raw text в format() функцию и получите обратно только что сгенерированное тело HTML
3. Замените сгенерированный вывод HTML текущим HTML в GMail composer (снова используя InboxDSK).

Теперь в композиторе GMail есть пользовательская кнопка от InboxSDSK. Если вы нажмете на нее, произойдет то, что описано выше.

Теперь я хочу, чтобы HTML-текст композитора Gmail реагировал так, как вы вводите. (т. е. Когда пользователь вводит трудночитаемое предложение, редактор должен пометить его красным цветом. Когда пользователь редактирует его, красная подсветка должна исчезнуть.).

Я подумал, что это можно сделать несколькими способами. Ни один из них в итоге не сработал.

1. Есть bodyChange событие из InboxDSK, но это немедленно создает бесконечный цикл, потому что, когда (1) пользователь начинает вводить текст (2) format() , функция заменяет старый HTML новыми стилями форматирования, и это (3) запускает изменение тела, которое затем format() снова запустит функцию и так далее.

Код:

 let OriginalText = document.querySelector('div[contenteditable][aria-label="Message Body"]').innerText;

function format() {
...

composeView.setBodyHTML(OutputText);
}

composeView.on('bodyChanged', function() {      
  format(OriginalText);
});
 

2. Вторым было бы использование keydown подхода, поэтому я написал:

 window.addEventListener('keydown', function (e) {
   if (e.keyCode == 90) {
     format(OriginalText);
   }
});
 

Но, по-видимому, это не выполняется в Gmail. Останавливает ли это распространение событий?

Как бы вы подошли к этому?