From a51aad42ee2b59f26ed0cbf7b92b927ed0dfaaeb Mon Sep 17 00:00:00 2001 From: b12f Date: Wed, 9 Oct 2024 16:47:31 +0200 Subject: [PATCH] test: fix tests --- packages/core/__tests__/core.test.ts | 8 +- packages/rich-text/lib/create.ts | 102 +++++-------- packages/rich-text/lib/test/create.test.ts | 36 +++-- packages/rich-text/lib/test/to-dom.test.ts | 18 ++- .../rich-text/lib/test/to-html-string.test.ts | 13 +- packages/rich-text/lib/to-dom.ts | 88 +++++------- packages/rich-text/lib/to-tree.ts | 135 ++++++++---------- packages/rich-text/lib/use-format-types.ts | 24 +++- 8 files changed, 198 insertions(+), 226 deletions(-) diff --git a/packages/core/__tests__/core.test.ts b/packages/core/__tests__/core.test.ts index b50c089..1af2977 100644 --- a/packages/core/__tests__/core.test.ts +++ b/packages/core/__tests__/core.test.ts @@ -6,13 +6,13 @@ describe('@schlechtenburg/core', () => { const a = 'a'; const b = 'b'; - it('Should activate', () => { + it('Should activate', async () => { const { activeBlockId, isActive, activate, deactivate, - } = withSetup(() => useActivation(a)); + } = await withSetup(() => useActivation(a)); activate(a); expect(activeBlockId.value).toBe(a); @@ -22,9 +22,9 @@ describe('@schlechtenburg/core', () => { expect(activeBlockId.value).toBe(b); expect(isActive.value).toBeFalsy(); - deactivate(); + deactivate(activeBlockId.value); expect(isActive.value).toBeFalsy(); - expect(activeBlockId.value).toBe(undefined); + expect(activeBlockId.value).toBe(null); activate(); expect(activeBlockId.value).toBe(a); diff --git a/packages/rich-text/lib/create.ts b/packages/rich-text/lib/create.ts index 0f4cc5a..479714b 100644 --- a/packages/rich-text/lib/create.ts +++ b/packages/rich-text/lib/create.ts @@ -1,7 +1,4 @@ -/** - * Internal dependencies - */ -import { useFormatTypes } from './use-format-types'; +import { FormatTypeStore } from './use-format-types'; import { createElement } from './create-element'; import { mergePair } from './concat'; import { OBJECT_REPLACEMENT_CHARACTER, ZWNBSP } from './special-characters'; @@ -15,8 +12,14 @@ function createEmptyValue(): RichTextValue { }; } -function toFormat( { tagName, attributes }: { tagName: string, attributes: Record } ): RichTextFormat { - const { getFormatTypeForClassName, getFormatTypeForBareElement } = useFormatTypes(); +function toFormat( + { tagName, attributes }: { tagName: string, attributes: Record }, + store: FormatTypeStore, +): RichTextFormat { + if (!store) { + console.dir((new Error()).stack); + } + const { getFormatTypeForClassName, getFormatTypeForBareElement } = store; let formatType: RichTextFormatType|undefined; if ( attributes && attributes.class ) { @@ -81,14 +84,14 @@ function toFormat( { tagName, attributes }: { tagName: string, attributes: Recor }; } -export const fromPlainText = (text: string) => create({ text }); -export const fromHTMLString = (html: string) => create({ html }); -export const fromHTMLElement = (htmlElement: Element, options: { preserveWhiteSpace?: boolean } = {}) => { +export const fromPlainText = (text: string, store: FormatTypeStore) => create({ text }, store); +export const fromHTMLString = (html: string, store: FormatTypeStore) => create({ html }, store); +export const fromHTMLElement = (htmlElement: Element, options: { preserveWhiteSpace?: boolean } = {}, store: FormatTypeStore) => { const { preserveWhiteSpace = false } = options; const element = preserveWhiteSpace ? htmlElement : collapseWhiteSpace( htmlElement ); - const richTextValue = create({ element }); + const richTextValue = create({ element }, store); Object.defineProperty( richTextValue, 'originalHTML', { value: htmlElement.innerHTML, } ); @@ -120,27 +123,23 @@ export const fromHTMLElement = (htmlElement: Element, options: { preserveWhiteSp * holds information about the formatting at the relevant text indices. Finally * `start` and `end` state which text indices are selected. They are only * provided if a `Range` was given. - * - * @param {Object} [$1] Optional named arguments. - * @param {Element} [$1.element] Element to create value from. - * @param {string} [$1.text] Text to create value from. - * @param {string} [$1.html] HTML to create value from. - * @param {Range} [$1.range] Range to create value from. - * @return {RichTextValue} A rich text value. */ -export function create({ - element, - text, - html, - range, - isEditableTree = false, -}: { - element?: Element|Node, - text?: string, - html?: string, - range?: SimpleRange, - isEditableTree?: boolean, -} = {} ): RichTextValue { +export function create( + { + element, + text, + html, + range, + isEditableTree = false, + }: { + element?: Element|Node, + text?: string, + html?: string, + range?: SimpleRange, + isEditableTree?: boolean, + } = {}, + store: FormatTypeStore, +): RichTextValue { if ( typeof text === 'string' && text.length > 0 ) { return { formats: Array( text.length ), @@ -163,17 +162,12 @@ export function create({ element, range, isEditableTree, - } ); + }, store ); } /** * Helper to accumulate the value's selection start and end from the current * node and range. - * - * @param {Object} accumulator Object to accumulate into. - * @param {Node} node Node to create value with. - * @param {Range} range Range to create value with. - * @param {Object} value Value that is being accumulated. */ function accumulateSelection( accumulator: RichTextValue, @@ -238,12 +232,6 @@ function accumulateSelection( /** * Adjusts the start and end offsets from a range based on a text filter. - * - * @param {Node} node Node of which the text should be filtered. - * @param {Range} range The range to filter. - * @param {Function} filter Function to use to filter the text. - * - * @return {Object|undefined} Object containing range properties. */ function filterRange(node: Node, range?: SimpleRange, filter?: Function): SimpleRange|undefined { if ( ! range ) { @@ -280,11 +268,6 @@ function filterRange(node: Node, range?: SimpleRange, filter?: Function): Simple * * @see * https://developer.mozilla.org/en-US/docs/Web/CSS/white-space-collapse#collapsing_of_white_space - * - * @param {HTMLElement} element - * @param {boolean} isRoot - * - * @return {HTMLElement} New element with collapsed whitespace. */ function collapseWhiteSpace(element: HTMLElement, isRoot: boolean = true): HTMLElement { const clone = element.cloneNode( true ) as HTMLElement; @@ -346,25 +329,18 @@ export function removeReservedCharacters( string: string ): string { /** * Creates a Rich Text value from a DOM element and range. - * - * @param {Object} $1 Named arguments. - * @param {Element} [$1.element] Element to create value from. - * @param {Range} [$1.range] Range to create value from. - * @param {boolean} [$1.isEditableTree] - * - * @return {RichTextValue} A rich text value. */ function createFromElement( { element, range, isEditableTree, - }: - { + }: { element?:Element|Node, range?:SimpleRange, isEditableTree?: boolean, - } + }, + store: FormatTypeStore, ): RichTextValue { const accumulator = createEmptyValue(); @@ -435,14 +411,14 @@ function createFromElement( if ( tagName === 'br' ) { accumulateSelection( accumulator, node, newRange, createEmptyValue() ); - mergePair( accumulator, create( { text: '\n' } ) ); + mergePair( accumulator, create( { text: '\n' }, store ) ); continue; } const format = toFormat( { tagName, attributes: getAttributes( { element: node as HTMLElement } ), - } ); + }, store ); // When a format type is declared as not editable, replace it with an // object replacement character and preserve the inner HTML. @@ -472,7 +448,7 @@ function createFromElement( element: node as HTMLElement, range: newRange, isEditableTree, - } ); + }, store ); accumulateSelection( accumulator, node, newRange, value ); @@ -524,12 +500,6 @@ function createFromElement( /** * Gets the attributes of an element in object shape. - * - * @param {Object} $1 Named arguments. - * @param {Element} $1.element Element to get attributes from. - * - * @return {Object} Attribute object or `undefined` if the element has no - * attributes. */ function getAttributes({ element }: { element: Element }): Record{ let accumulator: Record = {}; diff --git a/packages/rich-text/lib/test/create.test.ts b/packages/rich-text/lib/test/create.test.ts index 5436c52..26fb41f 100644 --- a/packages/rich-text/lib/test/create.test.ts +++ b/packages/rich-text/lib/test/create.test.ts @@ -1,17 +1,27 @@ import { describe, expect, it, beforeAll } from 'vitest' +import { mount } from '@vue/test-utils'; +import { defineComponent, Component } from 'vue' +import { useFormatTypes, FormatTypeStore } from '../use-format-types'; import { create, removeReservedCharacters } from '../create'; import { OBJECT_REPLACEMENT_CHARACTER, ZWNBSP } from '../special-characters'; import { createElement } from '../create-element'; import { getSparseArrayLength, spec, specWithRegistration } from './helpers'; describe( 'create', () => { - const em = { type: 'em' }; - const strong = { type: 'strong' }; + const em = { type: 'em', attributes: {} }; + const strong = { type: 'strong', attributes: {} }; - beforeAll( () => { - // Initialize the rich-text store. - // require( '../store' ); - } ); + let TestComponent: Component; + let store: FormatTypeStore; + beforeAll(async () => { + TestComponent = defineComponent({ + setup () { + return useFormatTypes(); + } + }); + + store = mount(TestComponent).vm; + }); spec.forEach( ( { description, html, createRange, record } ) => { if ( html === undefined ) { @@ -25,7 +35,7 @@ describe( 'create', () => { const createdRecord = create( { element, range, - } ); + }, store ); const formatsLength = getSparseArrayLength( record.formats ); const createdFormatsLength = getSparseArrayLength( createdRecord.formats @@ -47,13 +57,13 @@ describe( 'create', () => { // eslint-disable-next-line jest/valid-title it( description, () => { if ( formatName ) { - registerFormatType( formatName, formatType ); + store.registerFormatTypes( formatName, formatType ); } - const result = create( { html } ); + const result = create({ html }, store); if ( formatName ) { - unregisterFormatType( formatName ); + store.unregisterFormatTypes( formatName ); } expect( result ).toEqual( expectedValue ); @@ -62,7 +72,7 @@ describe( 'create', () => { ); it( 'should reference formats', () => { - const value = create( { html: 'test' } ); + const value = create( { html: 'test' }, store ); expect( value ).toEqual( { formats: [ [ em ], [ em ], [ em, strong ], [ em, strong ] ], @@ -81,7 +91,7 @@ describe( 'create', () => { } ); it( 'should use different reference for equal format', () => { - const value = create( { html: 'aa' } ); + const value = create( { html: 'aa' }, store ); // Format objects. expect( value.formats[ 0 ][ 0 ] ).not.toBe( value.formats[ 1 ][ 0 ] ); @@ -91,7 +101,7 @@ describe( 'create', () => { } ); it( 'should use different reference for different format', () => { - const value = create( { html: 'aa' } ); + const value = create( { html: 'aa' }, store ); // Format objects. expect( value.formats[ 0 ][ 0 ] ).not.toBe( value.formats[ 1 ][ 0 ] ); diff --git a/packages/rich-text/lib/test/to-dom.test.ts b/packages/rich-text/lib/test/to-dom.test.ts index c705e7e..e1693b1 100644 --- a/packages/rich-text/lib/test/to-dom.test.ts +++ b/packages/rich-text/lib/test/to-dom.test.ts @@ -1,15 +1,27 @@ import { describe, expect, it, beforeAll } from 'vitest' +import { mount } from '@vue/test-utils'; +import { defineComponent, ComponentInstance, Component } from 'vue' +import { useFormatTypes } from '../use-format-types'; import { toDom, applyValue } from '../to-dom'; import { createElement } from '../create-element'; import { spec } from './helpers'; describe( 'recordToDom', () => { + let TestComponent: Component; + let wrapper: ComponentInstance; + beforeAll(async () => { + TestComponent = defineComponent({ + setup () { + return useFormatTypes(); + } + }); + + wrapper = mount(TestComponent); + }); spec.forEach( ( { description, record, startPath, endPath } ) => { // eslint-disable-next-line jest/valid-title it( description, () => { - const { body, selection } = toDom( { - value: record, - } ); + const { body, selection } = toDom({ value: record }, wrapper.componentVM); expect( body ).toMatchSnapshot(); expect( selection ).toEqual( { startPath, endPath } ); } ); diff --git a/packages/rich-text/lib/test/to-html-string.test.ts b/packages/rich-text/lib/test/to-html-string.test.ts index 0166c57..a97efc2 100644 --- a/packages/rich-text/lib/test/to-html-string.test.ts +++ b/packages/rich-text/lib/test/to-html-string.test.ts @@ -2,10 +2,10 @@ import { describe, expect, it, beforeAll } from 'vitest' import { mount } from '@vue/test-utils'; import { defineComponent } from 'vue' -import { useFormatTypes } from '../use-format-types'; +import { useFormatTypes, FormatTypeStore } from '../use-format-types'; import { create } from '../create'; import { toHTMLString } from '../to-html-string'; -import { withSetup, specWithRegistration } from './helpers'; +import { specWithRegistration } from './helpers'; function createNode( HTML ) { const doc = document.implementation.createHTMLDocument( '' ); @@ -14,7 +14,8 @@ function createNode( HTML ) { } describe( 'toHTMLString', () => { - let TestComponent, wrapper; + let TestComponent; + let store: FormatTypeStore; beforeAll(async () => { TestComponent = defineComponent({ setup () { @@ -22,7 +23,7 @@ describe( 'toHTMLString', () => { } }); - wrapper = mount(TestComponent); + store = mount(TestComponent).vm; }); specWithRegistration.forEach( @@ -42,13 +43,13 @@ describe( 'toHTMLString', () => { it.skip( description, () => { console.log(description, formatName); if ( formatName ) { - wrapper.vm.addFormatTypes( { name: formatName, ...formatType } ); + store.registerFormatTypes( { name: formatName, ...formatType } ); } const result = toHTMLString( { value } ); if ( formatName ) { - wrapper.vm.removeFormatTypes( formatName ); + store.unregisterFormatTypes( formatName ); } expect( result ).toEqual( html ); diff --git a/packages/rich-text/lib/to-dom.ts b/packages/rich-text/lib/to-dom.ts index a415a05..9ba8fbf 100644 --- a/packages/rich-text/lib/to-dom.ts +++ b/packages/rich-text/lib/to-dom.ts @@ -1,23 +1,12 @@ -/** - * Internal dependencies - */ - import { toTree } from './to-tree'; +import { FormatTypeStore } from './use-format-types'; import { createElement } from './create-element'; import { isRangeEqual } from './is-range-equal'; import { RichTextValue } from './types'; -/** @typedef {import('./types').RichTextValue} RichTextValue */ - /** * Creates a path as an array of indices from the given root node to the given * node. - * - * @param {Node} node Node to find the path of. - * @param {HTMLElement} rootNode Root node to find the path from. - * @param {Array} path Initial path to build on. - * - * @return {Array} The path from the root node to the node. */ function createPathToNode( node: Node, rootNode: HTMLElement, path: number[] ) { let workingNode: Node|null = node; @@ -39,11 +28,6 @@ function createPathToNode( node: Node, rootNode: HTMLElement, path: number[] ) { /** * Gets a node given a path (array of indices) from the given node. - * - * @param {HTMLElement} node Root node to find the wanted node in. - * @param {Array} path Path (indices) to the wanted node. - * - * @return {Object} Object with the found node and the remaining offset (if any). */ function getNodeByPath( node: HTMLElement, path: number[] ) { let workingNode: Node = node; @@ -105,19 +89,22 @@ function remove( node ) { return node.parentNode.removeChild( node ); } -export function toDom({ - value, - prepareEditableTree, - isEditableTree = true, - placeholder, - doc = document, -}: { - value: RichTextValue, - prepareEditableTree: Function, - isEditableTree?: boolean, - placeholder?: string, - doc?: Document, -}) { +export function toDom( + { + value, + prepareEditableTree, + isEditableTree = true, + placeholder, + doc = document, + }: { + value: RichTextValue, + prepareEditableTree: Function, + isEditableTree?: boolean, + placeholder?: string, + doc?: Document, + }, + store: FormatTypeStore, +) { let startPath: number[] = []; let endPath: number[] = []; @@ -135,8 +122,6 @@ export function toDom({ * Note: The current implementation will return a shared reference, reset on * each call to `createEmpty`. Therefore, you should not hold a reference to * the value to operate upon asynchronously, as it may have unexpected results. - * - * @return {Object} RichText tree. */ const createEmpty = () => createElement( doc, '' ); @@ -162,7 +147,8 @@ export function toDom({ }, isEditableTree, placeholder, - } ); + }, + store ); return { body: tree, @@ -173,32 +159,28 @@ export function toDom({ /** * Create an `Element` tree from a Rich Text value and applies the difference to * the `Element` tree contained by `current`. - * - * @param {Object} $1 Named arguments. - * @param {RichTextValue} $1.value Value to apply. - * @param {HTMLElement} $1.current The live root node to apply the element tree to. - * @param {Function} [$1.prepareEditableTree] Function to filter editorable formats. - * @param {boolean} [$1.__unstableDomOnly] Only apply elements, no selection. - * @param {string} [$1.placeholder] Placeholder text. */ -export function apply( { - value, - current, - prepareEditableTree, - placeholder, -}: { - value: RichTextValue, - current: HTMLElement, - prepareEditableTree: Function, - placeholder: string, -}) { +export function apply( + { + value, + current, + prepareEditableTree, + placeholder, + }: { + value: RichTextValue, + current: HTMLElement, + prepareEditableTree: Function, + placeholder: string, + }, + store: FormatTypeStore, +) { // Construct a new element tree in memory. - const { body, selection } = toDom( { + const { body, selection } = toDom({ value, prepareEditableTree, placeholder, doc: current.ownerDocument, - } ); + }, store ); applyValue( body, current ); diff --git a/packages/rich-text/lib/to-tree.ts b/packages/rich-text/lib/to-tree.ts index 163ed9f..63694e8 100644 --- a/packages/rich-text/lib/to-tree.ts +++ b/packages/rich-text/lib/to-tree.ts @@ -1,7 +1,7 @@ -import { useFormatTypes } from './use-format-types'; import { getActiveFormats } from './get-active-formats'; import { OBJECT_REPLACEMENT_CHARACTER, ZWNBSP } from './special-characters'; import { RichTextValue } from './types'; +import { FormatTypeStore } from './use-format-types'; function restoreOnAttributes( attributes: Record, isEditableTree: boolean ): Record { if ( isEditableTree ) { @@ -25,40 +25,28 @@ function restoreOnAttributes( attributes: Record, isEditableTree: b /** * Converts a format object to information that can be used to create an element * from (type, attributes and object). - * - * @param {Object} $1 Named parameters. - * @param {string} $1.type The format type. - * @param {string} $1.tagName The tag name. - * @param {Object} $1.attributes The format attributes. - * @param {Object} $1.unregisteredAttributes The unregistered format - * attributes. - * @param {boolean} $1.object Whether or not it is an object - * format. - * @param {boolean} $1.boundaryClass Whether or not to apply a boundary - * class. - * @param {boolean} $1.isEditableTree - * - * @return {Object} Information to be used for element creation. */ -function fromFormat( { - type, - tagName, - attributes, - unregisteredAttributes, - object, - boundaryClass, - isEditableTree, -}: { - type: string, - tagName: string, - attributes: Record, - unregisteredAttributes: Record - object: boolean, - boundaryClass: boolean, - isEditableTree: boolean, -}) { - const { findFormatTypeByName } = useFormatTypes(); - const formatType = findFormatTypeByName(type); +function fromFormat( + { + type, + tagName, + attributes, + unregisteredAttributes, + object, + boundaryClass, + isEditableTree, + }: { + type: string, + tagName?: string, + attributes: Record, + unregisteredAttributes: Record + object: boolean, + boundaryClass: boolean, + isEditableTree: boolean, + }, + store: FormatTypeStore, +) { + const formatType = store.getFormatTypeByName(type); let elementAttributes: Record = {}; @@ -118,10 +106,6 @@ function fromFormat( { /** * Checks if both arrays of formats up until a certain index are equal. - * - * @param {Array} a Array of formats to compare. - * @param {Array} b Array of formats to compare. - * @param {number} index Index to check until. */ function isEqualUntil( a: T[], b: T[], index: number ): boolean { do { @@ -133,37 +117,40 @@ function isEqualUntil( a: T[], b: T[], index: number ): boolean { return true; } -export function toTree( { - value, - preserveWhiteSpace, - createEmpty, - append, - getLastChild, - getParent, - isText, - getText, - remove, - appendText, - onStartIndex, - onEndIndex, - isEditableTree, - placeholder, -}: { - value: RichTextValue, - preserveWhiteSpace?: boolean, - createEmpty: Function, - append: Function, - getLastChild: Function, - getParent: Function, - isText: Function, - getText: Function, - remove: Function, - appendText: Function, - onStartIndex?: Function, - onEndIndex?: Function, - isEditableTree?: boolean, - placeholder?: string, -}) { +export function toTree( + { + value, + preserveWhiteSpace, + createEmpty, + append, + getLastChild, + getParent, + isText, + getText, + remove, + appendText, + onStartIndex, + onEndIndex, + isEditableTree, + placeholder, + }: { + value: RichTextValue, + preserveWhiteSpace?: boolean, + createEmpty: Function, + append: Function, + getLastChild: Function, + getParent: Function, + isText: Function, + getText: Function, + remove: Function, + appendText: Function, + onStartIndex?: Function, + onEndIndex?: Function, + isEditableTree?: boolean, + placeholder?: string, + }, + store: FormatTypeStore, +) { const { formats, replacements, text, start, end } = value; const formatsLength = formats.length + 1; const tree = createEmpty(); @@ -220,7 +207,7 @@ export function toTree( { unregisteredAttributes, boundaryClass, isEditableTree, - } ) + }, store ) ); if ( isText( pointer ) && getText( pointer ).length === 0 ) { @@ -248,7 +235,7 @@ export function toTree( { continue; } const { type, attributes, innerHTML } = replacement; - const formatType = getFormatType( type ); + const formatType = store.getFormatTypeByName( type ); if ( ! isEditableTree && type === 'script' ) { pointer = append( @@ -256,7 +243,7 @@ export function toTree( { fromFormat( { type: 'script', isEditableTree, - } ) + }, store ) ); append( pointer, { html: decodeURIComponent( @@ -271,7 +258,7 @@ export function toTree( { ...replacement, isEditableTree, boundaryClass: start === i && end === i + 1, - } ) + }, store ) ); if ( innerHTML ) { @@ -286,7 +273,7 @@ export function toTree( { ...replacement, object: true, isEditableTree, - } ) + }, store ) ); } // Ensure pointer is text node. diff --git a/packages/rich-text/lib/use-format-types.ts b/packages/rich-text/lib/use-format-types.ts index ddb595f..815ddf6 100644 --- a/packages/rich-text/lib/use-format-types.ts +++ b/packages/rich-text/lib/use-format-types.ts @@ -6,17 +6,27 @@ import { import { RichTextFormatType } from './types'; export const SymFormatTypes = Symbol('Schlechtenburg rich text formats'); -export function useFormatTypes() { +export interface FormatTypeStore { + formatTypes: Ref; + registerFormatTypes: (types: RichTextFormatType|RichTextFormatType[]) => void; + unregisterFormatTypes: (types: string|string[]) => void; + findFormatType: (fn: (f:RichTextFormatType) => boolean) => RichTextFormatType|undefined; + getFormatTypeByName: (name: string) => RichTextFormatType|undefined; + getFormatTypeForClassName: (name: string) => RichTextFormatType|undefined; + getFormatTypeForBareElement: (name: string) => RichTextFormatType|undefined; +} + +export function useFormatTypes(): FormatTypeStore { const formatTypes: Ref = inject(SymFormatTypes, ref([])); - const addFormatTypes = (typesToAdd: RichTextFormatType|RichTextFormatType[]) => { + const registerFormatTypes = (typesToAdd: RichTextFormatType|RichTextFormatType[]) => { formatTypes.value = [ ...formatTypes.value, ...(Array.isArray(typesToAdd) ? typesToAdd : [typesToAdd]), ]; }; - const removeFormatTypes = (typesToRemove: string|string[]) => { + const unregisterFormatTypes = (typesToRemove: string|string[]) => { const isArray = Array.isArray(typesToRemove); formatTypes.value = formatTypes.value.filter(({ name }) => { @@ -29,16 +39,16 @@ export function useFormatTypes() { }; const findFormatType = (fn: (f:RichTextFormatType) => boolean) => formatTypes.value.find(type => fn(type)); - const findFormatTypeByName = (name: string) => formatTypes.value.find(type => type.name === name); + const getFormatTypeByName = (name: string) => formatTypes.value.find(type => type.name === name); const getFormatTypeForClassName = (name: string) => formatTypes.value.find(type => type.className === name); const getFormatTypeForBareElement = (name: string) => formatTypes.value.find(type => type.tagName === name); return { formatTypes, - addFormatTypes, - removeFormatTypes, - findFormatTypeByName, + registerFormatTypes, + unregisterFormatTypes, findFormatType, + getFormatTypeByName, getFormatTypeForClassName, getFormatTypeForBareElement, };