ldx-widgets/tests/components/select_input_2.coffee

widgets

describe 'SelectInput 2', ->
  React = require 'react'
  SelectInput2 = React.createFactory require('../../src/components/select_input_2')
  TestUtils = require 'react-addons-test-utils'
  ReactDOM = require 'react-dom'
  dispatcher = require('../../src/dispatcher')
  ValidationContext = require '../../src/context_wrapper'
  _ = require 'lodash'

  afterEach -> dispatcher.dispatch 'clear-all'

  options = [
    {
      label: 'one'
      value: 1
    }
    {
      label: 'two'
      value: 2
    }
    {
      label: 'three'
      value: 3
    }
    {
      label: 'four'
      value: 4
    }
    {
      label: 'five'
      value: 5
    }
  ]

  fullOptions = [
    {
      active: true
      authority: "WELL_WELLOGIC"
      canRemove: true
      codeConceptId: "c_0000-06552d7d-9d38-4016-946a-9214c0409fad"
      codeSetId: -25
      codeType: "FLAT"
      description: "Female"
      displayCodeId: "0000-06552d7d-9d38-4016-946a-9214c0409fad"
      mnemonic: "F"
      primaryId: "0000-06552d7d-9d38-4016-946a-9214c0409fad"
      title: "Female"
      value: "valueFemale"
      label: "Female Label"
    }
    {
      active: true
      authority: "WELL_WELLOGIC"
      canRemove: true
      codeConceptId: "c_0000-06552d7d-9d38-4016-946a-9214c0409f22"
      codeSetId: -25
      codeType: "FLAT"
      description: "Male"
      displayCodeId: "0000-06552d7d-9d38-4016-946a-9214c0409f22"
      mnemonic: "M"
      primaryId: "0000-06552d7d-9d38-4016-946a-9214c0409f22"
      title: "Male"
      value: "valueMale"
      label: "Male Label"
    }
  ]

  ###
  
  Note About ValidationContext

  The input validation uses context to gain access to the app level validation methods
  Because context is only present when the component is a child of the application, it is not present in tests
  The ValidationContext component, simply wraps the input component, and adds the validation context methods so they are present in the tests
  
  ###

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

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps: 
        options: []
        onChange: ->
    })

    selectInput = wrapper.getInput()
    defaultProps = selectInput.props

    expect(defaultProps.loading).to.equal(no)
    expect(defaultProps.className).to.equal('select-menu')
    expect(defaultProps.validation).to.equal(off)
    expect(defaultProps.disabled).to.equal(no)
    expect(defaultProps.isInPopover).to.equal(no)
    expect(defaultProps.openOnMount).to.equal(no)
    expect(defaultProps.returnFullObjects).to.equal(no)


#--------------------------------------------------------------------- Spinner
  it 'Should show a spinner when the loading prop is true', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps: 
        loading: yes
        options: options
        onChange: ->

    })

    inputSpinner = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'input-spinner'

    expect(inputSpinner.length).to.equal(1)


# #--------------------------------------------------------------------- Validation
  it 'Should set valueHasChanged to true after a change occurs', ->
    handleChange = sinon.spy()

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        loading: no
        onChange: handleChange
        options: options

    })

    selectInput = wrapper.getInput()

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    TestUtils.Simulate.change selectInputEl, {target: {value: '6'}}

    expect(selectInput.state.valueHasChanged).to.equal(yes)


# #--------------------------------------------------------------------- Selected Text
  it 'Should set selected text value to empty string when pass selectText in the props ', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        loading: no
        options: options
        onChange: ->
        selectText: 'Select One'
    })

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    selectValue = ReactDOM.findDOMNode(selectInputEl).value

    expect(selectValue).to.equal('')


  it 'Should set first option to selectText when selectText is passed as a property', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        loading: no
        options: options
        onChange: ->
        selectText: 'Select One'
    })

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    firstOption = selectInputEl[0]

    expect(firstOption.value).to.equal('')
  
    expect(firstOption.innerText).to.equal('Select One')

# #--------------------------------------------------------------------- Return Full Objects

  it 'Should return full object when returnFullObjects is true', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        options: fullOptions
        onChange: ->
        returnFullObjects: yes
        valueField: 'mnemonic'
        labelField: 'title'
        value: 'F'
    })

    selectInput = wrapper.getInput()

    selectValue = selectInput.getValue()

    expect(_.isObject(selectValue)).to.equal(yes)

  it 'Should return single value when returnFullObjects is false', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        options: fullOptions
        onChange: ->
        returnFullObjects: no
        valueField: 'mnemonic'
        labelField: 'title'
        value: 'F'
    })

    selectInput = wrapper.getInput()

    selectValue = selectInput.getValue()

    expect(_.isObject(selectValue)).to.equal(no)


#--------------------------------------------------------------------- Value Field & Value Label

  it 'Should set the option values to the valueField attribute', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        options: fullOptions
        onChange: ->
        valueField: 'mnemonic'
        labelField: 'title'
    })

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    option1 = selectInputEl[0]
    option2 = selectInputEl[1]
    

    expect(option1.value).to.equal(fullOptions[0].mnemonic)
    expect(option2.value).to.equal(fullOptions[1].mnemonic)

  it 'Should set the innerText of the options to the labelField attribute', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        options: fullOptions
        onChange: ->
        valueField: 'mnemonic'
        labelField: 'title'
    })

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    option1 = selectInputEl[0]
    option2 = selectInputEl[1]
    

    expect(option1.innerText).to.equal(fullOptions[0].title)
    expect(option2.innerText).to.equal(fullOptions[1].title)

  it 'Should set the option values to the value attribute if valueField is not passed', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        options: fullOptions
        onChange: ->
    })

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    option1 = selectInputEl[0]
    option2 = selectInputEl[1]
    

    expect(option1.value).to.equal(fullOptions[0].value)
    expect(option2.value).to.equal(fullOptions[1].value)


  it 'Should set the innerText of the options to the label attribute if labelField is not passed', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: SelectInput2
      childProps:
        options: fullOptions
        onChange: ->
    })

    selectInputEl = TestUtils.findRenderedDOMComponentWithClass wrapper, 'select-menu'

    option1 = selectInputEl[0]
    option2 = selectInputEl[1]
    

    expect(option1.innerText).to.equal(fullOptions[0].label)
    expect(option2.innerText).to.equal(fullOptions[1].label)