import React from 'react'
import { render } from '@testing-library/react'
import { GridComponentsProvider, useGridComponents } from '.'

const Sample = () => {
    const { GridLayout } = useGridComponents()
    return <GridLayout />
}

const DivGrid = ({ children }: { children?: React.ReactNode }) => (
    <div role="grid">{children}</div>
)

describe('GridComponentsContext', () => {
    it('should provide default for components', () => {
        const { getByRole } = render(<Sample />)
        expect(getByRole('table')).toBeInTheDocument()
    })
    it('should allow a component to be overridden', () => {
        const { getByRole } = render(
            <GridComponentsProvider components={{ GridLayout: DivGrid }}>
                <Sample />
            </GridComponentsProvider>
        )
        expect(getByRole('grid')).toBeInTheDocument()
    })
})