Merge branch 'main' into bugfix/collapsed_selection_on_link_insertion

.eslintignore

@@ -14,3 +14,4 @@
 .ts-temp
 **/.docusaurus
 /playwright-report
+test-results

.flowconfig

@@ -52,6 +52,7 @@ module.name_mapper='^@lexical/react/LexicalComposerContext$' -> '<PROJECT_ROOT>/
 module.name_mapper='^@lexical/react/LexicalContentEditable$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalContentEditable.js.flow'
 module.name_mapper='^@lexical/react/LexicalContextMenuPlugin$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalContextMenuPlugin.js.flow'
 module.name_mapper='^@lexical/react/LexicalDecoratorBlockNode$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalDecoratorBlockNode.js.flow'
+module.name_mapper='^@lexical/react/LexicalDraggableBlockPlugin$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalDraggableBlockPlugin.js.flow'
 module.name_mapper='^@lexical/react/LexicalEditorRefPlugin$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalEditorRefPlugin.js.flow'
 module.name_mapper='^@lexical/react/LexicalErrorBoundary$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalErrorBoundary.js.flow'
 module.name_mapper='^@lexical/react/LexicalHashtagPlugin$' -> '<PROJECT_ROOT>/packages/lexical-react/flow/LexicalHashtagPlugin.js.flow'

.github/workflows/after-approval.yml

@@ -17,7 +17,7 @@ jobs:
           concurrent_skipping: 'same_content_newer'
           skip_after_successful_duplicate: 'true'
           do_not_skip: '["pull_request", "merge_group"]'
-          paths_ignore: '["packages/lexical-website/**", "packages/*/README.md", ".size-limit.js"]'
+          paths_ignore: '["packages/lexical-website/**", "packages/*/README.md", ".size-limit.js", "examples/**"]'
   e2e-tests:
     needs: pre_job
     if: needs.pre_job.outputs.should_skip != 'true' && (github.event.review.state == 'approved' && !contains(github.event.pull_request.labels.*.name, 'extended-tests'))

.github/workflows/call-e2e-all-tests.yml

@@ -4,12 +4,27 @@ on:
   workflow_call:
 
 jobs:
-  mac:
+  mac-rich:
     strategy:
       matrix:
         node-version: [18.18.0]
-        browser: ['chromium', 'firefox', 'webkit']
-        editor-mode: ['rich-text', 'plain-text']
+        browser: ['webkit', 'chromium', 'firefox']
+        editor-mode: ['rich-text']
+        events-mode: ['modern-events']
+    uses: ./.github/workflows/call-e2e-test.yml
+    with:
+      os: 'macos-latest'
+      node-version: ${{ matrix.node-version }}
+      browser: ${{ matrix.browser }}
+      editor-mode: ${{ matrix.editor-mode }}
+      events-mode: ${{ matrix.events-mode }}
+
+  mac-plain:
+    strategy:
+      matrix:
+        node-version: [18.18.0]
+        browser: ['webkit']
+        editor-mode: ['plain-text']
         events-mode: ['modern-events']
     uses: ./.github/workflows/call-e2e-test.yml
     with:
@@ -56,7 +71,7 @@ jobs:
     strategy:
       matrix:
         node-version: [18.18.0]
-        browser: ['chromium', 'firefox', 'webkit']
+        browser: ['webkit']
     uses: ./.github/workflows/call-e2e-test.yml
     with:
       os: 'macos-latest'
@@ -94,7 +109,7 @@ jobs:
   prod:
     strategy:
       matrix:
-        os: ['macos-latest']
+        os: ['ubuntu-latest']
         node-version: [18.18.0]
         browser: ['chromium']
         editor-mode: ['rich-text']
@@ -111,7 +126,7 @@ jobs:
   collab-prod:
     strategy:
       matrix:
-        os: ['macos-latest']
+        os: ['ubuntu-latest']
         node-version: [18.18.0]
         browser: ['chromium']
         editor-mode: ['rich-text-with-collab']
@@ -134,10 +149,26 @@ jobs:
         prod: [false]
     uses: ./.github/workflows/call-e2e-test.yml
     with:
-      os: 'macos-latest'
+      os: 'ubuntu-latest'
       browser: 'chromium'
       node-version: 18.18.0
       events-mode: 'modern-events'
       editor-mode: ${{ matrix.editor-mode }}
       prod: ${{ matrix.prod }}
       override-react-version: beta
