schlechtenburg/packages/rich-text/lib/test/to-html-string.test.ts
2024-10-08 09:15:26 +02:00

115 lines
3.1 KiB
TypeScript

import { describe, expect, it, beforeAll } from 'vitest'
import { useFormatTypes } from '../use-format-types';
import { create } from '../create';
import { toHTMLString } from '../to-html-string';
import { withSetup, specWithRegistration } from './helpers';
function createNode( HTML ) {
const doc = document.implementation.createHTMLDocument( '' );
doc.body.innerHTML = HTML;
return doc.body.firstChild;
}
describe( 'toHTMLString', () => {
beforeAll( () => {
useFormatTypes();
const { addFormatTypes, removeFormatTypes } = withSetup(() => useFormatTypes());
specWithRegistration.forEach(
( {
description,
formatName,
formatType,
html,
value,
noToHTMLString,
} ) => {
if ( noToHTMLString ) {
return;
}
// eslint-disable-next-line jest/valid-title
it( description, () => {
if ( formatName ) {
addFormatTypes( { name: formatName, ...formatType } );
}
const result = toHTMLString( { value } );
if ( formatName ) {
removeFormatTypes( formatName );
}
expect( result ).toEqual( html );
} );
}
);
});
it( 'should extract recreate HTML 1', () => {
const HTML =
'one <em>two 🍒</em> <a href="#"><img src=""><strong>three</strong></a><img src="">';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
it( 'should extract recreate HTML 2', () => {
const HTML =
'one <em>two 🍒</em> <a href="#">test <img src=""><strong>three</strong></a><img src="">';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
it( 'should extract recreate HTML 3', () => {
const HTML = '<img src="">';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
it( 'should extract recreate HTML 4', () => {
const HTML = '<em>two 🍒</em>';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
it( 'should extract recreate HTML 5', () => {
const HTML =
'<em>If you want to learn more about how to build additional blocks, or if you are interested in helping with the project, head over to the <a href="https://github.com/WordPress/gutenberg">GitHub repository</a>.</em>';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
it( 'should serialize neighbouring formats of same type', () => {
const HTML = '<a href="a">a</a><a href="b">a</a>';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
it( 'should serialize neighbouring same formats', () => {
const HTML = '<a href="a">a</a><a href="a">a</a>';
const element = createNode( `<p>${ HTML }</p>` );
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
HTML
);
} );
} );