ldx-widgets/tests/components/input_type_ahead.coffee

widgets

describe 'InputTypeAhead', ->
  InputTypeAhead = React.createFactory require('../../src/components/input_type_ahead')
  TextInput = React.createFactory require('../../src/components/text_input_2')

  #--------------------------------------------------------------------- Default Props
  it 'Should have default props', ->
    inputTypeAhead = renderIntoDocument ContextWrapper {
      factory: InputTypeAhead
      childProps:
        onSearch: ->
        onChange: ->
    }

        
    defaultProps = inputTypeAhead.getInput().props
    expect(defaultProps.className).to.equal('')
    expect(defaultProps.minLength).to.equal(1)
    expect(defaultProps.searchInterval).to.equal(300)
    expect(defaultProps.maxContainerHeight).to.equal(175)
    expect(defaultProps.focusOnMount).to.equal(false)

  #--------------------------------------------------------------------- Text Change
  it 'Should change the value of the input when the user types', ->
    onChange = sinon.spy()

    inputTypeAhead = renderIntoDocument ContextWrapper {
      factory: InputTypeAhead
      childProps:
        onChange: onChange
        onSearch: ->
        value: 'new value'
    }
   
    input = findRenderedDOMComponentWithTag inputTypeAhead.getInput(), 'input'
    inputValue = input.value


    expect(inputValue).to.equal('new value')


  it 'Should call the onChange when text is entered', ->
    onChange = sinon.spy()
    
    inputTypeAhead = renderIntoDocument ContextWrapper {
      factory: InputTypeAhead
      childProps:
        onChange: onChange
        onSearch: ->
        value: 'new value'
    }
   
    inputText = findRenderedDOMComponentWithTag inputTypeAhead.getInput(), 'input'
    Simulate.change inputText

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

  #--------------------------------------------------------------------- Display Div
  it 'Should display No Results if results array is empty', ->

    onResultSelect = sinon.spy()
    func = sinon.spy()

    inputTypeAhead = renderIntoDocument ContextWrapper {
      factory: InputTypeAhead
      childProps:
        results: []
        showNoResults: true
        onSearch: ->
        onChange: ->
        resultConfig: {
          height: 20
          component: func
          onResultSelect: onResultSelect
        }
    }

    inputTypeAhead.getInput().setState {
      loading: false
      showResults: true
    }
 
    noResultsDiv = scryRenderedDOMComponentsWithClass inputTypeAhead.getInput(), 'no-results'

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

  it 'Should display Results if results array is not empty', ->

    onResultSelect = sinon.spy()
    func = sinon.spy()

    inputTypeAhead = renderIntoDocument ContextWrapper {
      factory: InputTypeAhead
      childProps:
        results: ["one", "two", "three"]
        showNoResults: false
        onSearch: ->
        onChange: ->
        resultConfig: {
          height: 20
          component: func
          onResultSelect: onResultSelect
        }
    }

    cmp = inputTypeAhead.getInput()
    cmp.setState {
      loading: false
      showResults: true
    }
 
    noResultsDiv = scryRenderedDOMComponentsWithClass cmp, 'no-results'
    resultsUl = scryRenderedDOMComponentsWithTag cmp, 'ul'

    expect(noResultsDiv.length).to.equal(0)
    expect(resultsUl.length).to.equal(1)