/* eslint-disable no-unused-vars */
import * as React from 'react'
import {render, screen} from '@testing-library/react'
import {vi} from 'vitest'
import * as Prepress from '../../Prepress'

import {Body} from '..'
import {AnimationBag} from '../../../hooks/useAnimation'

vi.spyOn(Prepress, `BleedCrops`)

describe(`Body`, () => {
  it(`renders correctly`, () => {
    render(<Body backdropClassName={`background-color:toyota-400`}>test</Body>)
    const body = screen.getByText(`test`)
    expect(body).toBeInTheDocument()
    expect(body).toHaveStyle(`display:contents`)
    const backdrop = screen.getByRole(`presentation`)
    expect(backdrop).toBeInTheDocument()
    expect(backdrop).toHaveClass(`background-color:toyota-400`)
  })

  describe(`Print context`, () => {
    it(`outputs prepress related components`, () => {
      const {rerender} = render(<Body>test</Body>)
      expect(Prepress.BleedCrops).not.toHaveBeenCalled()

      rerender(<Body bleed>test</Body>)
      expect(Prepress.BleedCrops).toHaveBeenCalled()
    })
  })

  describe(`Animation context`, () => {
    it(`outputs animation related components`, () => {
      const animationBag: AnimationBag = {
        scripts: <div>animation scripts here</div>,
        bodyClassName: ``,
      }

      const {rerender} = render(<Body>test</Body>)
      expect(screen.queryByText(/animation/i)).not.toBeInTheDocument()

      rerender(<Body animation={animationBag}>test</Body>)
      expect(screen.getByText(/animation/i)).toBeInTheDocument()
    })
  })
})