import CreateBankModal from '../presenter'
import Bank from '../../../../common/records/Bank'
import Modal from '@instructure/ui-overlays/lib/components/Modal'

describe('CreateBankModal', () => {
  const createBankStub = sinon.stub()
  const closeModalStub = sinon.stub()
  const focusStub = sinon.stub()
  const screenreaderNotificationStub = sinon.stub()

  const modalProps = {
    modalOpen: true,
    temporaryBank: {
      isValid: () => true
    },
    displayError: false,
    createBank: createBankStub,
    changeBank: () => {},
    clearModifications: () => {},
    hideError: () => {},
    showError: () => {},
    closeModal: closeModalStub,
    modalTrigger: {
      focus: focusStub
    },
    screenreaderNotification: screenreaderNotificationStub
  }
  const testbed = createTestbed(CreateBankModal, modalProps)
  const shallowtestbed = testbed.renderShallowly()

  describe('CreateBankModal', () => {
    it('renders the modal', () => {
      const modal = shallowtestbed.find(Modal)
      expect(modal).to.have.length(1)
    })
  })

  describe('Modal Title', () => {
    it('renders the correct title for the modal', () => {
      const modalheader = shallowtestbed.find('ModalHeader')
      expect(modalheader).to.have.length(1)
      expect(modalheader.render().text()).to.be.equal('New Item Bank')
    })
  })

  describe('Bank Title input', () => {
    it('renders text input for bank title', () => {
      const bankInput = shallowtestbed.find('TextInput')
      expect(bankInput.render().text()).to.include('Bank Name')
    })
  })

  describe('Cancel action', () => {
    it('renders cancel button', () => {
      const cancelButton = shallowtestbed.find('Button[variant="default"]')
      expect(cancelButton.render().text()).to.include('Cancel')
    })

    it('calls the cancel action', () => {
      const cancelButton = shallowtestbed.find('Button[variant="default"]')
      cancelButton.simulate('click')
      expect(closeModalStub.called).to.be.true()
    })
  })

  describe('Create Bank action', () => {
    it('renders the create bank button', () => {
      const modalfooter = shallowtestbed.find('ModalFooter')
      const createButton = modalfooter.shallow({disableLifecycleMethods: true}).find('Button[variant="primary"]')
      expect(createButton.render().text()).to.include('Create Bank')
    })

    it('does not create the bank when the name is blank', () => {
      const errortestbed = testbed.renderShallowly(
        {
          temporaryBank: new Bank({id: 'temp_id'}),
          errorKey: 'temp_id_create_bank',
          displayError: true
        })
      const createButton = errortestbed.find('Button[variant="primary"]')
      createButton.simulate('click')
      const bankInput = errortestbed.find('TextInput')
      expect(bankInput.render().text()).to.include('cannot be blank')
      expect(createBankStub.called).to.be.false()
      expect(screenreaderNotificationStub.called).to.be.true()
    })

    it('creates the bank when the name is entered', () => {
      const createButton = shallowtestbed.find('Button[variant="primary"]')
      const bankInput = shallowtestbed.find('TextInput')
      bankInput.simulate('change', { target: { value: 'After Change' } })
      createButton.simulate('click')
      expect(createBankStub.called).to.be.true()
    })
  })
})
