From eb7ffcba3c1387404a61046bb9360ae1cd926efc Mon Sep 17 00:00:00 2001 From: Peter Date: Wed, 9 Oct 2024 21:28:04 +0300 Subject: [PATCH] fix(merge): after merge caret will be set in a place of glue (#2841) * fix merge caret loosing * changelog and patch * Update nested-list * Update Backspace.cy.ts * Update Backspace.cy.ts * fix tests * fix tests --- docs/CHANGELOG.md | 1 + package.json | 7 ++++-- src/components/modules/blockEvents.ts | 11 +++++--- test/cypress/fixtures/tools/SimpleHeader.ts | 28 ++------------------- yarn.lock | 27 +++++++++++++++++--- 5 files changed, 38 insertions(+), 36 deletions(-) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index d6015b243..049d5609f 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -4,6 +4,7 @@ - `New` - Inline tools (those with `isReadOnlySupported` specified) can now be used in read-only mode - `Fix` - Fix selection of first block in read-only initialization with "autofocus=true" +- `Fix` - Incorrect caret position after blocks merging in Safari ### 2.30.6 diff --git a/package.json b/package.json index be2cc032a..1a54f4f27 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@editorjs/editorjs", - "version": "2.31.0-rc.0", + "version": "2.31.0-rc.1", "description": "Editor.js — open source block-style WYSIWYG editor with JSON output", "main": "dist/editorjs.umd.js", "module": "dist/editorjs.mjs", @@ -45,7 +45,7 @@ "@cypress/code-coverage": "^3.10.3", "@editorjs/code": "^2.7.0", "@editorjs/delimiter": "^1.2.0", - "@editorjs/header": "^2.8.7", + "@editorjs/header": "^2.8.8", "@editorjs/paragraph": "^2.11.6", "@editorjs/simple-image": "^1.4.1", "@types/node": "^18.15.11", @@ -77,5 +77,8 @@ "collective": { "type": "opencollective", "url": "https://opencollective.com/editorjs" + }, + "dependencies": { + "@editorjs/caret": "^1.0.1" } } diff --git a/src/components/modules/blockEvents.ts b/src/components/modules/blockEvents.ts index 4c4ebf918..c48bba536 100644 --- a/src/components/modules/blockEvents.ts +++ b/src/components/modules/blockEvents.ts @@ -8,6 +8,7 @@ import Flipper from '../flipper'; import type Block from '../block'; import { areBlocksMergeable } from '../utils/blocks'; import * as caretUtils from '../utils/caret'; +import { focus } from '@editorjs/caret'; /** * @@ -506,15 +507,17 @@ export default class BlockEvents extends Module { * @param blockToMerge - what Block we want to merge */ private mergeBlocks(targetBlock: Block, blockToMerge: Block): void { - const { BlockManager, Caret, Toolbar } = this.Editor; + const { BlockManager, Toolbar } = this.Editor; - Caret.createShadow(targetBlock.lastInput); + if (targetBlock.lastInput === undefined) { + return; + } + + focus(targetBlock.lastInput, false); BlockManager .mergeBlocks(targetBlock, blockToMerge) .then(() => { - /** Restore caret position after merge */ - Caret.restoreCaret(targetBlock.pluginsContent as HTMLElement); Toolbar.close(); }); } diff --git a/test/cypress/fixtures/tools/SimpleHeader.ts b/test/cypress/fixtures/tools/SimpleHeader.ts index cd87aa7ec..234213741 100644 --- a/test/cypress/fixtures/tools/SimpleHeader.ts +++ b/test/cypress/fixtures/tools/SimpleHeader.ts @@ -10,7 +10,7 @@ import type { */ export class SimpleHeader implements BaseTool { private _data: BlockToolData; - private element: HTMLHeadingElement; + private element: HTMLHeadingElement | null = null; /** * @@ -39,10 +39,7 @@ export class SimpleHeader implements BaseTool { * @param data - saved data to merger with current block */ public merge(data: BlockToolData): void { - this.data = { - text: this.data.text + data.text, - level: this.data.level, - }; + this.element?.insertAdjacentHTML('beforeend', data.text); } /** @@ -66,25 +63,4 @@ export class SimpleHeader implements BaseTool { import: 'text', // fill 'text' property from other block's export string }; } - - /** - * Data getter - */ - private get data(): BlockToolData { - this._data.text = this.element.innerHTML; - this._data.level = 1; - - return this._data; - } - - /** - * Data setter - */ - private set data(data: BlockToolData) { - this._data = data; - - if (data.text !== undefined) { - this.element.innerHTML = this._data.text || ''; - } - } } diff --git a/yarn.lock b/yarn.lock index 29cccc68c..5294af93d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -550,6 +550,13 @@ debug "^3.1.0" lodash.once "^4.1.1" +"@editorjs/caret@^1.0.1": + version "1.0.1" + resolved "https://registry.yarnpkg.com/@editorjs/caret/-/caret-1.0.1.tgz#0d33ca67a2d29d09fdea10d3d30b660f0abc7cfd" + integrity sha512-yMewrc/dndBbgmluFory0GbVWXnD9rhcE/xgwM0ecHWQodyfY3ZIJLvSQhf+BbgncitMlUG/FYqjJCL2Axi4+g== + dependencies: + "@editorjs/dom" "^1.0.0" + "@editorjs/code@^2.7.0": version "2.8.0" resolved "https://registry.yarnpkg.com/@editorjs/code/-/code-2.8.0.tgz#d31fdd947b9c763daae2cd2eabdf8dc37c0c6f5a" @@ -564,19 +571,31 @@ dependencies: "@codexteam/icons" "^0.0.5" +"@editorjs/dom@^1.0.0": + version "1.0.0" + resolved "https://registry.yarnpkg.com/@editorjs/dom/-/dom-1.0.0.tgz#ddf7f17651a091570766c5fa44c89ecf8a183c82" + integrity sha512-P5qZaQaG8NQXm2XuEDlcfDm8S1Kvdegwf0E/ld2RnwZquY5l27hufaW57w0SikT75mscr+dARQ68Gx/xEQEUKw== + dependencies: + "@editorjs/helpers" "^1.0.0" + "@editorjs/editorjs@^2.29.1": version "2.30.2" resolved "https://registry.yarnpkg.com/@editorjs/editorjs/-/editorjs-2.30.2.tgz#b045af18a9ebe0c02cb32be41b2a98e23ee08e59" integrity sha512-JjtUDs2/aHTEjNZzEf/2cugpIli1+aNeU8mloOd5USbVxv2vC02HTMpv7Vc1UyB7dIuc45JaYSJwgnBZp9duhA== -"@editorjs/header@^2.8.7": - version "2.8.7" - resolved "https://registry.yarnpkg.com/@editorjs/header/-/header-2.8.7.tgz#6aa34e01638d18fbbc6d3bd75f1844869eca9193" - integrity sha512-rfxzYFR/Jhaocj3Xxx8XjEjyzfPbBIVkcPZ9Uy3rEz1n3ewhV0V4zwuxCjVfFhLUVgQQExq43BxJnTNlLOzqDQ== +"@editorjs/header@^2.8.8": + version "2.8.8" + resolved "https://registry.yarnpkg.com/@editorjs/header/-/header-2.8.8.tgz#43cff7949c44866da7716fdb562d68116d0a806a" + integrity sha512-bsMSs34u2hoi0UBuRoc5EGWXIFzJiwYgkFUYQGVm63y5FU+s8zPBmVx5Ip2sw1xgs0fqfDROqmteMvvmbCy62w== dependencies: "@codexteam/icons" "^0.0.5" "@editorjs/editorjs" "^2.29.1" +"@editorjs/helpers@^1.0.0": + version "1.0.0" + resolved "https://registry.yarnpkg.com/@editorjs/helpers/-/helpers-1.0.0.tgz#4b0e0868e51e2772a73212f4aac5aff553725894" + integrity sha512-ih4yCm+x+7X9XCn1zxfNous2LQX8ZYMyTHMLdgbyjBf0Opf8GdLxVjdzSjkA+0mUp1tUe3JgWW3FTisYcSnbQA== + "@editorjs/paragraph@^2.11.6": version "2.11.6" resolved "https://registry.yarnpkg.com/@editorjs/paragraph/-/paragraph-2.11.6.tgz#011444187a74dc603201dce37d2fc6d054022407"