126 lines
3.4 KiB
TypeScript
126 lines
3.4 KiB
TypeScript
import { describe, expect, it, beforeAll } from 'vitest'
|
|
import { mount } from '@vue/test-utils';
|
|
import { defineComponent } from 'vue'
|
|
|
|
import { useFormatTypes, FormatTypeStore } from '../use-format-types';
|
|
import { create } from '../create';
|
|
import { toHTMLString } from '../to-html-string';
|
|
import { specWithRegistration } from './helpers';
|
|
|
|
function createNode( HTML ) {
|
|
const doc = document.implementation.createHTMLDocument( '' );
|
|
doc.body.innerHTML = HTML;
|
|
return doc.body.firstChild;
|
|
}
|
|
|
|
describe( 'toHTMLString', () => {
|
|
let TestComponent;
|
|
let store: FormatTypeStore;
|
|
beforeAll(async () => {
|
|
TestComponent = defineComponent({
|
|
setup () {
|
|
return useFormatTypes();
|
|
}
|
|
});
|
|
|
|
store = mount(TestComponent).vm;
|
|
});
|
|
|
|
specWithRegistration.forEach(
|
|
( {
|
|
description,
|
|
formatName,
|
|
formatType,
|
|
html,
|
|
value,
|
|
noToHTMLString,
|
|
} ) => {
|
|
if ( noToHTMLString ) {
|
|
return;
|
|
}
|
|
|
|
// eslint-disable-next-line jest/valid-title
|
|
it.skip( description, () => {
|
|
console.log(description, formatName);
|
|
if ( formatName ) {
|
|
store.registerFormatTypes( { name: formatName, ...formatType } );
|
|
}
|
|
|
|
const result = toHTMLString( { value } );
|
|
|
|
if ( formatName ) {
|
|
store.unregisterFormatTypes( formatName );
|
|
}
|
|
|
|
expect( result ).toEqual( html );
|
|
} );
|
|
}
|
|
);
|
|
|
|
it.skip( '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.skip( '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.skip( 'should extract recreate HTML 3', () => {
|
|
const HTML = '<img src="">';
|
|
const element = createNode( `<p>${ HTML }</p>` );
|
|
|
|
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
|
|
HTML
|
|
);
|
|
} );
|
|
|
|
it.skip( 'should extract recreate HTML 4', () => {
|
|
const HTML = '<em>two 🍒</em>';
|
|
const element = createNode( `<p>${ HTML }</p>` );
|
|
|
|
expect( toHTMLString( { value: create( { element } ) } ) ).toEqual(
|
|
HTML
|
|
);
|
|
} );
|
|
|
|
it.skip( '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.skip( '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.skip( '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
|
|
);
|
|
} );
|
|
} );
|