import React from 'react'
import { fireEvent, render } from '@testing-library/react'
import ProductSwitcherListItem from './ListItem'
import { STUB_DATA } from '../stub'
import type { ProductType } from '../types'

describe('Test App Switcher ListItem', () => {
    describe('App variants', () => {
        it.each(STUB_DATA.map((i) => i.name))('App %s', (app: ProductType) => {
            const { getByText } = render(
                <ProductSwitcherListItem label={app} app={app} />
            )
            expect(getByText(app)).toBeInTheDocument()
        })

        it('should, render subheader', () => {
            const { getByText } = render(
                <ProductSwitcherListItem
                    label="Changepoint"
                    app="changepoint"
                    secondaryLabel="secondary instance"
                />
            )
            expect(getByText('Changepoint')).toBeInTheDocument()
            expect(getByText('secondary instance')).toBeInTheDocument()
        })
    })
    it('Should mount focused', () => {
        const { getByRole } = render(
            <ProductSwitcherListItem
                label="spigit"
                app="changepoint"
                tabIndex={0}
            />
        )
        expect(getByRole('menuitemradio')).toHaveFocus()
    })
    it('Should mount not focused', () => {
        const { getByRole } = render(
            <ProductSwitcherListItem label="spigit" app="changepoint" />
        )
        expect(getByRole('menuitemradio')).not.toHaveFocus()
    })
    it('Should callback on Enter', () => {
        const spy = jest.fn()
        const { getByRole } = render(
            <ProductSwitcherListItem
                label="changepoint"
                app="changepoint"
                tabIndex={0}
                onActivate={spy}
            />
        )
        fireEvent.keyDown(getByRole('menuitemradio'), {
            key: 'Enter',
        })
        expect(spy).toHaveBeenCalled()
    })
    it('Should callback on Space', () => {
        const spy = jest.fn()
        const { getByRole } = render(
            <ProductSwitcherListItem
                label="changepoint"
                app="changepoint"
                tabIndex={0}
                onActivate={spy}
            />
        )
        fireEvent.keyDown(getByRole('menuitemradio'), {
            key: 'Space',
        })
        expect(spy).toHaveBeenCalled()
    })
    it('Should callback on Space react 17', () => {
        const spy = jest.fn()
        const { getByRole } = render(
            <ProductSwitcherListItem
                label="changepoint"
                app="changepoint"
                tabIndex={0}
                onActivate={spy}
            />
        )
        fireEvent.keyDown(getByRole('menuitemradio'), {
            key: 'Space',
        })
        expect(spy).toHaveBeenCalled()
    })
    it('Should callback on click', () => {
        const spy = jest.fn()
        const { getByRole } = render(
            <ProductSwitcherListItem
                label="changepoint"
                app="changepoint"
                tabIndex={0}
                onActivate={spy}
            />
        )
        fireEvent.click(getByRole('menuitemradio'))
        expect(spy).toHaveBeenCalled()
    })
    it('Active', () => {
        const { getByRole } = render(
            <ProductSwitcherListItem
                label="active label"
                app="leankit"
                active
            />
        )
        expect(
            getByRole('menuitemradio', { checked: true })
        ).toBeInTheDocument()
    })
})