LearnersGuild/echo

View on GitHub
src/common/components/__tests__/ChapterForm.test.js

Summary

Maintainability
A
0 mins
Test Coverage
/* eslint-env mocha */
/* global expect, testContext */
/* eslint-disable prefer-arrow-callback, no-unused-expressions */
/**
FIXME found
* FIXME: Temporarily disabling tests that require a full mount due to:
* https://github.com/erikras/redux-form/issues/849
*/
import React from 'react'
import {shallow, mount} from 'enzyme'
 
import ChapterForm from 'src/common/components/ChapterForm'
 
describe(testContext(__filename), function () {
before(function () {
const mockField = {
defaultValue: null,
initialValue: null,
invalid: false,
}
 
const changeField = name => {
return () => {
this.fieldsChanged[name] = true
}
}
 
this.fieldsChanged = {
id: false,
name: false,
channelName: false,
timezone: false,
}
 
this.mockFields = {
id: Object.assign({}, mockField, {name: 'id', onChange: changeField('id')}),
name: Object.assign({}, mockField, {name: 'name', onChange: changeField('name')}),
channelName: Object.assign({}, mockField, {name: 'channelName', onChange: changeField('channelName')}),
timezone: Object.assign({}, mockField, {name: 'timezone', onChange: changeField('timezone')}),
}
 
this.mockAuth = {
currentUser: {
id: 'abcd1234',
email: 'me@example.com',
emails: ['me@example.com', 'me2@example.com'],
handle: 'me',
name: 'Me',
phone: null,
dateOfBirth: null,
timezone: null,
},
}
 
this.getProps = customProps => {
const baseProps = {
handleSubmit: () => null,
submitting: false,
submitFailed: false,
showCreateInviteCode: false,
onSaveInviteCode: () => null,
onSaveChapter: () => null,
change: () => null,
auth: Object.assign({}, this.mockAuth),
formValues: Object.assign({}, this.mockFields),
invalid: false,
pristine: true,
}
return customProps ? Object.assign({}, baseProps, customProps) : baseProps
}
})
 
describe('interactions', function () {
it.skip('updates fields when they are changed', function () {
const changesToTest = {
id: true,
name: true,
channelName: true,
}
 
const props = this.getProps()
const root = mount(React.createElement(ChapterForm, props))
const inputs = root.find('ThemedInput')
 
inputs.forEach(input => {
if (changesToTest[input.props().name]) {
input.simulate('change')
}
})
 
Object.keys(changesToTest).forEach(fieldName => {
expect(this.fieldsChanged[fieldName]).to.equal(true)
})
})
 
it.skip('submit button is disabled if the form has errors', function () {
const props = this.getProps({
invalid: true,
})
 
const root = mount(React.createElement(ChapterForm, props))
const submitButton = root.findWhere(node => {
return node.name() === 'Button' && node.props().type === 'submit'
}).first()
 
expect(submitButton.props().disabled).to.equal(true)
})
 
it.skip('submit button is enabled if there are no errors', function () {
const root = mount(React.createElement(ChapterForm, this.getProps()))
const submitButton = root.findWhere(node => {
return node.name() === 'Button' && node.props().type === 'submit'
}).first()
 
expect(submitButton.props().disabled).to.equal(false)
})
 
it('handles form submission', function () {
let submitted = false
const props = this.getProps({
handleSubmit: () => {
submitted = true
},
})
 
const root = shallow(React.createElement(ChapterForm, props))
root.find('form').simulate('submit')
 
expect(submitted).to.equal(true)
})
})
})