mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-04-16 03:12:48 +02:00
Code Issues Releases Wiki Activity

Fix deletion in Chrome when inline void node is selected (#4307)

Browse Source
This commit is contained in:
Claudéric Demers 2021-06-01 14:11:05 -04:00 committed by GitHub
parent 2c17e2b7f9
commit a7e3a18187
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/delete-inline-void.md Normal file
View File

@ -0,0 +1,5 @@
---
'slate-react': patch
---
Fix deletion of selected inline void nodes in Chrome. Chrome does not fire a `beforeinput` event when deleting backwards within an inline void node, so we need to add special logic to handle this edge-case for Chrome only.

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

@ -18,6 +18,7 @@ import useChildren from '../hooks/use-children'
import Hotkeys from '../utils/hotkeys'
import {
HAS_BEFORE_INPUT_SUPPORT,
IS_CHROME,
IS_FIREFOX,
IS_FIREFOX_LEGACY,
IS_SAFARI,
@ -1057,6 +1058,33 @@ export const Editable = (props: EditableProps) => {
return
}
} else {
if (IS_CHROME) {
// COMPAT: Chrome supports `beforeinput` event but does not fire
// an event when deleting backwards in a selected void inline node
if (
selection &&
(Hotkeys.isDeleteBackward(nativeEvent) ||
Hotkeys.isDeleteForward(nativeEvent)) &&
Range.isCollapsed(selection)
) {
const currentNode = Node.parent(
editor,
selection.anchor.path
)
if (
Element.isElement(currentNode) &&
Editor.isVoid(editor, currentNode) &&
Editor.isInline(editor, currentNode)
) {
event.preventDefault()
Transforms.delete(editor, { unit: 'block' })
return
}
}
}
}
}
},