ldx-widgets/tests/components/alert_modal.coffee

widgets

describe 'AlertModal', ->
  React = require 'react'
  AlertModal = React.createFactory require('../../src/components/alert_modal')
  TestUtils = require 'react-dom/test-utils'
  ReactDOM = require 'react-dom'
  dispatcher = require('../../src/dispatcher')
  ValidationContext = require '../../src/context_wrapper'


  afterEach -> dispatcher.dispatch 'clear-all'

  
  ###
  
  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: AlertModal
      childProps:
        close: ->
        message: 'message'
    })

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

    expect(defaultProps.className).to.be.a('string')
    expect(defaultProps.okText).to.equal('OK')
    expect(defaultProps.cancelText).to.equal('Cancel')
    expect(defaultProps.close).to.be.a('function')
    expect(defaultProps.okText).to.be.a('string')
    expect(defaultProps.cancelText).to.be.a('string')
    expect(defaultProps.message).to.be.a('string')


  it 'Should render message as a child when it is a react element', ->

    message = React.createElement('div', {className: 'message-as-child'}, 'Message')
      
    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: message
    })

    memberObjClass = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'message-as-child'
    noAccessClass = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'no-access'

    expect(memberObjClass.length).to.equal(1)
    expect(noAccessClass.length).to.equal(0)


  it 'Should render the NoAccess widget with the message text when message is a string', ->

    message = "This is a string"
      
    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: message
    })

    memberObjClass = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'message-as-child'
    noAccessClass = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'no-access'

    expect(memberObjClass.length).to.equal(0)
    expect(noAccessClass.length).to.equal(1)

    
  it 'Should Render 2 buttons (cancel and okay buttons) when cb is defined', ->
 
    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: 'this is a message'
        cb: ->
    })

    buttons = TestUtils.scryRenderedDOMComponentsWithTag wrapper, 'button'
    cancelButton = buttons[0]

    expect(buttons.length).to.equal(2)
    expect(cancelButton.getAttribute('class')).to.equal('okay-cancel cancel')


  it 'Should Render an okay button with appropriate class when cb is defined', ->
 
    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: 'this is a message'
        cb: ->
    })

    buttons = TestUtils.scryRenderedDOMComponentsWithTag wrapper, 'button'

    okayButton = buttons[1]

    expect(okayButton.getAttribute('class')).to.equal('okay-cancel okay')


  it 'Should Render a single button with appropriate class when cb is not defined', ->
 
    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: 'this is a message'
    })

    button = TestUtils.findRenderedDOMComponentWithTag wrapper, 'button'

    expect(button.getAttribute('class')).to.equal('prmy ok')


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

    className = 'new-class'

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        className: className
        message: 'message'
    })

    mainDiv = TestUtils.scryRenderedDOMComponentsWithClass wrapper, className

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

  it 'Should Render with "modal alert" css class if the className property is not passed', ->

    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: 'message'
    })

    mainDiv = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'modal alert'

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


  it 'Should apply an inline height when height is passed', ->
    height = 211
    wrapper = TestUtils.renderIntoDocument(ValidationContext {
      factory: AlertModal
      childProps:
        close: ->
        message: 'message'
        height: height
    })

    mainDiv = TestUtils.scryRenderedDOMComponentsWithClass wrapper, 'modal alert'

    expect(mainDiv[0].style.height).to.equal("#{height}px")