try to see if this fixes safari back

on of the 2 changes (updating dom async from compositionend,
or ignoring keydown while composing) here has, while fixing chrome,
broken safari.

Don't do the async dom updating for safari if that was it.
pull/21833/head
Bruno Windels 2019-09-25 10:33:52 +02:00
parent 7bda1c58eb
commit ffe34ee8a1
3 changed files with 22 additions and 4 deletions

View File

@ -169,15 +169,31 @@ export default class BasicMessageEditor extends React.Component {
_onCompositionEnd = (event) => {
this._isIMEComposing = false;
// some browsers (chromium) don't fire an input event after ending a composition
// some browsers (Chrome) don't fire an input event after ending a composition,
// so trigger a model update after the composition is done by calling the input handler.
// do this async though, as modifying the DOM from the compositionend event might confuse the composition.
setTimeout(() => {
// however, modifying the DOM (caused by the editor model update) from the compositionend handler seems
// to confuse the IME in Chrome, likely causing https://github.com/vector-im/riot-web/issues/10913 ,
// so we do it async
// however, doing this async seems to break things in Safari for some reason, so browser sniff.
const ua = navigator.userAgent.toLowerCase();
const isSafari = ua.includes('safari/') && !ua.includes('chrome/');
if (isSafari) {
this._onInput({inputType: "insertCompositionText"}, true);
}, 0);
} else {
setTimeout(() => {
this._onInput({inputType: "insertCompositionText"}, true);
}, 0);
}
}
isComposing(event) {
// checking the event.isComposing flag just in case any browser out there
// emits events related to the composition after compositionend
// has been fired
return !!(this._isIMEComposing || event.isComposing);
}

View File

@ -127,6 +127,7 @@ export default class EditMessageComposer extends React.Component {
}
_onKeyDown = (event) => {
// ignore any keypress while doing IME compositions
if (this._editorRef.isComposing(event)) {
return;
}

View File

@ -104,6 +104,7 @@ export default class SendMessageComposer extends React.Component {
};
_onKeyDown = (event) => {
// ignore any keypress while doing IME compositions
if (this._editorRef.isComposing(event)) {
return;
}