import '@testing-library/jest-dom/extend-expect';
import React from 'react';
import { render, fireEvent } from '@testing-library/react';
import PopoverHeader, { Props, TERM_POPOVER_TITLE, CLASSNAME_HEADER_CLOSE } from '../PopoverHeader';
import { DATASOURCES_PAGE_URL } from '../constants';

describe('<PopoverHeader>', () => {
    const defaultProps: Props = {
        onClose: jest.fn()
    };

    const renderMocked = (props: Partial<Props> = {}) =>
        render(<PopoverHeader {...{ ...defaultProps, ...props }} />);

    test('header title is a link to DATASOURCES_PAGE_URL', () => {
        const { getByText } = renderMocked();
        const title = getByText(TERM_POPOVER_TITLE);

        if (!title.parentElement)
            throw new Error('Failed to get title anchor element');

        expect(title.parentElement.getAttribute('href')).toBe(DATASOURCES_PAGE_URL);
    });

    test('clicking on close icon invokes onClose callback', () => {
        const onClose = jest.fn();
        const { container } = renderMocked({ onClose });
        const button = container.getElementsByClassName(CLASSNAME_HEADER_CLOSE).item(0);

        if (!button)
            throw new Error('Failed to get close button');

        fireEvent.click(button);

        expect(onClose).toHaveBeenCalled();
    });
});