Skip to content

Commit

Permalink
jest test for ErrorsFoundAndCorrectedModal
Browse files Browse the repository at this point in the history
  • Loading branch information
wmedders21 committed Oct 23, 2024
1 parent 2e12335 commit cbef30e
Show file tree
Hide file tree
Showing 2 changed files with 239 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
import React from 'react';
import { render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { axe } from 'jest-axe';

import ErrorsFoundAndCorrectedModal from 'app/hearings/components/ErrorsFoundAndCorrectedModal';

describe('ErrorsFoundAndCorrectedModal', () => {
const closeModal = jest.fn();

const defaultProps = {
taskId: '1000',
closeModal
};

it('renders correctly', () => {
const { container } = render(<ErrorsFoundAndCorrectedModal {...defaultProps} />);

expect(container).toMatchSnapshot();
});

it('passes a11y testing', async () => {
const { container } = render(<ErrorsFoundAndCorrectedModal {...defaultProps} />);

const results = await axe(container);

expect(results).toHaveNoViolations();
});

it('displays the default page elements with default props', () => {
render(
<ErrorsFoundAndCorrectedModal {...defaultProps} />
);

const textarea = screen.getByRole('textbox');

expect(screen.getByText('Upload transcript to VBMS')).toBeInTheDocument();
expect(screen.getByText('Please upload the revised transcript file for upload to VBMS.')).
toBeInTheDocument();
expect(screen.getByText('Please select PDF')).toBeInTheDocument();
expect(screen.getByText('Choose from folder')).toBeInTheDocument();
expect(screen.getByText('Please provide context and instructions for this action')).
toBeInTheDocument();
expect(textarea.value).toBe('');
});

it('can handle a file upload', async () => {
const file = new File(['test'], 'test.pdf', { type: 'application/pdf' });

render(
<ErrorsFoundAndCorrectedModal {...defaultProps} />
);

const input = screen.getByLabelText(/Choose from folder/i);

userEvent.upload(input, file);

await waitFor(() => {
expect(input.files.length).toBe(1);
expect(screen.getByText('test.pdf')).toBeInTheDocument();
expect(screen.getByText('Selected file')).toBeInTheDocument();
expect(screen.getByText('Change file')).toBeInTheDocument();
});
});

it('the submit button is enabled when fields filled out', async () => {
const file = new File(['test'], 'test.pdf', { type: 'application/pdf' });

render(
<ErrorsFoundAndCorrectedModal {...defaultProps} />
);

expect(screen.getByText('Upload to VBMS').closest('button')).
toBeDisabled();

const input = screen.getByLabelText(/Choose from folder/i);
const textarea = screen.getByRole('textbox');

userEvent.upload(input, file);

await waitFor(() => {
expect(screen.getByText('Upload to VBMS').closest('button')).
toBeDisabled();
});

userEvent.type(textarea, 'This is a note.');

await waitFor(() => {
expect(screen.getByText('Upload to VBMS').closest('button')).
toBeEnabled();
});
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,146 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`ErrorsFoundAndCorrectedModal 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="dialog"
>
<div
class="cf-modal-body"
id=""
>
<button
class="cf-modal-close"
id="Upload-transcript-to-VBMS-button-id-close"
type="button"
>
<span
class="usa-sr-only"
>
Close
</span>
<svg
class="cf-icon-close"
height="55"
viewBox="0 0 55 55"
xmlns="http://www.w3.org/2000/svg"
>
<title>
close
</title>
<g
fill="#212121"
>
<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"
/>
</g>
</svg>
</button>
<div
style="display: flex; flex-wrap: wrap;"
>
<h1
id="modal_id-title"
style="flex: 1;"
>
Upload transcript to VBMS
</h1>
<div
data-css-2flkvz=""
>
<p>
Please upload the revised transcript file for upload to VBMS.
</p>
<strong
style="color: black;"
>
Please select PDF
</strong>
<div
class="cf-file-input-container"
>
<div>
<label
for="cf-file-input"
>
<a>
Choose from folder
</a>
</label>
<div
data-css-gyrv08=""
>
<input
accept=".pdf"
id="cf-file-input"
type="file"
/>
</div>
</div>
</div>
<div
class="comment-size-container"
>
<div
class="cf-form-textarea"
>
<label
class="question-label"
for="cf-form-textarea"
>
<span>
Please provide context and instructions for this action
</span>
</label>
<textarea
id="cf-form-textarea"
name="Please provide context and instructions for this action"
/>
</div>
</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-disabled usa-button"
disabled=""
type="button"
>
Upload to VBMS
</button>
</span>
</span>
<span
class="cf-push-left"
>
<span>
<button
class="cf-submit cf-btn-link usa-button"
type="button"
>
Cancel
</button>
</span>
</span>
</div>
</div>
</div>
</section>
</div>
`;

0 comments on commit cbef30e

Please sign in to comment.