import { render } from '@testing-library/react';
import { MockComponent, registerComponent } from './index';

/* Wrapper components injected by each optional library. */
export const optionalLibraryWrappers: Record<string, string[]> = {
    '@servicetitan/anvil2': ['PortalProvider'],
    '@servicetitan/design-system': [
        'DefaultPortalContext.Provider',
        'TablePopupPropsContext.Provider',
    ],
};

export interface RegisterHarness {
    Page: {
        readonly componentShadowRoot: ShadowRoot;
        readonly portalShadowRoot: ShadowRoot;
    };
    subject: () => ReturnType<typeof render>;
}

export function createRegisterHarness(
    componentName: string,
    options?: Parameters<typeof registerComponent>[2]
): RegisterHarness {
    const Page = {
        get componentShadowRoot() {
            return document.querySelector(componentName)!.shadowRoot!;
        },
        get portalShadowRoot() {
            return document.querySelector('body')!.lastElementChild!.shadowRoot!;
        },
    };

    beforeAll(() => {
        registerComponent(MockComponent, componentName, {
            sharedDependenciesNames: ['@servicetitan/anvil2'],
            ...options,
        });
    });

    const subject = () => {
        jest.spyOn(console, 'error').mockImplementation(jest.fn()); // suppress "ReactDOM.render deprecated" error
        const Component: any = componentName;
        const handleRef = (wc: any) => wc?.provide({ foo: 'bar' }); // triggers rendering
        return render(<Component ref={handleRef} />);
    };

    return { Page, subject };
}