Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: DraftEditor crashes in Safari when IME composition committed #2

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,11 @@ Notable changes to Draft.js will be documented in this file.

Changes to `src` are live in production on facebook.com at the time of release.

## 0.11.8-rc.1 (Jun 26th, 2021)

### Changed
* [[`5dfe40d3d4`](https://github.com/twreporter/draft-js/commit/5dfe40d3d4)] - **fix**: add key prop to child component rather than the block (Tai-Jiun Fang)

## 0.11.8-rc.0 (Jun 10th, 2021)

### Added
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "@twreporter/draft-js",
"description": "A React framework for building text editors.",
"version": "0.11.8-rc.0",
"version": "0.11.8-rc.1",
"keywords": [
"draftjs",
"editor",
Expand Down
4 changes: 2 additions & 2 deletions src/component/contents/DraftEditorContents-core.react.js
Original file line number Diff line number Diff line change
Expand Up @@ -192,7 +192,6 @@ class DraftEditorContents extends React.Component<Props> {
preventScroll,
selection,
tree: editorState.getBlockTree(key),
key: `${key}-${blockKeyMap.get(key) || '0'}`,
Copy link

@babygoat babygoat Jun 28, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will the key removal have any side-effect on the parent block of the <Component /> ?

Copy link
Author

@taylrj taylrj Jul 2, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, it won't.
React uses key to identify the existing element which won't be unmounted. Also, an element and its descendants won't be unmounted only if its type (e.g. div, span) and key keep the same with the previous one. If an element with no key, React only compares its type and index(index in a children list).

Since is the only child of its parent Child, this diff removes the key from here to its parent which I don't think has any side-effect, AFAIK.

};

const configForType =
Expand Down Expand Up @@ -230,8 +229,9 @@ class DraftEditorContents extends React.Component<Props> {
'data-block': true,
'data-editor': editorKey,
'data-offset-key': offsetKey,
key,
key: `${key}-${blockKeyMap.get(key) || '0'}` ,
};

if (customEditable !== undefined) {
childProps = {
...childProps,
Expand Down