@muvehealth/fixins/dist/blocks/__tests__/CollapsableFormHeading.test.js.flow

Component library for Muvehealth

/* eslint-disable function-paren-newline, comma-dangle */
import React from 'react'
import renderWithTheme from '../../testHelper'
import CollapsableFormHeading from '../CollapsableFormHeading'

describe('CollapsableFormHeading', () => {
  it('renders a closed CollapsableFormHeading', () => {
    const tree = renderWithTheme(
      <CollapsableFormHeading
        text="Form Heading"
        render={() => (
          <div>
Surprise! Hidden content!
          </div>
        )}
      />
    )
    expect(tree).toMatchSnapshot()
  })

  it('renders an open CollapsableFormHeading by default', () => {
    const tree = renderWithTheme(
      <CollapsableFormHeading
        openByDefault
        text="Form Heading"
        render={() => (
          <div>
Surprise! Hidden content!
          </div>
        )}
      />
    )
    expect(tree).toMatchSnapshot()
  })

  it('renders an open CollapsableFormHeading', () => {
    const tree = mount(
      <CollapsableFormHeading
        text="Form Heading"
        render={() => (
          <div>
Surprise! Hidden content!
          </div>
        )}
      />
    )
    const heading = tree.find('div[data-test-id="form-heading"]')
    heading.simulate('click', { })
    expect(tree).toMatchSnapshot()
  })

  describe('events', () => {
    it('handles onClick', () => {
      const wrapper = mount(
        <CollapsableFormHeading
          text="Form Heading"
          render={() => (
            <div>
Surprise! Hidden content!
            </div>
          )}
        />
      )
      const heading = wrapper.find('div[data-test-id="form-heading"]')
      heading.simulate('click', { })
      expect(wrapper.state('showRenderProps')).toEqual(true)
      heading.simulate('click', {})
      expect(wrapper.state('showRenderProps')).toEqual(false)
    })
  })
})