Fix Safari IME support (#11016)
* Fix Safari IME support * Try remove hasIMEComposingJustEnded * Remove redundant code * Run prettier --------- Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
parent
80e75e3b70
commit
97339ee2f6
1 changed files with 13 additions and 4 deletions
|
@ -129,6 +129,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
private modifiedFlag = false;
|
||||
private isIMEComposing = false;
|
||||
private hasTextSelected = false;
|
||||
private readonly isSafari: boolean;
|
||||
|
||||
private _isCaretAtEnd = false;
|
||||
private lastCaret!: DocumentOffset;
|
||||
|
@ -149,6 +150,9 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
showVisualBell: false,
|
||||
};
|
||||
|
||||
const ua = navigator.userAgent.toLowerCase();
|
||||
this.isSafari = ua.includes("safari/") && !ua.includes("chrome/");
|
||||
|
||||
this.useMarkdownHandle = SettingsStore.watchSetting(
|
||||
"MessageComposerInput.useMarkdown",
|
||||
null,
|
||||
|
@ -308,10 +312,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
|
||||
// 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) {
|
||||
if (this.isSafari) {
|
||||
this.onInput({ inputType: "insertCompositionText" });
|
||||
} else {
|
||||
Promise.resolve().then(() => {
|
||||
|
@ -324,6 +325,9 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
// checking the event.isComposing flag just in case any browser out there
|
||||
// emits events related to the composition after compositionend
|
||||
// has been fired
|
||||
|
||||
// From https://www.stum.de/2016/06/24/handling-ime-events-in-javascript/
|
||||
// Safari emits an additional keyDown after compositionend
|
||||
return !!(this.isIMEComposing || (event.nativeEvent && event.nativeEvent.isComposing));
|
||||
}
|
||||
|
||||
|
@ -503,6 +507,11 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
|
||||
private onKeyDown = (event: React.KeyboardEvent): void => {
|
||||
if (!this.editorRef.current) return;
|
||||
if (this.isSafari && event.which == 229) {
|
||||
// Swallow the extra keyDown by Safari
|
||||
event.stopPropagation();
|
||||
return;
|
||||
}
|
||||
const model = this.props.model;
|
||||
let handled = false;
|
||||
|
||||
|
|
Loading…
Reference in a new issue