mirror/tiptap
1
0
Fork 0
mirror of https://github.com/ueberdosis/tiptap.git synced 2024-11-27 14:59:27 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

fix: apply #5147 fix to marks and nodes resolves #4704 (#5156)

Browse Source 
* fix: apply #5147 fix to marks and nodes

* fix: resolve Issue #4704 by reverting PR #4191

* test: more robust tests for nodes and marks too
This commit is contained in:
Nick Perez 2024-06-18 08:00:28 +02:00 committed by GitHub
parent 3556d5812b
commit c540c7d2e8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 427 additions and 359 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/core/src/Extension.ts
View File

@ -457,17 +457,17 @@ export class Extension<Options = any, Storage = any> {
configure(options: Partial<Options> = {}) {
// return a new instance so we can use the same extension
// with different calls of `configure`
const extension = this.extend()
const extension = this.extend({
...this.config,
addOptions() {
return mergeDeep(this.parent?.() || {}, options) as Options
},
})
// Always preserve the current name
extension.name = this.name
// Set the parent to be our parent
extension.parent = this.parent
extension.options = mergeDeep(this.options as Record<string, any>, options) as Options
extension.storage = callOrReturn(
getExtensionField<AnyConfig['addStorage']>(extension, 'addStorage', {
name: extension.name,
options: extension.options,
}),
)
return extension
}
@ -483,7 +483,7 @@ export class Extension<Options = any, Storage = any> {
extension.name = extendedConfig.name ? extendedConfig.name : extension.parent.name
if (extendedConfig.defaultOptions) {
if (extendedConfig.defaultOptions && Object.keys(extendedConfig.defaultOptions).length > 0) {
console.warn(
`[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${extension.name}".`,
)

23
packages/core/src/Mark.ts
View File

@ -589,16 +589,17 @@ export class Mark<Options = any, Storage = any> {
configure(options: Partial<Options> = {}) {
// return a new instance so we can use the same extension
// with different calls of `configure`
const extension = this.extend()
const extension = this.extend({
...this.config,
addOptions() {
return mergeDeep(this.parent?.() || {}, options) as Options
},
})
extension.options = mergeDeep(this.options as Record<string, any>, options) as Options
extension.storage = callOrReturn(
getExtensionField<AnyConfig['addStorage']>(extension, 'addStorage', {
name: extension.name,
options: extension.options,
}),
)
// Always preserve the current name
extension.name = this.name
// Set the parent to be our parent
extension.parent = this.parent
return extension
}
@ -606,7 +607,7 @@ export class Mark<Options = any, Storage = any> {
extend<ExtendedOptions = Options, ExtendedStorage = Storage>(
extendedConfig: Partial<MarkConfig<ExtendedOptions, ExtendedStorage>> = {},
) {
const extension = new Mark<ExtendedOptions, ExtendedStorage>({ ...this.config, ...extendedConfig })
const extension = new Mark<ExtendedOptions, ExtendedStorage>(extendedConfig)
extension.parent = this
@ -614,7 +615,7 @@ export class Mark<Options = any, Storage = any> {
extension.name = extendedConfig.name ? extendedConfig.name : extension.parent.name
if (extendedConfig.defaultOptions) {
if (extendedConfig.defaultOptions && Object.keys(extendedConfig.defaultOptions).length > 0) {
console.warn(
`[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${extension.name}".`,
)

23
packages/core/src/Node.ts
View File

@ -780,16 +780,17 @@ export class Node<Options = any, Storage = any> {
configure(options: Partial<Options> = {}) {
// return a new instance so we can use the same extension
// with different calls of `configure`
const extension = this.extend()
const extension = this.extend({
...this.config,
addOptions() {
return mergeDeep(this.parent?.() || {}, options) as Options
},
})
extension.options = mergeDeep(this.options as Record<string, any>, options) as Options
extension.storage = callOrReturn(
getExtensionField<AnyConfig['addStorage']>(extension, 'addStorage', {
name: extension.name,
options: extension.options,
}),
)
// Always preserve the current name
extension.name = this.name
// Set the parent to be our parent
extension.parent = this.parent
return extension
}
@ -797,7 +798,7 @@ export class Node<Options = any, Storage = any> {
extend<ExtendedOptions = Options, ExtendedStorage = Storage>(
extendedConfig: Partial<NodeConfig<ExtendedOptions, ExtendedStorage>> = {},
) {
const extension = new Node<ExtendedOptions, ExtendedStorage>({ ...this.config, ...extendedConfig })
const extension = new Node<ExtendedOptions, ExtendedStorage>(extendedConfig)
extension.parent = this
@ -805,7 +806,7 @@ export class Node<Options = any, Storage = any> {
extension.name = extendedConfig.name ? extendedConfig.name : extension.parent.name
if (extendedConfig.defaultOptions) {
if (extendedConfig.defaultOptions && Object.keys(extendedConfig.defaultOptions).length > 0) {
console.warn(
`[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${extension.name}".`,
)

720
tests/cypress/integration/core/extendExtensions.spec.ts
View File

@ -1,354 +1,420 @@
/// <reference types="cypress" />
import { Extension, getExtensionField } from '@tiptap/core'
import {
Extension, getExtensionField, Mark, Node,
} from '@tiptap/core'
describe('extend extensions', () => {
it('should define a config', () => {
const extension = Extension.create({
addAttributes() {
return {
[Extension, Node, Mark].forEach(Extendable => {
describe(Extendable.create().type, () => {
it('should define a config', () => {
const extension = Extendable.create({
addAttributes() {
return {
foo: {},
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: {},
})
})
it('should overwrite a config', () => {
const extension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend({
addAttributes() {
return {
bar: {},
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
expect(attributes).to.deep.eq({
bar: {},
})
})
it('should have a parent', () => {
const extension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
const newExtension = extension
.extend({
addAttributes() {
return {
bar: {},
}
},
})
const parent = newExtension.parent
expect(parent).to.eq(extension)
})
it('should merge configs', () => {
const extension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: {},
bar: {},
})
})
it('should merge configs multiple times', () => {
const extension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
.extend({
addAttributes() {
return {
...this.parent?.(),
baz: {},
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: {},
bar: {},
baz: {},
})
})
it('should set parents multiple times', () => {
const grandparentExtension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
const parentExtension = grandparentExtension
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const childExtension = parentExtension
.extend({
addAttributes() {
return {
...this.parent?.(),
baz: {},
}
},
})
expect(parentExtension.parent).to.eq(grandparentExtension)
expect(childExtension.parent).to.eq(parentExtension)
})
it('should merge configs without direct parent configuration', () => {
const extension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend()
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: {},
bar: {},
})
})
it('should call ancestors only once', () => {
const callCounts = {
grandparent: 0,
parent: 0,
child: 0,
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
const extension = Extendable
.create({
addAttributes() {
callCounts.grandparent += 1
return {
foo: {},
}
},
})
.extend({
addAttributes() {
callCounts.parent += 1
return {
...this.parent?.(),
bar: {},
}
},
})
.extend({
addAttributes() {
callCounts.child += 1
return {
...this.parent?.(),
bar: {},
}
},
})
expect(attributes).to.deep.eq({
foo: {},
})
})
getExtensionField(extension, 'addAttributes')()
it('should overwrite a config', () => {
const extension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend({
addAttributes() {
return {
bar: {},
}
},
expect(callCounts).to.deep.eq({
grandparent: 1,
parent: 1,
child: 1,
})
})
const attributes = getExtensionField(extension, 'addAttributes')()
it('should call ancestors only once on configure', () => {
const callCounts = {
grandparent: 0,
parent: 0,
child: 0,
}
expect(attributes).to.deep.eq({
bar: {},
})
})
it('should have a parent', () => {
const extension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
const newExtension = extension
.extend({
addAttributes() {
return {
bar: {},
}
},
})
const parent = newExtension.parent
expect(parent).to.eq(extension)
})
it('should merge configs', () => {
const extension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const attributes = getExtensionField(extension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: {},
bar: {},
})
})
it('should merge configs multiple times', () => {
const extension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
.extend({
addAttributes() {
return {
...this.parent?.(),
const extension = Extendable
.create({
addAttributes() {
callCounts.grandparent += 1
return {
foo: {},
}
},
})
.extend({
addAttributes() {
callCounts.parent += 1
return {
...this.parent?.(),
bar: {},
}
},
})
.extend({
addAttributes() {
callCounts.child += 1
return {
...this.parent?.(),
bar: {},
}
},
})
.configure({
baz: {},
}
},
})
getExtensionField(extension, 'addAttributes')()
expect(callCounts).to.deep.eq({
grandparent: 1,
parent: 1,
child: 1,
})
})
const attributes = getExtensionField(extension, 'addAttributes')()
it('should use grandparent as parent on configure (not parent)', () => {
const grandparentExtension = Extendable
.create({
addAttributes() {
return {
foo: {},
}
},
})
expect(attributes).to.deep.eq({
foo: {},
bar: {},
baz: {},
})
})
const parentExtension = grandparentExtension
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
it('should set parents multiple times', () => {
const grandparentExtension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
const parentExtension = grandparentExtension
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const childExtension = parentExtension
.extend({
addAttributes() {
return {
...this.parent?.(),
const childExtension = parentExtension
.configure({
baz: {},
}
},
})
expect(parentExtension.parent).to.eq(grandparentExtension)
expect(childExtension.parent).to.eq(grandparentExtension)
})
expect(parentExtension.parent).to.eq(grandparentExtension)
expect(childExtension.parent).to.eq(parentExtension)
})
it('should use parent\'s config on `configure`', () => {
const grandparentExtension = Extendable
.create({
name: 'grandparent',
addAttributes() {
return {
foo: {},
}
},
})
it('should merge configs without direct parent configuration', () => {
const extension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
.extend()
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
const parentExtension = grandparentExtension
.extend({
name: 'parent',
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const childExtension = parentExtension
.configure({
baz: {},
})
expect(childExtension.config.name).to.eq('parent')
})
const attributes = getExtensionField(extension, 'addAttributes')()
it('should allow extending a configure', () => {
expect(attributes).to.deep.eq({
foo: {},
bar: {},
const parentExtension = Extendable
.create({
addAttributes() {
return { foo: 'bar' }
},
})
const childExtension = parentExtension
.configure().extend()
const attributes = getExtensionField(childExtension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: 'bar',
})
})
it('should allow calling this.parent when extending a configure', () => {
const parentExtension = Extendable
.create({
name: 'parentExtension',
addAttributes() {
return {
foo: {},
}
},
})
const childExtension = parentExtension
.configure({}).extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const attributes = getExtensionField(childExtension, 'addAttributes')()
expect(attributes).to.deep.eq({
foo: {},
bar: {},
})
})
it('should deeply merge options when extending a configured extension', () => {
const parentExtension = Extendable
.create({
name: 'parentExtension',
addOptions() {
return { defaultOptions: 'is-overwritten' }
},
})
const childExtension = parentExtension
.configure({ configuredOptions: 'exists-too' }).extend({
name: 'childExtension',
addOptions() {
return { ...this.parent?.(), additionalOptions: 'exist-too' }
},
})
expect(childExtension.options).to.deep.eq({
configuredOptions: 'exists-too',
additionalOptions: 'exist-too',
})
})
})
})
it('should call ancestors only once', () => {
const callCounts = {
grandparent: 0,
parent: 0,
child: 0,
}
const extension = Extension
.create({
addAttributes() {
callCounts.grandparent += 1
return {
foo: {},
}
},
})
.extend({
addAttributes() {
callCounts.parent += 1
return {
...this.parent?.(),
bar: {},
}
},
})
.extend({
addAttributes() {
callCounts.child += 1
return {
...this.parent?.(),
bar: {},
}
},
})
getExtensionField(extension, 'addAttributes')()
expect(callCounts).to.deep.eq({
grandparent: 1,
parent: 1,
child: 1,
})
})
it('should call ancestors only once on configure', () => {
const callCounts = {
grandparent: 0,
parent: 0,
child: 0,
}
const extension = Extension
.create({
addAttributes() {
callCounts.grandparent += 1
return {
foo: {},
}
},
})
.extend({
addAttributes() {
callCounts.parent += 1
return {
...this.parent?.(),
bar: {},
}
},
})
.extend({
addAttributes() {
callCounts.child += 1
return {
...this.parent?.(),
bar: {},
}
},
})
.configure({
baz: {},
})
getExtensionField(extension, 'addAttributes')()
expect(callCounts).to.deep.eq({
grandparent: 1,
parent: 1,
child: 1,
})
})
it('should use grandparent as parent on configure (not parent)', () => {
const grandparentExtension = Extension
.create({
addAttributes() {
return {
foo: {},
}
},
})
const parentExtension = grandparentExtension
.extend({
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const childExtension = parentExtension
.configure({
baz: {},
})
expect(parentExtension.parent).to.eq(grandparentExtension)
expect(childExtension.parent).to.eq(grandparentExtension)
})
it('should use parent\'s config on `configure`', () => {
const grandparentExtension = Extension
.create({
name: 'grandparent',
addAttributes() {
return {
foo: {},
}
},
})
const parentExtension = grandparentExtension
.extend({
name: 'parent',
addAttributes() {
return {
...this.parent?.(),
bar: {},
}
},
})
const childExtension = parentExtension
.configure({
baz: {},
})
expect(childExtension.config.name).to.eq('parent')
})
it('should inherit config on configure', () => {
const parentExtension = Extension
.create({
name: 'did-inherit',
})
const childExtension = parentExtension
.configure()
expect(childExtension.config.name).to.eq('did-inherit')
})
})