import '@testing-library/jest-dom/extend-expect';
import React from 'react';
import { act } from '@testing-library/react';
import { waitUntilEqual } from 'lib/testing/wait';
import renderWithProvider, { Options as RenderOptions } from './provider';

interface Options extends RenderOptions {
    waitUntilMatch?: object;
}

const executeHook = async (hook: Function, options: Options = {}) => {
    const CLASSNAME = '__THE_DATA';

    const Component = () => {
        const result = hook(options.arguments);
        return <div className={CLASSNAME}>{JSON.stringify(result)}</div>;
    };

    const wrapper = await renderWithProvider(Component, options);

    const parseOutput = () => {
        const container = wrapper.container.getElementsByClassName(CLASSNAME).item(0) as HTMLElement;
        return JSON.parse(container.textContent || '{}');
    };

    await act(async () => {
        if (options.waitUntilMatch) {
            const target = JSON.parse(JSON.stringify(options.waitUntilMatch));
            await waitUntilEqual(parseOutput, { target });
        }
    });

    return parseOutput();
};

export default executeHook;
