-
Notifications
You must be signed in to change notification settings - Fork 19
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'master' into paula/caseflow-1126-judge-tabs
- Loading branch information
Showing
12 changed files
with
245 additions
and
130 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -731,7 +731,7 @@ | |
| "DOCKET_SWITCH_REVIEW_REQUEST_PRIOR_TO_RAMP_DATE_ERROR": "Receipt date cannot be before 11/01/17", | ||
| "DOCKET_SWITCH_REVIEW_REQUEST_FUTURE_DATE_ERROR": "Receipt date cannot be in the future", | ||
| "DOCKET_SWITCH_RULING_TITLE": "Switch Docket: Rule on %s's Request", | ||
| "DOCKET_SWITCH_RULING_INSTRUCTIONS": "**Provided below is a summary of the pertinent facts used by the Office of the Clerk of the Board to prepare a docket switch ruling. Determine how you would like to rule on this request to switch dockets and select the corresponding button below.**\n\nThe hyperlink takes you to a draft ruling letter based on the recommended ruling. Please feel free to make any necessary edits to the ruling letter. You may then sign the letter. Inserting a hyperlink to a signed ruling letter is recommended, but optional.\n\nIf you have any questions, or need assistance making edits to the ruling letter, please [email](mailto:[email protected]) the Office of the Clerk of the Board or use the text box below to provide any additional context or instructions.\n\nWhen you click \"Confirm,\" the task will automatically be returned to the individual who assigned it to you. If you would like to return the task to a different individual, please use the drop down box to select a different name.", | ||
| "DOCKET_SWITCH_RULING_INSTRUCTIONS": "**Provided below is a summary of the pertinent facts used by the Office of the Clerk of the Board to prepare a docket switch ruling. Determine how you would like to rule on this request to switch dockets and select the corresponding button below.**\n\nThe hyperlink takes you to a draft ruling letter based on the recommended ruling. Please feel free to make any necessary edits to the ruling letter. You may then sign the letter.\n\nIf you have any questions, or need assistance making edits to the ruling letter, please [email](mailto:[email protected]) the Office of the Clerk of the Board or use the text box below to provide any additional context or instructions.\n\nWhen you click \"Confirm,\" the task will automatically be returned to the individual who assigned it to you. If you would like to return the task to a different individual, please use the drop down box to select a different name.", | ||
| "DOCKET_SWITCH_RULING_SUCCESS_TITLE": "You have %s %s's request to switch dockets", | ||
| "DOCKET_SWITCH_RULING_SUCCESS_MESSAGE": "This will be sent to the assigned member of the Office of the Clerk of the Board.", | ||
| "DOCKET_SWITCH_DENIAL_TITLE": "Switch Docket: Deny %s's Request", | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,131 @@ | ||
| import React from 'react'; | ||
| import { render, screen } from '@testing-library/react'; | ||
| import userEvent from '@testing-library/user-event'; | ||
| import { axe } from 'jest-axe'; | ||
|
|
||
| import Modal from 'app/components/Modal'; | ||
| import Button from 'app/components/Button'; | ||
|
|
||
| describe('Modal', () => { | ||
| const title = 'Test Modal Title'; | ||
| const modalBodyContent = 'This is text content'; | ||
| const closeHandler = jest.fn(); | ||
| const cancelMock = jest.fn(); | ||
| const confirmMock = jest.fn(); | ||
|
|
||
| const defaultProps = { | ||
| title, | ||
| closeHandler, | ||
| cancelButton: <Button onClick={cancelMock}> Cancel </Button>, | ||
| confirmButton: <Button onClick={confirmMock}> Confirm </Button>, | ||
| }; | ||
|
|
||
| const setupComponent = (props) => { | ||
| return render(<Modal {...defaultProps} {...props}> | ||
| <p>{modalBodyContent}</p> | ||
| </Modal>); | ||
| }; | ||
|
|
||
| it('renders correctly', () => { | ||
| const { container } = setupComponent(); | ||
|
|
||
| expect(container).toMatchSnapshot(); | ||
| }); | ||
|
|
||
| it('passes a11y testing', async () => { | ||
| const { container } = setupComponent(); | ||
|
|
||
| const results = await axe(container); | ||
|
|
||
| expect(results).toHaveNoViolations(); | ||
| }); | ||
|
|
||
| it('renders title', () => { | ||
| setupComponent(); | ||
|
|
||
| expect(screen.getByText(defaultProps.title)).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('renders body content', () => { | ||
| setupComponent(); | ||
|
|
||
| expect(screen.getByText(modalBodyContent)).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('renders divider if noDivider set to false', () => { | ||
| const { container } = setupComponent(); | ||
|
|
||
| // Not recommended way of testing but element does not have text, role, or id | ||
| expect(container.querySelector('.cf-modal-divider')).toBeTruthy(); | ||
| }); | ||
|
|
||
| it('does not render divider if noDivider set to true', () => { | ||
| const { container } = setupComponent({ noDivider: true }); | ||
|
|
||
| // Not recommended way of testing but element does not have text, role, or id | ||
| expect(container.querySelector('.cf-modal-divider')).toBeFalsy(); | ||
| }); | ||
|
|
||
| describe('buttons', () => { | ||
| it('renders close button', async() => { | ||
| const { container } = setupComponent(); | ||
| const closeButton = container.firstChild.firstChild.firstChild; | ||
|
|
||
| await userEvent.click(closeButton); | ||
|
|
||
| expect(closeButton).toBeInTheDocument(); | ||
| expect(defaultProps.closeHandler).toHaveBeenCalledTimes(1); | ||
| }); | ||
|
|
||
| it('renders cancel and confirm buttons', async() => { | ||
| setupComponent(); | ||
| const cancelButton = screen.getByText('Cancel'); | ||
| const confirmButton = screen.getByText('Confirm'); | ||
|
|
||
| expect(cancelButton).toBeInTheDocument(); | ||
| expect(confirmButton).toBeInTheDocument(); | ||
|
|
||
| confirmMock.mockClear(); | ||
| await userEvent.click(cancelButton); | ||
| expect(cancelMock).toHaveBeenCalledTimes(1); | ||
|
|
||
| await userEvent.click(confirmButton); | ||
| expect(confirmMock).toHaveBeenCalledTimes(1); | ||
| }); | ||
|
|
||
| it('renders array of buttons', async() => { | ||
| const props = { | ||
| title, | ||
| closeHandler, | ||
| buttons: [ | ||
| { | ||
| classNames: ['cf-modal-link', 'cf-btn-link'], | ||
| name: 'Cancel', | ||
| onClick: jest.fn(), | ||
| }, | ||
| { | ||
| classNames: ['usa-button'], | ||
| name: 'Edit', | ||
| onClick: jest.fn(), | ||
| }, | ||
| { | ||
| classNames: ['usa-button', 'usa-button-secondary'], | ||
| name: 'Continue', | ||
| onClick: jest.fn(), | ||
| } | ||
| ] | ||
| }; | ||
|
|
||
| render(<Modal {...props} />); | ||
|
|
||
| for (let button of props.buttons) { | ||
| const buttonElement = screen.getByText(button.name); | ||
|
|
||
| expect(buttonElement).toBeInTheDocument(); | ||
|
|
||
| await userEvent.click(buttonElement); | ||
| expect(button.onClick).toHaveBeenCalledTimes(1); | ||
| } | ||
| }); | ||
| }); | ||
| }); |
98 changes: 98 additions & 0 deletions
98
client/test/app/components/__snapshots__/Modal.test.js.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,98 @@ | ||
| // Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
|
||
| exports[`Modal renders correctly 1`] = ` | ||
| <div> | ||
| <section | ||
| aria-describedby="modal_id-desc" | ||
| aria-labelledby="modal_id-title" | ||
| aria-modal="true" | ||
| class="cf-modal active " | ||
| id="modal_id" | ||
| role="alertdialog" | ||
| > | ||
| <div | ||
| class="cf-modal-body" | ||
| id="" | ||
| > | ||
| <button | ||
| class="cf-modal-close" | ||
| id="Test-Modal-Title-button-id-close" | ||
| type="button" | ||
| > | ||
| <span | ||
| class="usa-sr-only" | ||
| > | ||
| Close | ||
| </span> | ||
| <svg | ||
| class="cf-icon-close" | ||
| height="55" | ||
| viewBox="0 0 55 55" | ||
| width="55" | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| > | ||
| <title> | ||
| close | ||
| </title> | ||
| <path | ||
| d="M52.6 46.9l-6 6c-.8.8-1.9 1.2-3 1.2s-2.2-.4-3-1.2l-13-13-13 13c-.8.8-1.9 1.2-3 1.2s-2.2-.4-3-1.2l-6-6c-.8-.8-1.2-1.9-1.2-3s.4-2.2 1.2-3l13-13-13-13c-.8-.8-1.2-1.9-1.2-3s.4-2.2 1.2-3l6-6c.8-.8 1.9-1.2 3-1.2s2.2.4 3 1.2l13 13 13-13c.8-.8 1.9-1.2 3-1.2s2.2.4 3 1.2l6 6c.8.8 1.2 1.9 1.2 3s-.4 2.2-1.2 3l-13 13 13 13c.8.8 1.2 1.9 1.2 3s-.4 2.2-1.2 3z" | ||
| /> | ||
| </svg> | ||
| </button> | ||
| <div | ||
| style="display: flex;" | ||
| > | ||
| <div | ||
| data-css-1gs0ko2="" | ||
| > | ||
| <h1 | ||
| id="modal_id-title" | ||
| > | ||
| Test Modal Title | ||
| </h1> | ||
| <div | ||
| data-css-o98ubo="" | ||
| > | ||
| <p> | ||
| This is text content | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div | ||
| class="cf-modal-divider" | ||
| /> | ||
| <div | ||
| class="cf-modal-controls" | ||
| > | ||
| <div> | ||
| <span | ||
| class="cf-push-right" | ||
| > | ||
| <span> | ||
| <button | ||
| class="cf-submit usa-button" | ||
| type="button" | ||
| > | ||
| Confirm | ||
| </button> | ||
| </span> | ||
| </span> | ||
| <span | ||
| class="cf-push-left" | ||
| > | ||
| <span> | ||
| <button | ||
| class="cf-submit usa-button" | ||
| type="button" | ||
| > | ||
| Cancel | ||
| </button> | ||
| </span> | ||
| </span> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </div> | ||
| `; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.