import * as React from 'react'
import {render, screen} from '@testing-library/react'
import {SplitLineBreaks, SpacesToNonBreaking, LineBreaksToSpaces} from '..'

describe(`SplitLineBreaks`, () => {
  it(`works`, () => {
    const {rerender} = render(
      <SplitLineBreaks text={`one\ntwo\nthree`}>
        {(items) => (
          <>
            <span>{items.length}</span>
            <span>{items[1]}</span>
            <span>{items[2]}</span>
          </>
        )}
      </SplitLineBreaks>
    )
    expect(screen.getByText(/two/i)).toBeInTheDocument()
    expect(screen.getByText(/3/i)).toBeInTheDocument()
    expect(screen.getByText(/three/i)).toBeInTheDocument()

    rerender(
      <SplitLineBreaks text={`one\ntwo\nthree`} max={2}>
        {(items) => (
          <>
            <span>{items.length}</span>
            <span>{items[1]}</span>
            <span>{items[2]}</span>
          </>
        )}
      </SplitLineBreaks>
    )

    expect(screen.queryByText(/three/i)).not.toBeInTheDocument()
  })
})

describe(`SpacesToNonBreaking`, () => {
  it(`works`, () => {
    const {rerender} = render(
      <SpacesToNonBreaking text={`1 3456789`}>{(items) => <span>{items}</span>}</SpacesToNonBreaking>
    )
    // this is a bad test because Testing Library is "normalising" the text which seem to mean in this case that non-breaking spaces are being changed back to regular spaces
    expect(screen.getByText(/1/i)).toHaveTextContent(`1 3456789`)

    rerender(
      <SpacesToNonBreaking text={`1 3456789`} max={8}>
        {(items) => <span>{items}</span>}
      </SpacesToNonBreaking>
    )
    // specifying max=8 means that the text will be truncated to 8 characters
    expect(screen.getByText(/1/i)).toHaveTextContent(`1 345678`)
  })
})

describe(`LineBreaksToSpaces`, () => {
  it(`works`, () => {
    render(<LineBreaksToSpaces text={`one\ntwo\nthree`}>{(items) => <span>{items}</span>}</LineBreaksToSpaces>)
    expect(screen.getByText(/two/i)).toHaveTextContent(`one two three`)
  })
})