import { newSpecPage } from "@stencil/core/testing";
import { BpSdkBusinessClassificationSelectorCardHeader } from "./bp-sdk-business-classification-selector-card-header";
describe('bp-sdk-business-classification-selector-card-header', () => {
    it('renders', async () => {
        const page = await newSpecPage({
            html: '<bp-sdk-business-classification-selector-card-header></bp-sdk-business-classification-selector-card-header>',
            components: [BpSdkBusinessClassificationSelectorCardHeader],
        });
        await page.waitForChanges();
        const element = page.root.querySelector('div');
        expect(element).toBeTruthy();
        expect(page.root.querySelector('bp-sdk-external-business-classification-selector-card-header')).toBeFalsy();
    });
    it('renders naics', async () => {
        const page = await newSpecPage({
            html: '<bp-sdk-business-classification-selector-card-header show-naics-code="true" value="ted" alias="bill"></bp-sdk-business-classification-selector-card-header>',
            components: [BpSdkBusinessClassificationSelectorCardHeader],
        });
        await page.waitForChanges();
        const element = page.root.querySelector('.bp-sdk-business-classification-selector-card-header__text');
        expect(element.textContent).toEqual('ted - bill');
        expect(page.root.querySelector('bp-sdk-external-business-classification-selector-card-header')).toBeFalsy();
    });
    it('renders relevancy chip', async () => {
        const page = await newSpecPage({
            html: '<bp-sdk-business-classification-selector-card-header show-confidence="true" confidence="1"></bp-sdk-business-classification-selector-card-header>',
            components: [BpSdkBusinessClassificationSelectorCardHeader],
        });
        await page.waitForChanges();
        const element = page.root.querySelector('bp-sdk-class-selector-relevance-chip');
        expect(element).toBeTruthy();
        expect(page.root.querySelector('bp-sdk-external-business-classification-selector-card-header')).toBeFalsy();
    });
    it('renders external component if defined', async () => {
        const whenDefinedMock = jest.spyOn(customElements, 'whenDefined').mockResolvedValueOnce({});
        const page = await newSpecPage({
            html: '<bp-sdk-business-classification-selector-card-header></bp-sdk-business-classification-selector-card-header>',
            components: [BpSdkBusinessClassificationSelectorCardHeader],
        });
        await page.waitForChanges();
        expect(page.root.querySelector('bp-sdk-external-business-classification-selector-card-header')).toBeTruthy();
    });
    it('handles renderedValue', async () => {
        const page = await newSpecPage({
            html: '<bp-sdk-business-classification-selector-card-header></bp-sdk-business-classification-selector-card-header>',
            components: [BpSdkBusinessClassificationSelectorCardHeader],
        });
        const instance = page.rootInstance;
        instance.value = null;
        instance.highlights = null;
        await page.waitForChanges();
        expect(instance.highlight).toBeNull();
        instance.value = 'First aid instruction';
        instance.highlights = [{ field: 'value', text: '<em>First</em> <em>aid</em> instruction' }];
        await page.waitForChanges();
        expect(instance.highlight).toStrictEqual('<em>First</em> <em>aid</em> instruction');
        instance.value = 'uber';
        instance.highlights = [
            { field: 'synonyms', text: '<em>Uber</em>' },
            { field: 'value', text: 'Car pool <em>operation</em>' },
        ];
        await page.waitForChanges();
        expect(instance.highlight).toStrictEqual('<em>Uber</em>');
        instance.value = 'test';
        instance.highlights = null;
        await page.waitForChanges();
        expect(instance.highlight).toStrictEqual('test');
    });
});
