Skip to content

[lexical] Bug Fix: Normalize selection after applyDOMRange to account for Firefox differences#7050

Merged
etrepum merged 3 commits intofacebook:mainfrom
etrepum:firefox-selection
Jan 14, 2025
Merged

[lexical] Bug Fix: Normalize selection after applyDOMRange to account for Firefox differences#7050
etrepum merged 3 commits intofacebook:mainfrom
etrepum:firefox-selection

Conversation

@etrepum
Copy link
Copy Markdown
Collaborator

@etrepum etrepum commented Jan 14, 2025 •
edited
Loading

Description

When we use native selection methods to move the cursor in Firefox it will sometimes resolve to an element point, rather than a text point, which violates some assumptions baked into removeText and other internals.

This adds a normalization step to RangeSelection.applyDOMRange (on all platforms) that can be manually toggled off if necessary. I don't think this is needed but I also haven't seen a full e2e test run yet.

Closes #6991
Closes #7049

Test plan

Before

Backspacing across the border of an ElementNode will cause the majority of that ElementNode to be deleted in Firefox

After

Firefox behaves as other browsers do, and now we have an e2e test (with LinkNode) to demonstrate that the behavior is fixed

@etrepum etrepum added the extended-tests Run extended e2e tests on a PR label Jan 14, 2025
@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Jan 14, 2025
@vercel
Copy link
Copy Markdown

vercel bot commented Jan 14, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
lexical ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jan 14, 2025 9:41pm
lexical-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jan 14, 2025 9:41pm

@github-actions
Copy link
Copy Markdown

github-actions bot commented Jan 14, 2025 •
edited
Loading

size-limit report 📦

Path Size
lexical - cjs 29.02 KB (+0.09% 🔺)
lexical - esm 28.84 KB (+0.02% 🔺)
@lexical/rich-text - cjs 37.97 KB (+0.01% 🔺)
@lexical/rich-text - esm 30.9 KB (-0.2% 🔽)
@lexical/plain-text - cjs 36.54 KB (+0.09% 🔺)
@lexical/plain-text - esm 28.15 KB (+0.08% 🔺)
@lexical/react - cjs 39.77 KB (-0.19% 🔽)
@lexical/react - esm 32.26 KB (+0.17% 🔺)

zurfyx
zurfyx reviewed Jan 14, 2025
View reviewed changes
Copy link
Copy Markdown
Member

@zurfyx zurfyx left a comment

Choose a reason for hiding this comment

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

Thanks for fixing this! Do you know if this triggers an extra selection reconciliation? FWIW, this fix seems similar to triple click

@etrepum
Copy link
Copy Markdown
Collaborator Author

etrepum commented Jan 14, 2025

Thanks for fixing this! Do you know if this triggers an extra selection reconciliation? FWIW, this fix seems similar to triple click

I don't think so? The logic in there looks a bit wonky to me though, specifically:

  • RangeSelection.applyDOMSelection unconditionally mutates the RangeSelection via $setPointValues but doesn't mark the selection as dirty (though it does set cachedNodes to null)
  • $normalizeSelection uses Point.set to mutate its _selection and will mark it as dirty (as well as clearing the cache)

This means that when normalizing, the selection will always get marked as dirty, which would trigger updateDOMSelection, but that is probably already happening in most cases. Maybe it makes sense to add some guards to either Point.set or $normalizeSelection to only mark the selection as dirty if the point actually changed? That said, the contents of a selection can change even if the points don't, so cachedNodes with a writable EditorState still isn't really all that coherent unless it's managed very carefully.

There's also some compositionKey logic in Point.set which might be better placed somewhere else, but I'm not very familiar with how that hack works.

@etrepum
Copy link
Copy Markdown
Collaborator Author

etrepum commented Jan 14, 2025

The remaining e2e test failure is flaky

Current run:

[1]   1 failed
[1]     [chromium] › packages/lexical-playground/__tests__/e2e/Selection.spec.mjs:520:3 › Selection › Can delete sibling elements forward

