diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 5e7bffe1f..33aa0a099 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -10,6 +10,7 @@ - `Fix` - Several toolbox items exported by the one tool have the same shortcut displayed in toolbox - `Improvement` - The current block reference will be updated in read-only mode when blocks are clicked - `Fix` - codex-notifier and codex-tooltip moved from devDependencies to dependencies in package.json to solve type errors +- `Fix` - Handle whitespace input in empty placeholder elements to prevent caret from moving unexpectedly to the end of the placeholder ### 2.30.7 diff --git a/src/components/dom.ts b/src/components/dom.ts index 83e875413..241041315 100644 --- a/src/components/dom.ts +++ b/src/components/dom.ts @@ -373,7 +373,7 @@ export default class Dom { nodeText = nodeText.replace(new RegExp(ignoreChars, 'g'), ''); } - return nodeText.trim().length === 0; + return nodeText.length === 0; } /** diff --git a/test/cypress/tests/modules/BlockEvents/Backspace.cy.ts b/test/cypress/tests/modules/BlockEvents/Backspace.cy.ts index ad39440e1..bb36e6503 100644 --- a/test/cypress/tests/modules/BlockEvents/Backspace.cy.ts +++ b/test/cypress/tests/modules/BlockEvents/Backspace.cy.ts @@ -118,6 +118,28 @@ describe('Backspace keydown', function () { .last() .should('have.text', '12'); }); + + it('   | — should delete visible and invisble whitespaces in the abscence of any non whitespace characters', function () { + createEditorWithTextBlocks([ + '1', + '   ', + ]); + + cy.get('[data-cy=editorjs]') + .find('.ce-paragraph') + .last() + .click() + .type('{downArrow}') + .type('{backspace}') + .type('{backspace}') + .type('{backspace}') + .type('{backspace}'); + + cy.get('[data-cy=editorjs]') + .find('div.ce-block') + .last() + .should('have.text', '1'); + }); }); it('should just delete chars (native behaviour) when some fragment is selected', function () { @@ -184,7 +206,7 @@ describe('Backspace keydown', function () { * Saving logic is not necessary for this test */ // eslint-disable-next-line @typescript-eslint/no-empty-function - public save(): void {} + public save(): void { } } cy.createEditor({ @@ -545,7 +567,7 @@ describe('Backspace keydown', function () { * Saving logic is not necessary for this test */ // eslint-disable-next-line @typescript-eslint/no-empty-function - public save(): void {} + public save(): void { } } cy.createEditor({ @@ -678,7 +700,7 @@ describe('Backspace keydown', function () { describe('at the start of the first Block', function () { it('should do nothing if Block is not empty', function () { - createEditorWithTextBlocks([ 'The only block. Not empty' ]); + createEditorWithTextBlocks(['The only block. Not empty']); cy.get('[data-cy=editorjs]') .find('.ce-paragraph') diff --git a/test/cypress/tests/ui/Placeholders.cy.ts b/test/cypress/tests/ui/Placeholders.cy.ts index 79f19e699..d4a7ce968 100644 --- a/test/cypress/tests/ui/Placeholders.cy.ts +++ b/test/cypress/tests/ui/Placeholders.cy.ts @@ -77,4 +77,21 @@ describe('Placeholders', function () { .getPseudoElementContent('::before') .should('eq', 'none'); }); + + it('should be hidden when user adds trailing whitespace characters', function () { + cy.createEditor({ + placeholder: PLACEHOLDER_TEXT, + }); + + cy.get('[data-cy=editorjs]') + .find('.ce-paragraph') + .as('firstBlock') + .getPseudoElementContent('::before') + .should('eq', PLACEHOLDER_TEXT); + + cy.get('@firstBlock') + .type(' ') + .getPseudoElementContent('::before') + .should('eq', 'none'); + }); });