confirmDelete.spec.jsx 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. import React from 'react';
  2. import {mount} from 'enzyme';
  3. import ConfirmDelete from 'app/components/confirmDelete';
  4. describe('ConfirmDelete', function() {
  5. it('renders', function() {
  6. const mock = jest.fn();
  7. const wrapper = mount(
  8. <ConfirmDelete message="Are you sure?" onConfirm={mock} confirmInput="CoolOrg">
  9. <button>Confirm?</button>
  10. </ConfirmDelete>,
  11. TestStubs.routerContext()
  12. );
  13. wrapper.find('button').simulate('click');
  14. // jest had an issue rendering root component snapshot so using ModalDialog instead
  15. expect(wrapper.find('ModalDialog')).toMatchSnapshot();
  16. });
  17. it('confirm button is disabled and bypass prop is false when modal opens', function() {
  18. const mock = jest.fn();
  19. const wrapper = mount(
  20. <ConfirmDelete message="Are you sure?" onConfirm={mock} confirmInput="CoolOrg">
  21. <button>Confirm?</button>
  22. </ConfirmDelete>,
  23. TestStubs.routerContext()
  24. );
  25. wrapper.find('button').simulate('click');
  26. expect(wrapper.find('Confirm').prop('bypass')).toBe(false);
  27. expect(wrapper.state('disableConfirmButton')).toBe(true);
  28. });
  29. it('confirm button stays disabled with non-matching input', function() {
  30. const mock = jest.fn();
  31. const wrapper = mount(
  32. <ConfirmDelete message="Are you sure?" onConfirm={mock} confirmInput="CoolOrg">
  33. <button>Confirm?</button>
  34. </ConfirmDelete>,
  35. TestStubs.routerContext()
  36. );
  37. wrapper.find('button').simulate('click');
  38. wrapper.find('input').simulate('change', {target: {value: 'Cool'}});
  39. expect(wrapper.find('Confirm').prop('disableConfirmButton')).toBe(true);
  40. });
  41. it('confirm button is enabled when confirm input matches', function() {
  42. const mock = jest.fn();
  43. const wrapper = mount(
  44. <ConfirmDelete message="Are you sure?" onConfirm={mock} confirmInput="CoolOrg">
  45. <button>Confirm?</button>
  46. </ConfirmDelete>,
  47. TestStubs.routerContext()
  48. );
  49. wrapper.find('button').simulate('click');
  50. wrapper.find('input').simulate('change', {target: {value: 'CoolOrg'}});
  51. expect(wrapper.find('Confirm').prop('disableConfirmButton')).toBe(false);
  52. wrapper
  53. .find('Button')
  54. .last()
  55. .simulate('click');
  56. expect(
  57. wrapper
  58. .find('Modal')
  59. .first()
  60. .prop('show')
  61. ).toBe(false);
  62. expect(mock).toHaveBeenCalled();
  63. expect(mock.mock.calls).toHaveLength(1);
  64. });
  65. });