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', attributes: {} };
	const strong = { type: 'strong', attributes: {} };

  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 ) {
			return;
		}

		// eslint-disable-next-line jest/valid-title
		it( description, () => {
			const element = createElement( document, html );
			const range = createRange( element );
			const createdRecord = create( {
				element,
				range,
			}, store );
			const formatsLength = getSparseArrayLength( record.formats );
			const createdFormatsLength = getSparseArrayLength(
				createdRecord.formats
			);

			expect( createdRecord ).toEqual( record );
			expect( createdFormatsLength ).toEqual( formatsLength );
		} );
	} );

	specWithRegistration.forEach(
		( {
			description,
			formatName,
			formatType,
			html,
			value: expectedValue,
		} ) => {
			// eslint-disable-next-line jest/valid-title
			it( description, () => {
				if ( formatName ) {
					store.registerFormatTypes( formatName, formatType );
				}

				const result = create({ html }, store);

				if ( formatName ) {
					store.unregisterFormatTypes( formatName );
				}

				expect( result ).toEqual( expectedValue );
			} );
		}
	);

	it( 'should reference formats', () => {
		const value = create( { html: '<em>te<strong>st</strong></em>' }, store );

		expect( value ).toEqual( {
			formats: [ [ em ], [ em ], [ em, strong ], [ em, strong ] ],
			replacements: [ , , , , ],
			text: 'test',
		} );

		// Format objects.
		expect( value.formats[ 0 ][ 0 ] ).toBe( value.formats[ 1 ][ 0 ] );
		expect( value.formats[ 0 ][ 0 ] ).toBe( value.formats[ 2 ][ 0 ] );
		expect( value.formats[ 2 ][ 1 ] ).toBe( value.formats[ 3 ][ 1 ] );

		// Format arrays per index.
		expect( value.formats[ 0 ] ).toBe( value.formats[ 1 ] );
		expect( value.formats[ 2 ] ).toBe( value.formats[ 3 ] );
	} );

	it( 'should use different reference for equal format', () => {
		const value = create( { html: '<a href="#">a</a><a href="#">a</a>' }, store );

		// Format objects.
		expect( value.formats[ 0 ][ 0 ] ).not.toBe( value.formats[ 1 ][ 0 ] );

		// Format arrays per index.
		expect( value.formats[ 0 ] ).not.toBe( value.formats[ 1 ] );
	} );

	it( 'should use different reference for different format', () => {
		const value = create( { html: '<a href="#">a</a><a href="#a">a</a>' }, store );

		// Format objects.
		expect( value.formats[ 0 ][ 0 ] ).not.toBe( value.formats[ 1 ][ 0 ] );

		// Format arrays per index.
		expect( value.formats[ 0 ] ).not.toBe( value.formats[ 1 ] );
	} );

	it( 'removeReservedCharacters should remove all reserved characters', () => {
		expect(
			removeReservedCharacters( `${ OBJECT_REPLACEMENT_CHARACTER }` )
		).toEqual( '' );
		expect( removeReservedCharacters( `${ ZWNBSP }` ) ).toEqual( '' );
		expect(
			removeReservedCharacters(
				`${ OBJECT_REPLACEMENT_CHARACTER }c${ OBJECT_REPLACEMENT_CHARACTER }at${ OBJECT_REPLACEMENT_CHARACTER }`
			)
		).toEqual( 'cat' );
		expect(
			removeReservedCharacters( `${ ZWNBSP }b${ ZWNBSP }at${ ZWNBSP }` )
		).toEqual( 'bat' );
		expect(
			removeReservedCharacters(
				`te${ OBJECT_REPLACEMENT_CHARACTER }st${ ZWNBSP }${ ZWNBSP }`
			)
		).toEqual( 'test' );
	} );
} );