homehub/packages/homehub_app/tests/main/components/AddDashboardModal.spec.js
2021-08-26 12:33:15 +02:00

124 lines
3.3 KiB
JavaScript

import {shallow} from 'enzyme';
import React from 'react';
import {Button, Form, Modal} from 'src/components';
import * as AddDashboardModal from 'src/main/components/AddDashboardModal';
describe('src/main/components/AddDashboardModal', () => {
describe('AddDashboardModal', () => {
let mockOnClose = null;
let mockOnSave = null;
beforeEach(() => {
mockOnClose = jasmine.createSpy();
mockOnSave = jasmine.createSpy();
});
it('closes the modal when it hides', async () => {
// Given
const component = shallow(
<AddDashboardModal.AddDashboardModal
show={true}
onClose={mockOnClose}
onSave={mockOnSave}
/>
);
// When
component.find(Form.Control).at(0).simulate(
'change', {target: {value: 'spam'}}
);
const modal = component.find(Modal).at(0);
await modal.invoke('onHide')();
// Then
expect(component.find(Form.Control).at(0).prop('value')).toEqual('');
expect(mockOnClose).toHaveBeenCalled();
});
it('configures and renders the name input', () => {
// Given
const component = shallow(
<AddDashboardModal.AddDashboardModal
show={true}
onClose={mockOnClose}
onSave={mockOnSave}
/>
);
// When
const nameInput = component.find(Form.Control).at(0);
// Then
expect(nameInput.exists()).toBe(true);
expect(nameInput.prop('value')).toEqual('');
});
it('updates the state when name input changes', () => {
// Given
const component = shallow(
<AddDashboardModal.AddDashboardModal
show={true}
onClose={mockOnClose}
onSave={mockOnSave}
/>
);
// When
component.find(Form.Control).at(0).simulate(
'change', {target: {value: 'spam'}}
);
// Then
const nameInput = component.find(Form.Control).at(0);
expect(nameInput.prop('value')).toEqual('spam');
});
it('closes the modal when cancel button is clicked', () => {
// Given
const component = shallow(
<AddDashboardModal.AddDashboardModal
show={true}
onClose={mockOnClose}
onSave={mockOnSave}
/>
);
// When
component.find(Form.Control).at(0).simulate(
'change', {target: {value: 'spam'}}
);
component.find(Button).at(0).simulate('click');
// Then
const nameInput = component.find(Form.Control).at(0);
expect(nameInput.prop('value')).toEqual('');
expect(mockOnClose).toHaveBeenCalled();
});
it('saves and closes the modal when the save button is clicked', () => {
// Given
const component = shallow(
<AddDashboardModal.AddDashboardModal
show={true}
onClose={mockOnClose}
onSave={mockOnSave}
/>
);
// When
component.find(Form.Control).at(0).simulate(
'change', {target: {value: 'spam'}}
);
component.find(Button).at(1).simulate('click');
// Then
const nameInput = component.find(Form.Control).at(0);
expect(nameInput.prop('value')).toEqual('');
expect(mockOnSave).toHaveBeenCalledWith('spam');
expect(mockOnClose).toHaveBeenCalled();
});
});
});