+
+  flaky:
+    strategy:
+      matrix:
+        node-version: [18.18.0]
+        browser: ['chromium', 'firefox']
+        editor-mode: ['rich-text', 'plain-text', 'rich-text-with-collab']
+        events-mode: ['modern-events']
+    uses: ./.github/workflows/call-e2e-test.yml
+    with:
+      os: 'ubuntu-latest'
+      flaky: true
+      node-version: ${{ matrix.node-version }}
+      browser: ${{ matrix.browser }}
+      editor-mode: ${{ matrix.editor-mode }}
+      events-mode: ${{ matrix.events-mode }}

.github/workflows/call-e2e-canary-tests.yml

@@ -7,7 +7,7 @@ jobs:
   canary:
     strategy:
       matrix:
-        os: ['macos-latest']
+        os: ['ubuntu-latest']
         node-version: [18.18.0]
         browser: ['chromium']
         editor-mode: ['rich-text']

.github/workflows/call-e2e-test.yml

@@ -3,26 +3,29 @@ name: Lexical e2e test runner
 on:
   workflow_call:
     inputs:
+      # Make sure that all of these are present in the name of the actions/upload-artifact@v4 action below
       os: {required: true, type: string}
       node-version: {required: true, type: string}
       browser: {required: true, type: string}
       editor-mode: {required: true, type: string}
       events-mode: {required: true, type: string}
       prod: {required: false, type: boolean}
+      flaky: {required: false, type: boolean} # Defaults to false: dont run flaky
       override-react-version: {required: false, type: string}
 
 jobs:
   e2e-test:
     runs-on: ${{ inputs.os }}
+    continue-on-error: ${{ inputs.flaky }}
     if: (inputs.browser != 'webkit' || inputs.os == 'macos-latest') && (inputs.editor-mode != 'rich-text-with-collab' || inputs.events-mode != 'legacy-events')
     env:
       CI: true
       E2E_EDITOR_MODE: ${{ inputs.editor-mode }}
       E2E_EVENTS_MODE: ${{ inputs.events-mode }}
       OVERRIDE_REACT_VERSION: ${{ inputs.override-react-version }}
       cache_playwright_path: ${{ inputs.os == 'macos-latest' && '~/Library/Caches/ms-playwright' || inputs.os == 'windows-latest' && 'C:\Users\runneradmin\AppData\Local\ms-playwright' || '~/.cache/ms-playwright' }}
-      test_results_path: ${{ inputs.os == 'windows-latest' && '~/.npm/_logs/' || 'test-results/' }}
-      test_script: test-e2e-${{ inputs.editor-mode == 'rich-text-with-collab' && 'collab-' || '' }}${{ inputs.prod && 'prod-' || '' }}ci-${{ inputs.browser }}
+      test_results_path: 'test-results/'
+      test_script: test-e2e-${{ inputs.editor-mode == 'rich-text-with-collab' && 'collab-' || '' }}${{ inputs.prod && 'prod-' || '' }}ci-${{ inputs.browser }} ${{ inputs.flaky && '-- -- --grep "@flaky"' || '-- -- --grep-invert "@flaky"' }}
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js ${{ inputs.node-version }}
@@ -63,6 +66,6 @@ jobs:
         if: failure()
         uses: actions/upload-artifact@v4
         with:
-          name: Test Results ${{ inputs.os }}-${{ inputs.browser }}-${{ inputs.editor-mode }}-${{ inputs.events-mode }}-${{ inputs.prod && 'prod' || 'dev' }}-${{ inputs.node-version }}-${{ inputs.override-react-version }}
+          name: Test Results ${{ inputs.os }}-${{ inputs.browser }}-${{ inputs.editor-mode }}-${{ inputs.events-mode }}-${{ inputs.prod && 'prod' || 'dev' }}-${{ inputs.node-version }}-${{ inputs.override-react-version }}-${{ inputs.flaky && 'flaky' || ''}}
           path: ${{ env.test_results_path }}
           retention-days: 7

.github/workflows/call-integration-tests.yml

@@ -8,7 +8,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [18.18.0]
+        node-version: [20.15.1]
     env:
       CI: true
     steps:

.github/workflows/tests-extended.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     types: [labeled, synchronize, reopened]
     paths-ignore:
+      - 'examples/**'
       - 'packages/lexical-website/**'
       - 'packages/*/README.md'
       - '.size-limit.js'

.github/workflows/tests.yml

