it('should not contain <FuelSavingsResults /> when necessary conditions are not met', () => { const fuelSavings = getFuelSavings(); const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={jest.fn()} fuelSavings={fuelSavings} />); const expected = <FuelSavingsResults savings={fuelSavings.savings} />; expect(wrapper.contains(expected)).toBeFalsy(); });
it('should contain options to change miles driven timeframe', () => { const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={jest.fn()} fuelSavings={getFuelSavings()} />); const expectedOption1 = '<option value="week">Week</option>'; const expectedOption2 = '<option value="month">Month</option>'; const expectedOption3 = '<option value="year">Year</option>'; expect(wrapper.find('select').childAt(0).html()).toEqual(expectedOption1); expect(wrapper.find('select').childAt(1).html()).toEqual(expectedOption2); expect(wrapper.find('select').childAt(2).html()).toEqual(expectedOption3); });
it('should call onChange when timeframe changes', () => { const onChange = jest.fn(); const fuelSavings = getFuelSavings(); const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={onChange} fuelSavings={fuelSavings} />); const changeEvent = { target: { name: 'timeframe', value: 'year' } }; expect(onChange).not.toBeCalled(); wrapper.find('select').simulate('change', changeEvent); expect(onChange).toBeCalledWith(changeEvent); });
describe('<AboutPage />', () => { it('should have a header called \'About\'', () => { const wrapper = shallow(<AboutPage />); const actual = wrapper.find('h2').text(); const expected = 'About'; expect(actual).toEqual(expected); }); it('should have a header with \'alt-header\' class', () => { const wrapper = shallow(<AboutPage />); const actual = wrapper.find('h2').prop('className'); const expected = 'alt-header'; expect(actual).toEqual(expected); }); it('should link to an unknown route path', () => { const wrapper = shallow(<AboutPage />); const actual = wrapper.findWhere(n => n.prop('to') === '/badlink').length; const expected = 1; expect(actual).toEqual(expected); }); });
it('should contain <FuelSavingsTextInput /> components', () => { const fuelSavings = getFuelSavings(); const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={jest.fn()} fuelSavings={fuelSavings} />); const allInputs = wrapper.find(FuelSavingsTextInput); expect(allInputs.length).toEqual(5); expect(allInputs.at(0).props().name).toEqual('newMpg'); expect(allInputs.at(0).props().value).toEqual(fuelSavings.newMpg); expect(allInputs.at(1).props().name).toEqual('tradeMpg'); expect(allInputs.at(1).props().value).toEqual(fuelSavings.tradeMpg); expect(allInputs.at(2).props().name).toEqual('newPpg'); expect(allInputs.at(2).props().value).toEqual(fuelSavings.newPpg); expect(allInputs.at(3).props().name).toEqual('tradePpg'); expect(allInputs.at(3).props().value).toEqual(fuelSavings.tradePpg); expect(allInputs.at(4).props().name).toEqual('milesDriven'); expect(allInputs.at(4).props().value).toEqual(fuelSavings.milesDriven); });
}; const wrapper = shallow(<FuelSavingsTextInput {...props} />); const inputType = wrapper.type(); expect(inputType).toEqual('input'); }); }; const wrapper = shallow(<FuelSavingsTextInput {...props} />); const changeEvent = {target: {value: 101}}; wrapper.simulate('change', changeEvent); expect(props.onChange).toBeCalledWith(changeEvent); }); }; const wrapper = shallow(<FuelSavingsTextInput {...props} />); const placeholder = wrapper.find('input').prop('placeholder'); expect(placeholder).toEqual('Type Here'); });
it('should call onChange when text input changes', () => { const onChange = jest.fn(); const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={onChange} fuelSavings={getFuelSavings()} />); const changeEvent = { target: { name: 'newMpg', value: '20' } }; expect(onChange).not.toBeCalled(); wrapper.find(FuelSavingsTextInput).first().simulate('change', changeEvent); expect(onChange).toBeCalledWith(changeEvent); });
const wrapper = shallow( <FuelSavingsPage actions={actions} ); expect(wrapper.find(FuelSavingsForm).length).toEqual(1); }); const wrapper = mount( <FuelSavingsPage actions={actions} ); const save = wrapper.find('input[type="submit"]'); save.simulate("click"); const wrapper = mount( <FuelSavingsPage actions={actions} const value = 10; const input = wrapper.find('input[name="newMpg"]'); input.simulate("change", { target: { name, value } });
}; const wrapper = shallow(<FuelSavingsResults savings={savings}/>); const savingsLabelText = wrapper.find('.fuel-savings-label').text(); expect(savingsLabelText).toEqual('Savings'); }); }; const wrapper = shallow(<FuelSavingsResults savings={savings}/>); const numObjectsWithSavingsClass = wrapper.find('.savings').length; expect(numObjectsWithSavingsClass).toEqual(3); }); }; const wrapper = shallow(<FuelSavingsResults savings={savings}/>); const labelText = wrapper.find('.fuel-savings-label').text(); expect(labelText).toEqual('Loss'); }); }; const wrapper = shallow(<FuelSavingsResults savings={savings}/>); const numObjectsWithLossClass = wrapper.find('.loss').length; expect(numObjectsWithLossClass).toEqual(3); });
it('should submit appState', () => { const fuelSavings = getFuelSavings(); const onSaveClick = jest.fn(); const wrapper = shallow(<FuelSavingsForm onSaveClick={onSaveClick} onChange={jest.fn()} fuelSavings={fuelSavings} />); expect(onSaveClick).not.toBeCalled(); wrapper.find('input[type="submit"]').simulate('click'); expect(onSaveClick).toBeCalled(); });
test('renders correctly', () => { const wrapper = shallow( <App /> ); expect(toJson(wrapper)).toMatchSnapshot(); });
describe('SideBarBottom Component', () => { it('should match snapshot', () => { const tree = create(<SidebarBottom />).toJSON() expect(tree).toMatchSnapshot() }) it('should toggle options when clicked', () => { const wrapper = shallow(<SidebarBottom />) wrapper.find('.toggle-sb-options').simulate('click') expect(wrapper.state().showOptions).toBe(true) expect(wrapper.find('SidebarOptions').exists()).toBe(true) }) })
it('should contain <FuelSavingsResults /> when necessary conditions are met', () => { const fuelSavings = getFuelSavings({ necessaryDataIsProvidedToCalculateSavings: true, savings: { monthly: 10, annual: 120, threeYear: 360 } }); const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={jest.fn()} fuelSavings={fuelSavings} />); const expected = <FuelSavingsResults savings={fuelSavings.savings} />; expect(wrapper.contains(expected)).toBeTruthy(); });
it('should handle save button click', () => { const onSaveClick = jest.fn(); const wrapper = shallow(<FuelSavingsForm onSaveClick={onSaveClick} onChange={jest.fn()} fuelSavings={getFuelSavings()} />); expect(onSaveClick).not.toBeCalled(); wrapper.find('input[type="submit"]').simulate('click'); expect(onSaveClick).toBeCalled(); });