import React from 'react'
import { render } from '@toptal/picasso-test-utils'

import type { Props } from './NativeSelectPlaceholder'
import NativeSelectPlaceholder from './NativeSelectPlaceholder'

const CHILDREN = 'Select an option'

const renderNativeSelectPlaceholder = ({
  children = CHILDREN,
  emptySelectValue = '',
  disabled = false,
}: Partial<Props> = {}) =>
  render(
    <NativeSelectPlaceholder
      emptySelectValue={emptySelectValue}
      disabled={disabled}
    >
      {children}
    </NativeSelectPlaceholder>
  )

describe('NativeSelectPlaceholder', () => {
  it('renders', () => {
    const { container } = renderNativeSelectPlaceholder()

    expect(container).toMatchSnapshot()
  })

  it('renders with emptySelectValue', () => {
    const { container } = renderNativeSelectPlaceholder({
      emptySelectValue: 'foo',
    })

    expect(container).toMatchSnapshot()
  })

  it('renders disabled', () => {
    const { container } = renderNativeSelectPlaceholder({ disabled: true })

    expect(container).toMatchSnapshot()
  })
})