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

fix older chrome support (#3722)

Browse Source 
* fix older chrome support

* fix chrome regex
This commit is contained in:
Dan
2020-06-05 01:02:40 -06:00
committed by GitHub
parent 5ba551ad48
commit 788a8cefdc
2 changed files with 19 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/slate-react/src/components/editable.tsx
View File

@@ -14,7 +14,12 @@ import scrollIntoView from 'scroll-into-view-if-needed'
import Children from './children' import Children from './children'
import Hotkeys from '../utils/hotkeys' import Hotkeys from '../utils/hotkeys'
import { IS_FIREFOX, IS_SAFARI, IS_EDGE_LEGACY } from '../utils/environment' import {
IS_FIREFOX,
IS_SAFARI,
IS_EDGE_LEGACY,
IS_CHROME_LEGACY,
} from '../utils/environment'
import { ReactEditor } from '..' import { ReactEditor } from '..'
import { ReadOnlyContext } from '../hooks/use-read-only' import { ReadOnlyContext } from '../hooks/use-read-only'
import { useSlate } from '../hooks/use-slate' import { useSlate } from '../hooks/use-slate'
@@ -39,7 +44,12 @@ import {
} from '../utils/weak-maps' } from '../utils/weak-maps'
// COMPAT: Firefox/Edge Legacy don't support the `beforeinput` event // COMPAT: Firefox/Edge Legacy don't support the `beforeinput` event
const HAS_BEFORE_INPUT_SUPPORT = !(IS_FIREFOX || IS_EDGE_LEGACY) // Chrome Legacy doesn't support `beforeinput` correctly
const HAS_BEFORE_INPUT_SUPPORT = !(
IS_FIREFOX ||
IS_EDGE_LEGACY ||
IS_CHROME_LEGACY
)
/** /**
* `RenderElementProps` are passed to the `renderElement` handler. * `RenderElementProps` are passed to the `renderElement` handler.
@@ -347,13 +357,13 @@ export const Editable = (props: EditableProps) => {
// real `beforeinput` events sadly... (2019/11/04) // real `beforeinput` events sadly... (2019/11/04)
// https://github.com/facebook/react/issues/11211 // https://github.com/facebook/react/issues/11211
useIsomorphicLayoutEffect(() => { useIsomorphicLayoutEffect(() => {
if (ref.current) { if (ref.current && HAS_BEFORE_INPUT_SUPPORT) {
// @ts-ignore The `beforeinput` event isn't recognized. // @ts-ignore The `beforeinput` event isn't recognized.
ref.current.addEventListener('beforeinput', onDOMBeforeInput) ref.current.addEventListener('beforeinput', onDOMBeforeInput)
} }
return () => { return () => {
if (ref.current) { if (ref.current && HAS_BEFORE_INPUT_SUPPORT) {
// @ts-ignore The `beforeinput` event isn't recognized. // @ts-ignore The `beforeinput` event isn't recognized.
ref.current.removeEventListener('beforeinput', onDOMBeforeInput) ref.current.removeEventListener('beforeinput', onDOMBeforeInput)
} }

5
packages/slate-react/src/utils/environment.ts
View File

@@ -19,3 +19,8 @@ export const IS_SAFARI =
export const IS_EDGE_LEGACY = export const IS_EDGE_LEGACY =
typeof navigator !== 'undefined' && typeof navigator !== 'undefined' &&
/Edge?\/(?:[0-6][0-9]|[0-7][0-8])/i.test(navigator.userAgent) /Edge?\/(?:[0-6][0-9]|[0-7][0-8])/i.test(navigator.userAgent)
// Native beforeInput events don't work well with react on Chrome 75 and older, Chrome 76+ can use beforeInput
export const IS_CHROME_LEGACY =
typeof navigator !== 'undefined' &&
/Chrome?\/(?:[0-7][0-5]|[0-6][0-9])/i.test(navigator.userAgent)