/**
 * @vitest-environment jsdom
 */
import { it, expect, vi, beforeEach, describe, afterEach } from 'vitest'
import { react$, react$$, waitToLoadReact } from '../../src/scripts/resq.js'

class MockResq {
    byProps = vi.fn().mockImplementation(() => new MockResq())
    byState = vi.fn().mockImplementation(() => new MockResq())
}

beforeEach(() => {
    (global.window as any).resq = {
        resq$: vi.fn().mockImplementation(() => new MockResq()),
        resq$$: vi.fn().mockImplementation(() => new MockResq()),
        waitToLoadReact: vi.fn(),
    }
})

describe('resq script', () => {
    describe('react$', () => {
        it('should call the window function', () => {
            const result = react$('Test', [{ foo: 'bar' }], { test: 123 }, {} as HTMLElement)

            const { resq$ } = (global.window as any).resq
            const { byProps } = resq$.mock.results[0].value
            const { byState } = byProps.mock.results[0].value

            expect(resq$).toBeCalledTimes(1)
            expect(resq$).toBeCalledWith('Test', {})
            expect(byProps).toBeCalledTimes(1)
            expect(byProps).toBeCalledWith([{ foo: 'bar' }])
            expect(byState).toBeCalledTimes(1)
            expect(byState).toBeCalledWith({ test: 123 })
            expect(result).toMatchObject({ message: 'React element with selector "Test" wasn\'t found' })
        })

        it('should return node object found', () => {
            (global.window as any).resq.resq$ = vi.fn().mockImplementation(() => ([{
                node: global.document.createElement('div')
            }]))

            const result = react$('Test', [], {}, {} as HTMLElement)

            expect(result).toMatchObject(global.document.createElement('div') as any)
        })

        it('should return the first node object for fragments', () => {
            (global.window as any).resq.resq$ = vi.fn().mockImplementation(() => ([{
                node: [global.document.createElement('div'), global.document.createElement('div')],
                isFragment: true,
            }]))

            const result = react$('Test', [], {}, {} as HTMLElement)

            expect(result).toMatchObject(global.document.createElement('div') as any)
        })
    })

    describe('react$$"', () => {
        it('should call the window functiom', () => {
            const result = react$$('Test', [{ foo: 'bar' }], { test: '123' }, {} as HTMLElement)

            const { resq$$ } = (global.window as any).resq
            const { byProps } = resq$$.mock.results[0].value
            const { byState } = byProps.mock.results[0].value

            expect(resq$$).toBeCalledTimes(1)
            expect(resq$$).toBeCalledWith('Test', {})
            expect(byProps).toBeCalledTimes(1)
            expect(byProps).toBeCalledWith([{ foo: 'bar' }])
            expect(byState).toBeCalledTimes(1)
            expect(byState).toBeCalledWith({ test: '123' })
            expect(result).toMatchObject([])
        })

        it('should return node objects found', () => {
            (global.window as any).resq.resq$$ = vi.fn().mockImplementation(() => ([
                { node: global.document.createElement('div') }
            ]))

            const result = react$$('Test', [], {}, {} as HTMLElement)

            expect(result).toMatchObject([global.document.createElement('div')])
        })

        it('should return array node objects for fragments', () => {
            (global.window as any).resq.resq$$ = vi.fn().mockImplementation(() => ([
                {
                    node: [global.document.createElement('div'), global.document.createElement('div')],
                    isFragment: true,
                },
                {
                    node: [global.document.createElement('div'), global.document.createElement('div')],
                    isFragment: true,
                }
            ]))

            const result = react$$('Test', [], {}, {} as HTMLElement)

            expect(result).toMatchObject([
                global.document.createElement('div'),
                global.document.createElement('div'),
                global.document.createElement('div'),
                global.document.createElement('div')
            ])
        })
    })

    it('should call window waitToLoadReact', () => {
        waitToLoadReact()

        expect((global.window as any).resq.waitToLoadReact).toBeCalledTimes(1)
    })
})

afterEach(() => {
    delete (global.window as any).resq
})