import React from 'react'
import { mount } from '../../test/utils'

import { TextContainer } from '../TextContainer'

describe('<TextContainer />', () => {
  it('mounts', () => {
    const textContainer = mount(<TextContainer />)
    expect(textContainer).not.toBeNull()
  })

  it('renders its children', () => {
    const mockChildren = 'mock_children'
    const app = mount(<TextContainer>{mockChildren}</TextContainer>)
    expect(app).toContainReactText(mockChildren)
  })

  it('renders a div by default', () => {
    const textContainer = mount(<TextContainer>Lorem ipsum</TextContainer>)
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the leading normal is provided', () => {
    const textContainer = mount(
      <TextContainer leading="normal">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the leading loose is provided', () => {
    const textContainer = mount(
      <TextContainer leading="loose">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the leading tight is provided', () => {
    const textContainer = mount(
      <TextContainer leading="tight">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the alignment left is provided', () => {
    const textContainer = mount(
      <TextContainer alignment="left">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the alignment center is provided', () => {
    const textContainer = mount(
      <TextContainer alignment="center">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the alignment right is provided', () => {
    const textContainer = mount(
      <TextContainer alignment="right">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })

  it('renders a div when the alignment justify is provided', () => {
    const textContainer = mount(
      <TextContainer alignment="justify">Lorem ipsum</TextContainer>
    )
    expect(textContainer).toContainReactComponent('div')
  })
})
