mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-17 20:51:20 +02:00
Code Issues Releases Wiki Activity

Improve desktop IME stability (#1316)

Browse Source 
* add missing composing consts

* limit usage of `onbeforeinput`

* fix ime error on new line

* fix empty block test

* fix leaky case

* add comment for magic char

* fix condition logic

* revert magic char
This commit is contained in:
Yifeng Wang
2017-10-28 16:39:18 -05:00
committed by Ian Storm Taylor
parent 3482437e5c
commit 92c48d9f1d
4 changed files with 23 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
packages/slate-react/src/components/content.js
View File

@@ -10,7 +10,12 @@ import Node from './node'
import findDOMRange from '../utils/find-dom-range' import findDOMRange from '../utils/find-dom-range'
import findRange from '../utils/find-range' import findRange from '../utils/find-range'
import scrollToSelection from '../utils/scroll-to-selection' import scrollToSelection from '../utils/scroll-to-selection'
import { IS_FIREFOX, SUPPORTED_EVENTS } from '../constants/environment' import {
IS_FIREFOX,
IS_IOS,
IS_ANDROID,
SUPPORTED_EVENTS
} from '../constants/environment'
/** /**
* Debug. * Debug.
@@ -87,7 +92,8 @@ class Content extends React.Component {
*/ */
componentDidMount = () => { componentDidMount = () => {
if (SUPPORTED_EVENTS.beforeinput) { // Restrict scoped of `beforeinput` to mobile.
if ((IS_IOS || IS_ANDROID) && SUPPORTED_EVENTS.beforeinput) {
this.element.addEventListener('beforeinput', this.onNativeBeforeInput) this.element.addEventListener('beforeinput', this.onNativeBeforeInput)
} }
@@ -103,7 +109,8 @@ class Content extends React.Component {
*/ */
componentWillUnmount() { componentWillUnmount() {
if (SUPPORTED_EVENTS.beforeinput) { // Restrict scoped of `beforeinput` to mobile.
if ((IS_IOS || IS_ANDROID) && SUPPORTED_EVENTS.beforeinput) {
this.element.removeEventListener('beforeinput', this.onNativeBeforeInput) this.element.removeEventListener('beforeinput', this.onNativeBeforeInput)
} }
} }

1
packages/slate-react/src/constants/environment.js
View File

@@ -92,6 +92,7 @@ export const IS_FIREFOX = BROWSER === 'firefox'
export const IS_SAFARI = BROWSER === 'safari' export const IS_SAFARI = BROWSER === 'safari'
export const IS_IE = BROWSER === 'ie' export const IS_IE = BROWSER === 'ie'
export const IS_ANDROID = OS === 'android'
export const IS_IOS = OS === 'ios' export const IS_IOS = OS === 'ios'
export const IS_MAC = OS === 'macos' export const IS_MAC = OS === 'macos'
export const IS_WINDOWS = OS === 'windows' export const IS_WINDOWS = OS === 'windows'

4
packages/slate-react/src/constants/hotkeys.js
View File

@@ -83,7 +83,9 @@ const COMPOSING = e => (
e.key == 'ArrowDown' || e.key == 'ArrowDown' ||
e.key == 'ArrowLeft' || e.key == 'ArrowLeft' ||
e.key == 'ArrowRight' || e.key == 'ArrowRight' ||
e.key == 'ArrowUp' e.key == 'ArrowUp' ||
e.key == 'Backspace' ||
e.key == 'Enter'
) )
/** /**

11
packages/slate-react/src/plugins/before.js
View File

@@ -4,7 +4,12 @@ import getWindow from 'get-window'
import { findDOMNode } from 'react-dom' import { findDOMNode } from 'react-dom'
import HOTKEYS from '../constants/hotkeys' import HOTKEYS from '../constants/hotkeys'
import { IS_FIREFOX, SUPPORTED_EVENTS } from '../constants/environment' import {
IS_FIREFOX,
IS_IOS,
IS_ANDROID,
SUPPORTED_EVENTS
} from '../constants/environment'
import findNode from '../utils/find-node' import findNode from '../utils/find-node'
/** /**
@@ -44,7 +49,9 @@ function BeforePlugin() {
// since it provides more useful information about the range being affected // since it provides more useful information about the range being affected
// and also preserves compatibility with iOS autocorrect, which would be // and also preserves compatibility with iOS autocorrect, which would be
// broken if we called `preventDefault()` on React's synthetic event here. // broken if we called `preventDefault()` on React's synthetic event here.
if (SUPPORTED_EVENTS.beforeinput) return true // Since native `onbeforeinput` mainly benefits autocorrect and spellcheck
// for mobile, on desktop it brings IME issue, limit its scope for now.
if ((IS_IOS || IS_ANDROID) && SUPPORTED_EVENTS.beforeinput) return true
debug('onBeforeInput', { event }) debug('onBeforeInput', { event })
} }