From 0a8942050bd0b39afb5bbc55ca7842461a5b98eb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E7=A6=8F=E6=9C=8B?= Date: Thu, 6 Jan 2022 12:44:54 +0800 Subject: [PATCH] fix: insertKeys --- .vscode/settings.json | 1 + packages/core/src/menus/bar/Toolbar.ts | 6 +- packages/editor/examples/index.html | 1 + packages/editor/examples/new-menu.html | 91 +++++++++++++++++++ .../editor/config/toolbar-config.test.ts | 30 +++--- 5 files changed, 113 insertions(+), 16 deletions(-) create mode 100644 packages/editor/examples/new-menu.html diff --git a/.vscode/settings.json b/.vscode/settings.json index 547e3fb40..5016e74a1 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -5,6 +5,7 @@ "bodyparser", "browserslist", "chmod", + "clonedeep", "compositionend", "compositionstart", "config", diff --git a/packages/core/src/menus/bar/Toolbar.ts b/packages/core/src/menus/bar/Toolbar.ts index 9764c736c..8e389d794 100644 --- a/packages/core/src/menus/bar/Toolbar.ts +++ b/packages/core/src/menus/bar/Toolbar.ts @@ -4,6 +4,7 @@ */ import debounce from 'lodash.debounce' +import clonedeep from 'lodash.clonedeep' import $, { Dom7Array, DOMElement } from '../../utils/dom' import { MENU_ITEM_FACTORIES } from '../register' import { promiseResolveThen } from '../../utils/util' @@ -66,18 +67,19 @@ class Toolbar { const { toolbarKeys = [], insertKeys = { index: 0, keys: [] }, excludeKeys = [] } = this.config // 格式如 ['a', '|', 'b', 'c', '|', 'd'] // 新插入菜单 + const toolbarKeysWithInsertedKeys = clonedeep(toolbarKeys) if (insertKeys.keys.length > 0) { if (typeof insertKeys.keys === 'string') { insertKeys.keys = [insertKeys.keys] } insertKeys.keys.forEach((k, i) => { - toolbarKeys.splice(insertKeys.index + i, 0, k) + toolbarKeysWithInsertedKeys.splice(insertKeys.index + i, 0, k) }) } // 排除某些菜单 - const filteredKeys = toolbarKeys.filter(key => { + const filteredKeys = toolbarKeysWithInsertedKeys.filter(key => { if (typeof key === 'string') { // 普通菜单 if (excludeKeys.includes(key)) return false diff --git a/packages/editor/examples/index.html b/packages/editor/examples/index.html index 3e2dea1da..6864dbb71 100644 --- a/packages/editor/examples/index.html +++ b/packages/editor/examples/index.html @@ -39,6 +39,7 @@

wangEditor examples

  • Shadow DOM
  • Batch destroy, test memory leak 批量销毁，测试内存泄漏
  • Content to html
    • +
  • New menu 新注册菜单
    • diff --git a/packages/editor/examples/new-menu.html b/packages/editor/examples/new-menu.html new file mode 100644 index 000000000..2a6932102 --- /dev/null +++ b/packages/editor/examples/new-menu.html @@ -0,0 +1,91 @@ + + + + + + + New menu + + + + + +

    New menu

    +

    + + +

    + +
    +
    +
    +
    + + + + + + \ No newline at end of file diff --git a/tests/units/editor/config/toolbar-config.test.ts b/tests/units/editor/config/toolbar-config.test.ts index 95e8be6fd..f30f545fd 100644 --- a/tests/units/editor/config/toolbar-config.test.ts +++ b/tests/units/editor/config/toolbar-config.test.ts @@ -50,18 +50,20 @@ describe('toolbar config', () => { expect(excludeKeys).toEqual(keys) }) - it('if set insertKeys, it will insert key to specify position', done => { - const keys = ['headerSelect', 'italic'] - const toolbar = createToolbar(editor, { - insertKeys: { - index: 8, - keys, - }, - }) - setTimeout(() => { - const { toolbarKeys = [] } = toolbar.getConfig() - expect(toolbarKeys.slice(8, 8 + keys.length)).toEqual(keys) - done() - }) - }) + // // 这里先注释掉 - wangfupeng 2022.01.06 + // // 因为 insertKeys 不应该修改 toolbarKeys 的值，还因此引发了一个 bug wangEditor-v5/issues/330 + // it('if set insertKeys, it will insert key to specify position', done => { + // const keys = ['headerSelect', 'italic'] + // const toolbar = createToolbar(editor, { + // insertKeys: { + // index: 8, + // keys, + // }, + // }) + // setTimeout(() => { + // const { toolbarKeys = [] } = toolbar.getConfig() + // expect(toolbarKeys.slice(8, 8 + keys.length)).toEqual(keys) + // done() + // }) + // }) })