From d20f8307de4a3007db5908fc647db4f3e5d9db6d Mon Sep 17 00:00:00 2001 From: VolgaIgor <43250768+VolgaIgor@users.noreply.github.com> Date: Fri, 9 Jan 2026 14:21:25 +0300 Subject: [PATCH] Instead of a new class for NestedEditor an existing was used --- .../fixtures/tools/NestedEditorTool.ts | 123 ------------------ test/cypress/tests/modules/Ui.cy.ts | 77 ++++------- 2 files changed, 28 insertions(+), 172 deletions(-) delete mode 100644 test/cypress/fixtures/tools/NestedEditorTool.ts diff --git a/test/cypress/fixtures/tools/NestedEditorTool.ts b/test/cypress/fixtures/tools/NestedEditorTool.ts deleted file mode 100644 index 4ec7ee00..00000000 --- a/test/cypress/fixtures/tools/NestedEditorTool.ts +++ /dev/null @@ -1,123 +0,0 @@ -import type { - API, - EditorConfig, - BaseTool, - BlockAPI, - BlockToolConstructorOptions, - OutputData -} from '../../../../types'; -import EditorJS from '../../../../types'; - -export interface NestedEditorToolConfig { - editorLibrary: typeof EditorJS, - editorTools?: EditorConfig["tools"], - editorTunes?: EditorConfig["tunes"], -} - -export interface NestedEditorToolData { - nestedEditor: OutputData, -} - -/** - * Simplified Header for testing - */ -export class NestedEditorTool implements BaseTool { - private api: API; - private readOnly: boolean; - private block: BlockAPI; - - private config: NestedEditorToolConfig; - private _data: NestedEditorToolData; - - private nestedEditor?: EditorJS; - - /** - * This flag tells core that current tool supports the read-only mode - * @link https://editorjs.io/tools-api#isreadonlysupported - */ - static get isReadOnlySupported(): boolean { - return true; - } - - /** - * With this option, Editor.js won't handle Enter keydowns - * @link https://editorjs.io/tools-api#enablelinebreaks - */ - static get enableLineBreaks(): boolean { - return true; - } - - /** - * - * @param options - constructor options - */ - constructor({ data, api, config, readOnly, block }: BlockToolConstructorOptions) { - this.api = api; - this._data = data; - this.config = { - editorLibrary: config.editorLibrary, - editorTools: config.editorTools || {}, - editorTunes: config.editorTunes || [], - }; - this.readOnly = readOnly; - this.block = block; - } - - /** - * Return Tool's view - */ - public render(): HTMLElement { - const rootNode = document.createElement('div'); - rootNode.classList.add(this.api.styles.block); - - const editorNode = document.createElement('div'); - editorNode.style.border = '1px solid' - editorNode.style.padding = '12px 20px' - rootNode.appendChild(editorNode); - - this.nestedEditor = new this.config.editorLibrary({ - holder: editorNode, - data: this.data.nestedEditor, - tools: this.config.editorTools, - tunes: this.config.editorTunes, - minHeight: 150, - readOnly: this.readOnly, - onChange: () => { - this.block.dispatchChange() - } - }); - - return rootNode; - } - - /** - * Return Tool data - */ - get data(): NestedEditorToolData { - return this._data; - } - - /** - * Stores all Tool's data - */ - set data(data: NestedEditorToolData) { - this._data.nestedEditor = data.nestedEditor || {}; - if (this.nestedEditor) { - this.nestedEditor.blocks.render(this.data.nestedEditor); - } - } - - /** - * Extracts Block data from the UI - */ - public async save(): Promise { - let savedData: OutputData = { blocks: [] } - if (this.nestedEditor) { - savedData = await this.nestedEditor.save(); - } - - return { - nestedEditor: savedData - }; - } -} diff --git a/test/cypress/tests/modules/Ui.cy.ts b/test/cypress/tests/modules/Ui.cy.ts index afa63426..c2326897 100644 --- a/test/cypress/tests/modules/Ui.cy.ts +++ b/test/cypress/tests/modules/Ui.cy.ts @@ -1,6 +1,6 @@ import { createEditorWithTextBlocks } from '../../support/utils/createEditorWithTextBlocks'; import type EditorJS from '../../../../types/index'; -import { NestedEditorTool } from '../../fixtures/tools/NestedEditorTool'; +import NestedEditor, { NESTED_EDITOR_ID } from '../../support/utils/nestedEditorInstance'; describe('Ui module', function () { describe('documentKeydown', function () { @@ -142,58 +142,37 @@ describe('Ui module', function () { }); it('click on block of nested editor should also set the block of parent editor as current', function () { - cy.window() - .then((window) => { - const editorJsClass = window.EditorJS; - - cy.createEditor({ - tools: { - nestedEditor: { - class: NestedEditorTool, - config: { - editorLibrary: editorJsClass - } + cy.createEditor({ + tools: { + nestedEditor: { + class: NestedEditor, + }, + }, + data: { + blocks: [ + { + type: 'paragraph', + data: { + text: 'First block of parent editor', }, }, - data: { - blocks: [ - { - id: 'block1', - type: 'paragraph', - data: { - text: 'First block of parent editor', - }, - }, - { - id: 'block2', - type: 'paragraph', - data: { - text: 'Second block of parent editor', - }, - }, - { - id: 'block3', - type: 'nestedEditor', - data: { - nestedEditor: { - blocks: [ - { - id: 'nestedBlock1', - type: 'paragraph', - data: { - text: 'First block of nested editor', - }, - } - ] - } - } - } - ], + { + type: 'paragraph', + data: { + text: 'Second block of parent editor', + }, }, - }).as('editorInstance'); - }); + { + type: 'nestedEditor', + data: { + text: 'First block of nested editor', + }, + }, + ], + }, + }).as('editorInstance'); - cy.get('[data-id=nestedBlock1]') + cy.get(`[data-cy=${NESTED_EDITOR_ID}]`) .find('.ce-paragraph') .click();