diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index fcb6078e9..73a8fc024 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -11,6 +11,7 @@ - `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 +- `Fix` - Fix when / overides selected text outside of the editor - `DX` - Tools submodules removed from the repository ### 2.30.7 diff --git a/src/components/modules/blockEvents.ts b/src/components/modules/blockEvents.ts index c48bba536..40e0973e2 100644 --- a/src/components/modules/blockEvents.ts +++ b/src/components/modules/blockEvents.ts @@ -237,6 +237,12 @@ export default class BlockEvents extends Module { * @param event - keydown */ private slashPressed(event: KeyboardEvent): void { + const wasEventTriggeredInsideEditor = this.Editor.UI.nodes.wrapper.contains(event.target as Node); + + if (!wasEventTriggeredInsideEditor) { + return; + } + const currentBlock = this.Editor.BlockManager.currentBlock; const canOpenToolbox = currentBlock.isEmpty; diff --git a/test/cypress/tests/modules/BlockEvents/Slash.cy.ts b/test/cypress/tests/modules/BlockEvents/Slash.cy.ts index 0d9db5fc1..49fe1fddb 100644 --- a/test/cypress/tests/modules/BlockEvents/Slash.cy.ts +++ b/test/cypress/tests/modules/BlockEvents/Slash.cy.ts @@ -92,6 +92,60 @@ describe('Slash keydown', function () { .should('eq', 'Hello/'); }); }); + + describe('pressed outside editor', function () { + it('should not modify any text outside editor when text block is selected', () => { + cy.createEditor({ + data: { + blocks: [ + { + type: 'paragraph', + data: { + text: '', + }, + }, + ], + }, + }); + + cy.document().then((doc) => { + const title = doc.querySelector('h1'); + + if (title) { + title.setAttribute('data-cy', 'page-title'); + } + }); + + // Step 1 + // Click on the plus button and select the text option + cy.get('[data-cy=editorjs]') + .find('.ce-paragraph') + .click(); + cy.get('[data-cy=editorjs]') + .find('.ce-toolbar__plus') + .click({ force: true }); + cy.get('[data-cy="toolbox"] .ce-popover__container') + .contains('Text') + .click(); + + // Step 2 + // Select the 'Editor.js test page' text + cy.get('[data-cy=page-title]') + .invoke('attr', 'contenteditable', 'true') + .click() + .type('{selectall}') + .invoke('removeAttr', 'contenteditable'); + + // Step 3 + // Press the Slash key + cy.get('[data-cy=page-title]') + .trigger('keydown', { key: '/', + code: 'Slash', + which: 191 }); + + cy.get('[data-cy=page-title]').should('have.text', 'Editor.js test page'); + }); + }); }); describe('CMD+Slash keydown', function () {