ldx-widgets/tests/components/radio_input.coffee

widgets

describe 'Radio Input', ->
  RadioInput = React.createFactory require('../../src/components/radio_input')


  #--------------------------------------------------------------------- Default Props
  it 'Should have default props', ->

    radioInput = TestUtils.renderIntoDocument RadioInput {}

    defaultProps = radioInput.props

    expect(defaultProps.className).to.equal('radio-input')
    expect(defaultProps.disabled).to.equal(no)
    

  #--------------------------------------------------------------------- Additional Props
  it 'Should Render with appropriate tabIndex if the tabIndex property is passed', ->

    index = 10

    radioInput = TestUtils.renderIntoDocument RadioInput {
        tabIndex: index
      }

    RadioInputEl = ReactDOM.findDOMNode(radioInput)
    
    expect(+RadioInputEl.getAttribute('tabIndex')).to.equal(index)
  

  it 'Should Render a label with appropriate title if the title property is passed with a wrapperLabel', ->

    title = 'this is a tooltip'

    radioInput = TestUtils.renderIntoDocument RadioInput {
        title: title
        wrapperLabel: 'test'
      }

    label = findRenderedDOMComponentWithTag radioInput, 'label'
    
    expect(label.getAttribute('title')).to.equal(title)
  

  it 'Should Render the radio with appropriate title if the title property is passed withOUT a wrapperLabel', ->

    title = 'this is a tooltip'

    radioInput = TestUtils.renderIntoDocument RadioInput {
        title: title
      }

    RadioInputEl = ReactDOM.findDOMNode(radioInput)
    
    expect(RadioInputEl.getAttribute('title')).to.equal(title)


  it 'Should Render with appropriate id if the id property is passed', ->

    id = 1

    radioInput = TestUtils.renderIntoDocument RadioInput {
        id: id
      }

    RadioInputEl = ReactDOM.findDOMNode(radioInput)
    
    expect(+RadioInputEl.getAttribute('id')).to.equal(id)


  it 'Should Render with appropriate label if the wrapperLabel property is passed', ->

    newLabel = 'Test New Label'

    radioInput = TestUtils.renderIntoDocument RadioInput {
        wrapperLabel: newLabel
      }

    labelText = TestUtils.findRenderedDOMComponentWithTag radioInput, 'span'
    
    expect(labelText.innerText).to.equal(newLabel)


  it 'Should Render with appropriate css class if the wrapperLabel property is passed', ->

    radioInput = TestUtils.renderIntoDocument RadioInput {
        wrapperLabel: 'New Label'
      }

    RadioInputEl = ReactDOM.findDOMNode(radioInput)

    expect(RadioInputEl.getAttribute('class')).to.equal('radio-input-label')


  it 'Should NOT Render a label if the wrapperLabel property is null', ->

    radioInput = TestUtils.renderIntoDocument RadioInput {
        wrapperLabel: null
        onChange: ->
      }
    
    RadioInputEl = ReactDOM.findDOMNode(radioInput)

    expect(RadioInputEl.getAttribute('class')).to.not.equal('radio-input-label')


  it 'Should Render a checked radio when the checked property is yes', ->

    radioInput = TestUtils.renderIntoDocument RadioInput {
        checked: yes
        onChange: ->
      }
    
    radio = TestUtils.findRenderedDOMComponentWithTag radioInput, 'input'

    expect(radio.checked).to.equal(yes)


  it 'Should Render a disabled radio when the disabled property is yes', ->

    radioInput = TestUtils.renderIntoDocument RadioInput {
        disabled: yes
        onChange: ->
      }
    
    radio = TestUtils.findRenderedDOMComponentWithTag radioInput, 'input'

    expect(radio.disabled).to.equal(yes)


   it 'Should call the onChange after a change event', ->
    onChange = sinon.spy()


    radioInput = TestUtils.renderIntoDocument RadioInput {
        onChange: onChange
      }
    
    radio = TestUtils.findRenderedDOMComponentWithTag radioInput, 'input'

    TestUtils.Simulate.change radio

    expect(onChange.called).to.equal(yes)