@@ -5,10 +5,12 @@ on:
     branches:
       - main
     paths-ignore:
+      - 'examples/**'
       - 'packages/lexical-website/**'
   pull_request:
     types: [opened, synchronize, reopened]
     paths-ignore:
+      - 'examples/**'
       - 'packages/lexical-website/**'
 
 concurrency:

.prettierignore

@@ -23,3 +23,4 @@ flow-typed
 .prettierignore
 **/.docusaurus
 /playwright-report
+test-results

.prettierrc.js

@@ -7,6 +7,10 @@ module.exports = {
   printWidth: 80,
   trailingComma: 'all',
   htmlWhitespaceSensitivity: 'ignore',
-  attributeGroups: ['$DEFAULT', '^data-'],
-  plugins: ['prettier-plugin-tailwindcss'],
+  attributeGroups: ['^class$', '^(id|name)$', '$DEFAULT', '^aria-', '^data-'],
+  attributeSort: 'ASC',
+  plugins: [
+    'prettier-plugin-tailwindcss',
+    'prettier-plugin-organize-attributes',
+  ],
 };

CHANGELOG.md

@@ -1,3 +1,102 @@
+## v0.17.1 (2024-08-26)
+
+- lexical-playground Bug Fix fix comment timestamps (#6555) Ira Hopkinson
+- lexical Add tests for HTMLConfig (#5507) wnhlee
+- lexical-table Bug Fix Append a ParagraphNode to each cell when unmerging (#6556) Minseo Kang
+- lexical-table Fix table selection paste as plain text (#6548) Ivaylo Pavlov
+- lexical-tablelexical-clipboard Bug Fix Race condition in table CUTCOMMAND (#6550) Bob Ippolito
+- lexical-playground Bug Fix Fix firefox e2e test regression in Selection.spec.mjs (#6546) Bob Ippolito
+- Bug Fix Fix issue where triple-clicking a cell would dangerously select entire document (#6542) Mo
+- lexical-playground Fix in playground show component-menu when scroll (#6510) keiseiTi
+- lexical-react Fix multiple node selection deletion (#6538) Ivaylo Pavlov
+- lexical-yjs Bug Fix Properly sync when emptying document via undo (#6523) Mo
+- lexical-table Stop selecting the whole table after pasting cells (#6539) Ivaylo Pavlov
+- lexical-table Fix a number of table Cut command scenarios (#6528) Ivaylo Pavlov
+- Chore change className props in TreeView component to optional (#6531) Mingxuan Wang
+- lexical-list Bug Fix handle non-integer numbers in setIndent (#6522) jrfitzsimmons
+-  Chore Mark additional tests as flaky from #6535 test runs (#6536) Bob Ippolito
+- lexical-table Bug Fix Selection in tables with merged cells (#6529) Botho
+- Revert Fix OverflowNode configuration (#6535) Bob Ippolito
+- lexical-react Fix Fix React.startTransition on Webpack  React 17 (#6517) Turner
+- Fix OverflowNode configuration (#6027) Gerard Rovira
+- lexical-react remove editorDEPRECATED that has been deprecated for two years (#6494) Bob Ippolito
+- lexical Refactor RFC LexicalNode.afterCloneFrom to simplify clone implementation (#6505) Bob Ippolito
+- lexicalselection Feature yield target to style patch fn (#6472) Divyansh Kumar
+- lexical surface more error details in reconciler (#6511) Sherry
+- lexical Bug Fix Fix decorator selection regression with short-circuiting (#6508) Bob Ippolito
+- Fix splitText when detached (#6501) Gerard Rovira
+- Flow add more HTMLDivElementDOMProps (#6500) Gerard Rovira
+- lexical-playground Bug Fix Update tooltip for redo button with correct macOS shortcut (#6497) Bob Ippolito
+- lexical Feature Add version identifier to LexicalEditor constructor (#6488) Bob Ippolito
+- docs prevent automatic p tag wrapping (#6491) Devy
+- Revert lexicalplayground fix block cursor show horizontal (#6490) Bob Ippolito
+- When creating a new check list, set the checked value of the list item to false instead of undefined (#5978) Aman Harwara
+- lexicalplayground fix block cursor show horizontal (#6486) keiseiTi
+- lexical Bug Fix Merge pasted paragraph into empty quote (#6367) wnhlee
+- lexical-table Bug Fix Enable observer updates on table elements attributes change (#6479) Evgeny Vorobyev
+- v0.17.0 (#6487) Sherry
+- v0.17.0 Lexical GitHub Actions Bot
+
+## v0.17.0 (2024-07-31)
+
+- LexicaCI run extended tests for safari in mac-os and chromefirefox in linuxwindows (#6466) Sahejkm
+- lexical-table Bug Fix cannot delete content when a table inside selection (#6412) placeba
+- LexicalCI Update canary e2e test os (#6465) Sahejkm
+- CI tag flaky tests (#6462) Sherry
+- lexical Bug Fix Allow getTopLevelElement to return a DecoratorNode (#6458) Bob Ippolito
+- CI dont cancel other test runs if e2e flaky job fails (#6460) Sherry
+- Flow add tags type to OnChange plugin (#6457) Gerard Rovira
+- lexical-rich-text Bug Fix HeadingNode.insertNewAfter (#6435) Germn Jabloski
+- lexical-react sync format in flow file (#6448) Sherry
+- lexical Bug Fix getCachedTypeToNodeMap should handle a empty and writable EditorState (#6444) Bob Ippolito
+- lexical lexical-selection Preserve paragraph styles between lines (#6437) Ivaylo Pavlov
+- LexicalGallery Add tableplugin example to gallery (#6447) Sahejkm
+- LexicalCI ignore running unitintegeritye2e tests on examples folder code (#6446) Sahejkm
+- LexicalGallery Create Simple Tableplugin example (#6445) Sahejkm
+- lexicalauto-link Fix auto link crash editor (#6433) Maksym Plavinskyi
+- lexicallexical-selection Bug Fix Respect mode when patching text style (#6428) Adrian Busse
+- lexical-historylexical-selectionlexical-react Fix #6409 TextNode change detection (#6420) Bob Ippolito
+- lexical-playground Refactor run prettier to fix CI (#6436) Germn Jabloski
+- fix(LexicalNode) fix inline decorator isSelected (#5948) Xuan
+- lexical-playgroundTableCellResizer Bug Fix Register event handlers on root element (#6416) JBWereRuss
+- lexical-react update flow typing for draggable block plugin (#6426) Sherry
+- docs fix typo in editor.registerCommand() usage (#6429) Yangshun Tay
+- fix(docs) correct typo in Lexical collaboration guide (#6421) Francois Polo
+- Fix discrete nested updates (#6419) Gerard Rovira
+- CI fix build failure on astro integration tests (#6414) wnhlee
+- CI run flaky tests on firefox browsers (#6411) Sherry
+- CI tag flaky tests (#6405) Sherry
+- lexical-reactlexical-playground sync draggable block plugin to www (#6397) Sherry
+- Fix transpile nodesOfType (#6408) Gerard Rovira
+- Restore registerRootListener null call (#6403) Gerard Rovira
+- Add ref to contenteditable (#6381) Gerard Rovira
+- lexical Feature registerMutationListener should initialize its existing nodes (#6357) Bob Ippolito
+- lexical Feature Implement Editor.read and EditorState.read with editor argument (#6347) Bob Ippolito
+- lexical Bug Fix more accurate line break pasting (#6395) Sherry
+- lexical-html Feature support pasting empty block nodes (#6392) Sherry
+- lexical-playgroundlexical-table Bug Fix Fix Shift Down Arrow regression for table sequence. (#6393) Serey Roth
+- Gallery Add option to filter plugins based on tags  (#6391) Sahejkm
+- Fix clear rootElement on React (#6389) Gerard Rovira
+- CI tag flaky tests (#6388) Sherry
+- Prettier sort test attributes (#6384) Gerard Rovira
+- Fix integrity test (#6385) Gerard Rovira
+- LexicalGallery Convert files to follow typescript (#6383) Sahejkm
+- lexicallexical-playground Bug Fix Create line break on paste of content type texthtml (#6376) Janna Wieneke
+- examples Chore Use named export of LexicalErrorBoundary in the examples (#6378) Bob Ippolito
+- LexicalGallery Add option to search examples in the gallery (#6379) Sahejkm
+- lexical-playground Fix Table Hover Actions Noclick Bug (#6375) Ivaylo Pavlov
+- Lexical Fix flow errors on syncing build to meta intern (#6373) Sahejkm
+- rexical-react Bug Fix Headings inside collapsible sections are lost when Table of Contents is re-initialized (#6371) Katsia
+- LexicalGallery Add description in the card, option to render preview card at run time if no image (#6372) Sahejkm
+- Lexical Create initial Gallery View with Emoji Plugin Example (#6369) Sahejkm
+- CI run e2e flaky tests in a separate job (#6365) Sherry
+- Make placeholder accessible (#6171) Gerard Rovira
+- lexical-playground Table Hover Action Buttons (#6355) Ivaylo Pavlov
+- lexicallexical-table Chore Replace references to old GridSelection with TableSelection (#6366) Bob Ippolito
+- lexical-markdown Feature Change Dont trim whitespaces on convertFromMarkdownString (#6360) Sherry
+- v0.16.1 (#6363) Ivaylo Pavlov
+- v0.16.1 Lexical GitHub Actions Bot
+
 ## v0.16.1 (2024-07-01)
 
 - lexical-playgroundlexical-poll Bug Fix Fixes undefined context inside Poll add option (#6361) Roman Lyubimov

README.md

@@ -153,11 +153,11 @@ Editor States are also fully serializable to JSON and can easily be serialized b
 ### Reading and Updating Editor State
 
 When you want to read and/or update the Lexical node tree, you must do it via `editor.update(() => {...})`. You may also do
-read-only operations with the editor state via `editor.getEditorState().read(() => {...})`. The closure passed to the update or read
-call is important, and must be synchronous. It's the only place where you have full "lexical" context of the active editor state,
-and providing you with access to the Editor State's node tree. We promote using the convention of using `$` prefixed functions
-(such as `$getRoot()`) to convey that these functions must be called in this context. Attempting to use them outside of a read
-or update will trigger a runtime error.
+read-only operations with the editor state via `editor.read(() => {...})` or `editor.getEditorState().read(() => {...})`.
+The closure passed to the update or read call is important, and must be synchronous. It's the only place where you have full
+"lexical" context of the active editor state, and providing you with access to the Editor State's node tree. We promote using
+the convention of using `$` prefixed functions (such as `$getRoot()`) to convey that these functions must be called in this
+context. Attempting to use them outside of a read or update will trigger a runtime error.
 
 For those familiar with React Hooks, you can think of these $functions as having similar functionality:
 | *Feature* | React Hooks | Lexical $functions |
@@ -170,8 +170,10 @@ For those familiar with React Hooks, you can think of these $functions as having
 
 Node Transforms and Command Listeners are called with an implicit `editor.update(() => {...})` context.
 
-It is permitted to do nested updates within reads and updates, but an update may not be nested in a read.
-For example, `editor.update(() => editor.update(() => {...}))` is allowed.
+It is permitted to do nested updates, or nested reads, but an update should not be nested in a read
+or vice versa. For example, `editor.update(() => editor.update(() => {...}))` is allowed. It is permitted
+to nest nest an `editor.read` at the end of an `editor.update`, but this will immediately flush the update
+and any additional update in that callback will throw an error.
 
 All Lexical Nodes are dependent on the associated Editor State. With few exceptions, you should only call methods
 and access properties of a Lexical Node while in a read or update call (just like `$` functions). Methods
@@ -186,6 +188,16 @@ first call `node.getWritable()`, which will create a writable clone of a frozen
 mean that any existing references (such as local variables) would refer to a stale version of the node, but
 having Lexical Nodes always refer to the editor state allows for a simpler and less error-prone data model.
 
+:::tip
+
+If you use `editor.read(() => { /* callback */ })` it will first flush any pending updates, so you will
+always see a consistent state. When you are in an `editor.update`, you will always be working with the
+pending state, where node transforms and DOM reconciliation may not have run yet.
+`editor.getEditorState().read()` will use the latest reconciled `EditorState` (after any node transforms,
+DOM reconciliation, etc. have already run), any pending `editor.update` mutations will not yet be visible.
+
+:::
+
 ### DOM Reconciler
 
 Lexical has its own DOM reconciler that takes a set of Editor States (always the "current" and the "pending") and applies a "diff"

examples/react-plain-text/index.html

@@ -7,6 +7,6 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
+    <script src="/src/main.tsx" type="module"></script>
   </body>
 </html>

examples/react-plain-text/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@lexical/react-plain-text-example",
   "private": true,
-  "version": "0.16.1",
+  "version": "0.17.1",
   "type": "module",
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
     "preview": "vite preview"
   },
   "dependencies": {
-    "@lexical/react": "0.16.1",
-    "lexical": "0.16.1",
+    "@lexical/react": "0.17.1",
+    "lexical": "0.17.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },