src/common/components/__tests__/ChapterForm.test.js
/* 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) }) })})