A previous run:

   1 failed
[1]     [chromium] › packages/lexical-playground/__tests__/e2e/Selection.spec.mjs:1092:3 › Selection › shift+arrowdown into a table, when the table is the only node, selects the whole table

@etrepum etrepum enabled auto-merge January 14, 2025 20:53
@etrepum etrepum disabled auto-merge January 14, 2025 20:54
@etrepum etrepum added this pull request to the merge queue Jan 14, 2025
Merged via the queue into facebook:main with commit 65ce66a Jan 14, 2025
@benjick
Copy link
Copy Markdown

benjick commented Jan 14, 2025

Thank you! 🙏

@etrepum etrepum deleted the firefox-selection branch January 15, 2025 01:17
GermanJablo added a commit to GermanJablo/lexical that referenced this pull request Jan 30, 2025
@GermanJablo
Squashed commit of the following:
a90a719 
commit a62a1a6
Author: James Fitzsimmons <119275535+james-atticus@users.noreply.github.com>
Date:   Thu Jan 30 19:13:35 2025 +1100

    [lexical-mark] Feature: include inline decorator nodes in marks (facebook#7086)

commit 881c7fe
Author: Bob Ippolito <bob@redivi.com>
Date:   Thu Jan 30 00:13:00 2025 -0800

    [lexical-utils] Fix: Modify $reverseDfs to be a right-to-left variant of $dfs (facebook#7112)

commit ce2bb45
Author: Nigel Gutzmann <nigelgutzmann@gmail.com>
Date:   Wed Jan 29 14:41:12 2025 -0800

    [lexical-utils] Feature: add reverse dfs iterator (facebook#7107)

commit 3a140d2
Author: mohammed shaheer kp <72137242+mshaheerz@users.noreply.github.com>
Date:   Tue Jan 28 06:19:45 2025 +0530

    [lexical-playground] Bug Fix: Ensure Delete Node handles all node types (facebook#7096)

    Co-authored-by: shaheerkpzaigo <mohammedshaheer@zaigoinfotech.com>

commit 8e2ede2
Author: Adam Pugh <docadam@meta.com>
Date:   Mon Jan 27 18:49:38 2025 -0600

    Listeners Lexical: 3 updates to spelling and grammar - Update listeners.md  (facebook#7100)

commit 9fcc494
Author: Adam Pugh <docadam@meta.com>
Date:   Mon Jan 27 18:49:34 2025 -0600

    Lexical Docs: 2 updates to spelling README.md (facebook#7102)

commit 946a6df
Author: Adam Pugh <docadam@meta.com>
Date:   Mon Jan 27 18:49:29 2025 -0600

    Selection | Lexical: 1 Spelling Update Update selection.md (facebook#7103)

commit ce93ea6
Author: Adam Pugh <docadam@meta.com>
Date:   Mon Jan 27 18:49:25 2025 -0600

    Creating a React Plugin: 1 Grammar Update - Update create_plugin.md (facebook#7104)

commit ed29d89
Author: Adam Pugh <docadam@meta.com>
Date:   Mon Jan 27 18:49:21 2025 -0600

    Working with DOM Events: 2 Spelling and Grammar Updates Update dom-ev… (facebook#7105)

commit 212b70f
Author: James Fitzsimmons <119275535+james-atticus@users.noreply.github.com>
Date:   Mon Jan 27 08:48:09 2025 +1100

    [lexical-yjs] Bug Fix: handle text node being split by Yjs redo (facebook#7098)

commit 6a98a47
Author: Torleif Berger <torleif@outlook.com>
Date:   Fri Jan 24 21:46:45 2025 +0100

    [lexical-react] Bug Fix: Import `JSX` type from React to prevent "Cannot find namespace 'JSX'"-error when type-checking with React 19 (facebook#7080)

commit f8e5968
Author: Tetsuya <62472294+EruditionTu@users.noreply.github.com>
Date:   Sat Jan 25 04:06:57 2025 +0800

    [lexical] Chore: Rename variable and add comments for Safari compositing workaround (facebook#7092)

commit 81c9ab6
Author: Mateo Vuković <195247756+hellovuki@users.noreply.github.com>
Date:   Fri Jan 24 18:44:05 2025 +0100

    Fix: Use already defined RegisteredNodes type (facebook#7085)

commit 63958a2
Author: Sherry <potatowagon@meta.com>
Date:   Tue Jan 21 18:15:21 2025 +0800

    [playground] Bug fix: prevent growing whitespaces in markdown table toggle (facebook#7041)

    Co-authored-by: Bob Ippolito <bob@redivi.com>

commit d9f9924
Author: Sherry <potatowagon@meta.com>
Date:   Tue Jan 21 14:58:08 2025 +0800

    Unrevert [Breaking Change][lexical] Bug Fix: Commit updates on editor.setRootElement(null) facebook#7023 (facebook#7068)

commit 92fa0a3
Author: mohammed shaheer kp <72137242+mshaheerz@users.noreply.github.com>
Date:   Tue Jan 21 06:23:24 2025 +0530

    [lexical-playground] plugins TableOfContent Scroll smooth behaviour A… (facebook#7069)

commit 2e4a63e
Author: Ivaylo Pavlov <ivailo90@gmail.com>
Date:   Mon Jan 20 02:37:34 2025 +0000

    [lexical-playground] Fix Columns Layout Item Overflow (facebook#7066)

commit d319b07
Author: Bob Ippolito <bob@redivi.com>
Date:   Sun Jan 19 14:45:41 2025 -0800

    Change fork modules to use production only when NODE_ENV explicitly set to production (facebook#7065)

commit 46c9c2f
Author: CityHunter <62472294+EruditionTu@users.noreply.github.com>
Date:   Sat Jan 18 13:00:38 2025 +0800

    [lexical] Bug Fix: In the Safari browser, during the compositing event process, the delete key exhibits unexpected behavior. (facebook#7061)

    Co-authored-by: 涂博闻 <tubowen@moonshot.cn>

commit 92a1cd7
Author: Violet Rosenzweig <rosenzweig.violet@gmail.com>
Date:   Thu Jan 16 18:44:11 2025 -0500

    docs: Change "here" link to more descriptive text (facebook#7058)

commit f6377a3
Author: Aman Harwara <amanharwara@protonmail.com>
Date:   Fri Jan 17 02:08:17 2025 +0530

    [lexical-table] Bug Fix: Prevent error if pasted table has empty row (facebook#7057)

commit 0835029
Author: Aman Harwara <amanharwara@protonmail.com>
Date:   Fri Jan 17 00:18:08 2025 +0530

    [lexical-list] Bug Fix: Prevent error when calling formatList when selection is at root (facebook#6994)

commit 940435d
Author: Brayden <1311325+redstar504@users.noreply.github.com>
Date:   Wed Jan 15 16:10:01 2025 -0800

    fix: iOS Autocorrect strips formatting by reporting wrong dataType (facebook#5789)

    Co-authored-by: Bob Ippolito <bob@redivi.com>

commit 136a565
Author: Aman Harwara <amanharwara@protonmail.com>
Date:   Thu Jan 16 04:48:32 2025 +0530

    [lexical-yjs] Feature: Allow passing in custom `syncCursorPositions` function to collab hook (facebook#7053)

commit 415c576
Author: Maksim Horbachevsky <fantactuka@gmail.com>
Date:   Wed Jan 15 18:18:03 2025 -0500

    fix: triple click around inline elements (links) (facebook#7055)

commit a3ef4f3
Author: Ivaylo Pavlov <ivailo90@gmail.com>
Date:   Wed Jan 15 23:15:39 2025 +0000

    [lexical-table] Support table alignment (facebook#7044)

commit 29d733c
Author: Sherry <potatowagon@meta.com>
Date:   Wed Jan 15 21:50:07 2025 +0800

    Revert [Breaking Change][lexical] Bug Fix: Commit updates on editorSetRootElement(null) (facebook#7023) (facebook#7052)

commit 65ce66a
Author: Bob Ippolito <bob@redivi.com>
Date:   Tue Jan 14 14:57:54 2025 -0800

    [lexical] Bug Fix: Normalize selection after applyDOMRange to account for Firefox differences (facebook#7050)

commit bbc07af
Author: Bob Ippolito <bob@redivi.com>
Date:   Tue Jan 14 08:55:46 2025 -0800

    [*] Bug Fix: Use GITHUB_OUTPUT instead of GITHUB_ENV for size-limit action (facebook#7051)

commit c8f27ed
Author: Bob Ippolito <bob@redivi.com>
Date:   Tue Jan 14 06:36:13 2025 -0800

    [Breaking Change][*] Chore: Use terser for optimizing cjs prod build (facebook#7047)

commit 8bd22d5
Author: Bob Ippolito <bob@redivi.com>
Date:   Mon Jan 13 07:09:31 2025 -0800

    [lexical] Bug Fix: Handle MutationObserver/input event re-ordering when using contentEditable inside of an iframe (facebook#7045)

commit 930629c
Author: Ivaylo Pavlov <ivailo90@gmail.com>
Date:   Sat Jan 11 06:03:30 2025 +0000

    Clean up nested editor update (facebook#7039)

commit bd874a3
Author: Bob Ippolito <bob@redivi.com>
Date:   Fri Jan 10 15:23:54 2025 -0800

    [Breaking Change][lexical][lexical-selection][lexical-list] Bug Fix: Fix infinite loop when splitting invalid ListItemNode (facebook#7037)

commit 541fa43
Author: Bob Ippolito <bob@redivi.com>
Date:   Thu Jan 9 12:42:23 2025 -0800

    v0.23.1 (facebook#7035)

    Co-authored-by: Lexical GitHub Actions Bot <>

commit d7abafd
Author: Bob Ippolito <bob@redivi.com>
Date:   Thu Jan 9 08:33:12 2025 -0800

    [Breaking Change][lexical] Bug Fix: Commit updates on editor.setRootElement(null) (facebook#7023)

commit 6add515
Author: Bob Ippolito <bob@redivi.com>
Date:   Wed Jan 8 17:27:15 2025 -0800

    [lexical] Fix TabNode deserialization regression  (facebook#7031)

commit 33e3677
Author: Maksim Horbachevsky <fantactuka@gmail.com>
Date:   Wed Jan 8 14:59:03 2025 -0500

    [lexical-react] Feature: Merge TabIndentionPlugin and ListMaxIndentLevelPlugin plugins (facebook#7018)

commit 7de86e4
Author: James Fitzsimmons <119275535+james-atticus@users.noreply.github.com>
Date:   Wed Jan 8 09:45:25 2025 +1100

    [lexical-mark] Bug Fix: reverse ternary in MarkNode.addID (facebook#7020)

commit 7961130
Author: Bob Ippolito <bob@redivi.com>
Date:   Sun Jan 5 13:55:25 2025 -0800

    v0.23.0 (facebook#7017)

    Co-authored-by: Lexical GitHub Actions Bot <>

commit 2b4252d
Author: Aman Harwara <amanharwara@protonmail.com>
Date:   Sat Jan 4 11:31:19 2025 +0530

    [lexical-yjs] Feature: Expose function to get anchor and focus nodes for given user awareness state (facebook#6942)

commit 8100d6d
Author: Ivaylo Pavlov <ivailo90@gmail.com>
Date:   Sat Jan 4 01:12:04 2025 +0000

    [lexical-playground] Fix table hover actions button position (facebook#7011)

commit bd1ef2a
Author: Bob Ippolito <bob@redivi.com>
Date:   Fri Jan 3 14:25:31 2025 -0800

    [lexical] Bug Fix: Fix registerNodeTransform regression introduced in facebook#6894 (facebook#7016)

commit 85c08b6
Author: Christian Grøngaard <christian@groengaard.dk>
Date:   Thu Jan 2 00:20:20 2025 +0100

    [lexical-playground] Refactor: switch headings test file names (facebook#7008)

commit 7c21d4f
Author: Bob Ippolito <bob@redivi.com>
Date:   Wed Jan 1 12:48:12 2025 -0800

    [Breaking Change][lexical] Feature: Add updateFromJSON and move more textFormat/textStyle to ElementNode (facebook#6970)

commit aaa9009
Author: Bob Ippolito <bob@redivi.com>
Date:   Wed Jan 1 07:50:39 2025 -0800

    [lexical] Bug Fix: Fix getNodes over-selection (facebook#7006)

commit 803391d
Author: Sherry <potatowagon@meta.com>
Date:   Tue Dec 31 11:26:17 2024 +0800

    [__test__] npm upgrade astro (facebook#7001)

commit 684352b
Author: Christian Grøngaard <christian@groengaard.dk>
Date:   Mon Dec 30 05:12:45 2024 +0100

    Documentation: Fix typo "nest nest"->"nest" in README.md (facebook#7000)

    Co-authored-by: Bob Ippolito <bob@redivi.com>

commit 27b75cc
Author: Sherry <potatowagon@meta.com>
Date:   Fri Dec 27 11:06:29 2024 +0800

    [__tests__] npm upgrade next (facebook#6996)

commit 05ddbcc
Author: Simon <bauchet.simon@gmail.com>
Date:   Thu Dec 26 03:37:50 2024 +0100

    [lexical] Bug Fix: Flow is missing some variables and functions (facebook#6977)

commit e79c946
Author: Sherry <potatowagon@meta.com>
Date:   Tue Dec 24 09:54:46 2024 +0800

    v0.22.0 (facebook#6993)

    Co-authored-by: Lexical GitHub Actions Bot <>

commit c415f7a
Author: Sam Zhou <sam@developersam.com>
Date:   Mon Dec 23 10:31:36 2024 -0800

    [lexical-react] Refactor: Replace `React$MixedElement` and `React$Node` with `React.MixedElement` and `React.Node` (facebook#6984)

commit c844a4d
Author: Sherry <potatowagon@meta.com>
Date:   Tue Dec 24 02:30:52 2024 +0800

    [lexical] Fix flow error: change this to any (facebook#6992)

commit 6190033
Author: Germán Jabloñski <43938777+GermanJablo@users.noreply.github.com>
Date:   Mon Dec 23 05:19:27 2024 -0300

    Refactor: exportJSON (facebook#6983)

commit e0dafb8
Author: Germán Jabloñski <43938777+GermanJablo@users.noreply.github.com>
Date:   Sat Dec 21 13:59:01 2024 -0300

    feature: expose forEachSelectedTextNode (facebook#6981)

    Co-authored-by: Bob Ippolito <bob@redivi.com>

commit 23715f5
Author: Alex <UlopLT@gmail.com>
Date:   Fri Dec 20 18:23:27 2024 +0300

    [lexical][lexical-table] Bug fix: TablePlugin:  - check is current selection in target table node (facebook#6979)

    Co-authored-by: alazarev <alazarev@megaputer.ru>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@zurfyx zurfyx zurfyx approved these changes

@fantactuka fantactuka Awaiting requested review from fantactuka fantactuka is a code owner

@acywatson acywatson Awaiting requested review from acywatson acywatson is a code owner

@Fetz Fetz Awaiting requested review from Fetz

@ivailop7 ivailop7 Awaiting requested review from ivailop7 ivailop7 is a code owner

@Sahejkm Sahejkm Awaiting requested review from Sahejkm

@potatowagon potatowagon Awaiting requested review from potatowagon potatowagon is a code owner

Assignees

No one assigned

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. extended-tests Run extended e2e tests on a PR

Projects

None yet

Milestone

No milestone

4 participants

@etrepum @benjick @zurfyx @facebook-github-bot