Skip to content

Commit

Permalink
MPDX-8120 - Tools - Replacing await waitFor(...) with findBy... (#1017)
Browse files Browse the repository at this point in the history 
* Replacing await waitFor(...) with findBy...
  • Loading branch information
@dr-bizz
dr-bizz authored Aug 30, 2024
1 parent 71d517c commit 7dae0ac
Show file tree
Hide file tree
Showing 10 changed files with 139 additions and 158 deletions.
32 changes: 14 additions & 18 deletions src/components/Tool/Appeal/AppealDetails/AppealProgressBar/AppealProgressBar.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ describe('AppealProgressBar', () => {

describe('Renders correct amounts and currency', () => {
it('renders progress bar in USD', async () => {
const { getByText } = render(
const { getByText, findByText } = render(
<Components
given={100}
received={200}
Expand All @@ -86,15 +86,14 @@ describe('AppealProgressBar', () => {
/>,
);

await waitFor(() => {
expect(getByText(/\$100 \(10%\)/i)).toBeInTheDocument();
expect(getByText(/\$300 \(30%\)/i)).toBeInTheDocument();
expect(getByText(/\$600 \(60%\)/i)).toBeInTheDocument();
});
expect(await findByText(/\$100 \(10%\)/i)).toBeInTheDocument();

expect(getByText(/\$300 \(30%\)/i)).toBeInTheDocument();
expect(getByText(/\$600 \(60%\)/i)).toBeInTheDocument();
});

it('renders progress bar in Euros', async () => {
const { getByText } = render(
const { getByText, findByText } = render(
<Components
given={100}
received={200}
Expand All @@ -104,15 +103,14 @@ describe('AppealProgressBar', () => {
/>,
);

await waitFor(() => {
expect(getByText(/\€100 \(10%\)/i)).toBeInTheDocument();
expect(getByText(/\€300 \(30%\)/i)).toBeInTheDocument();
expect(getByText(/\€600 \(60%\)/i)).toBeInTheDocument();
});
expect(await findByText(/\€100 \(10%\)/i)).toBeInTheDocument();

expect(getByText(/\€300 \(30%\)/i)).toBeInTheDocument();
expect(getByText(/\€600 \(60%\)/i)).toBeInTheDocument();
});

it('renders progress bar in NZ dollars', async () => {
const { getByText } = render(
const { getByText, findByText } = render(
<Components
given={100}
received={200}
Expand All @@ -122,11 +120,9 @@ describe('AppealProgressBar', () => {
/>,
);

await waitFor(() => {
expect(getByText(/nz\$100 \(10%\)/i)).toBeInTheDocument();
expect(getByText(/nz\$300 \(30%\)/i)).toBeInTheDocument();
expect(getByText(/nz\$600 \(60%\)/i)).toBeInTheDocument();
});
expect(await findByText(/nz\$100 \(10%\)/i)).toBeInTheDocument();
expect(getByText(/nz\$300 \(30%\)/i)).toBeInTheDocument();
expect(getByText(/nz\$600 \(60%\)/i)).toBeInTheDocument();
});
});
});
85 changes: 39 additions & 46 deletions src/components/Tool/Appeal/AppealDetails/AppealsDetailsPage.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -117,39 +117,41 @@ const Components = ({ router = defaultRouter }: { router?: object }) => (
describe('AppealsDetailsPage', () => {
describe('Contact drawer', () => {
it('should open and close on List view', async () => {
const { getByText, findByTestId, getByRole, getAllByRole, queryByRole } =
render(
<Components
router={{
...defaultRouter,
query: {
...defaultRouter.query,
appealId: ['1', 'list'],
},
}}
/>,
);

await waitFor(() => expect(getByText('Test Person')).toBeInTheDocument());
const {
findByTestId,
findByText,
findByRole,
getAllByRole,
queryByRole,
} = render(
<Components
router={{
...defaultRouter,
query: {
...defaultRouter.query,
appealId: ['1', 'list'],
},
}}
/>,
);

expect(await findByText('Test Person')).toBeInTheDocument();

expect(queryByRole('tab', { name: 'Tasks' })).not.toBeInTheDocument();

const contactRow = await findByTestId('rowButton');
userEvent.click(contactRow);

await waitFor(() =>
expect(getByRole('tab', { name: 'Tasks' })).toBeInTheDocument(),
);

userEvent.click(getAllByRole('img', { name: 'Close' })[0]);
expect(await findByRole('tab', { name: 'Tasks' })).toBeInTheDocument(),
userEvent.click(getAllByRole('img', { name: 'Close' })[0]);

await waitFor(() =>
expect(queryByRole('tab', { name: 'Tasks' })).not.toBeInTheDocument(),
);
});

it('should open and close on Flows view', async () => {
const { getAllByText, getByRole, queryByRole } = render(
const { getAllByText, getByRole, findByRole, queryByRole } = render(
<Components
router={{
...defaultRouter,
Expand All @@ -167,10 +169,7 @@ describe('AppealsDetailsPage', () => {

userEvent.click(getAllByText('Test Person')[0]);

await waitFor(() =>
expect(getByRole('tab', { name: 'Tasks' })).toBeInTheDocument(),
);

expect(await findByRole('tab', { name: 'Tasks' })).toBeInTheDocument();
userEvent.click(getByRole('img', { name: 'Close' }));

await waitFor(() =>
Expand All @@ -181,7 +180,7 @@ describe('AppealsDetailsPage', () => {

describe('Filters', () => {
it('should open and close on List view', async () => {
const { getByRole, queryByRole } = render(
const { getByRole, findByRole, queryByRole } = render(
<Components
router={{
...defaultRouter,
Expand All @@ -193,22 +192,19 @@ describe('AppealsDetailsPage', () => {
/>,
);

await waitFor(() =>
expect(
getByRole('img', { name: /toggle filter panel/i }),
).toBeInTheDocument(),
);
expect(
await findByRole('img', { name: /toggle filter panel/i }),
).toBeInTheDocument();

expect(
queryByRole('heading', { name: /export to csv/i }),
).not.toBeInTheDocument();

userEvent.click(getByRole('img', { name: /toggle filter panel/i }));

await waitFor(() =>
expect(
getByRole('heading', { name: /export to csv/i }),
).toBeInTheDocument(),
);
expect(
await findByRole('heading', { name: /export to csv/i }),
).toBeInTheDocument();

userEvent.click(getByRole('img', { name: 'Close' }));

Expand All @@ -220,7 +216,7 @@ describe('AppealsDetailsPage', () => {
});

it('should open and close on Flows view', async () => {
const { getByRole, queryByRole } = render(
const { getByRole, findByRole, queryByRole } = render(
<Components
router={{
...defaultRouter,
Expand All @@ -232,22 +228,19 @@ describe('AppealsDetailsPage', () => {
/>,
);

await waitFor(() =>
expect(
getByRole('img', { name: /toggle filter panel/i }),
).toBeInTheDocument(),
);
expect(
await findByRole('img', { name: /toggle filter panel/i }),
).toBeInTheDocument();

expect(
queryByRole('heading', { name: /see more filters/i }),
).not.toBeInTheDocument();

userEvent.click(getByRole('img', { name: /toggle filter panel/i }));

await waitFor(() =>
expect(
getByRole('heading', { name: /see more filters/i }),
).toBeInTheDocument(),
);
expect(
await findByRole('heading', { name: /see more filters/i }),
).toBeInTheDocument();

userEvent.click(getByRole('img', { name: 'Close' }));

Expand Down
36 changes: 19 additions & 17 deletions src/components/Tool/Appeal/AppealsContext/AppealsContext.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ const TestRenderContactsFilters: React.FC = () => {

describe('ContactsPageContext', () => {
it('should open a contact and the URL should reflect the opened contact', async () => {
const { getByText } = render(
const { getByText, findByText } = render(
<ThemeProvider theme={theme}>
<TestRouter
router={{
Expand Down Expand Up @@ -142,13 +142,15 @@ describe('ContactsPageContext', () => {
);

expect(getByText('Loading')).toBeInTheDocument();
await waitFor(() =>
expect(getByText(`appealId: ${appealIdentifier}`)).toBeInTheDocument(),
);
userEvent.click(getByText('Open Contact'));
await waitFor(() =>
expect(getByText(`contactDetailsId: ${contactId}`)).toBeInTheDocument(),
);

expect(
await findByText(`appealId: ${appealIdentifier}`),
).toBeInTheDocument(),
userEvent.click(getByText('Open Contact'));

expect(
await findByText(`contactDetailsId: ${contactId}`),
).toBeInTheDocument();
await waitFor(() =>
expect(push).toHaveBeenCalledWith({
pathname:
Expand All @@ -159,7 +161,7 @@ describe('ContactsPageContext', () => {
});

it('should switch views to flows and back to list', async () => {
const { getByText } = render(
const { getByText, findByText } = render(
<ThemeProvider theme={theme}>
<TestRouter
router={{
Expand Down Expand Up @@ -190,9 +192,9 @@ describe('ContactsPageContext', () => {
</TestRouter>
</ThemeProvider>,
);
await waitFor(() => expect(getByText('Flows Button')).toBeInTheDocument());
expect(await findByText('Flows Button')).toBeInTheDocument();
userEvent.click(getByText('Flows Button'));
await waitFor(() => expect(getByText('flows')).toBeInTheDocument());
expect(await findByText('flows')).toBeInTheDocument();
await waitFor(() =>
expect(push).toHaveBeenCalledWith({
pathname:
Expand All @@ -202,7 +204,7 @@ describe('ContactsPageContext', () => {
);

userEvent.click(getByText('List Button'));
await waitFor(() => expect(getByText('list')).toBeInTheDocument());
expect(await findByText('list')).toBeInTheDocument();
await waitFor(() =>
expect(push).toHaveBeenCalledWith({
pathname:
Expand All @@ -213,7 +215,7 @@ describe('ContactsPageContext', () => {
});

it('should redirect back to flows view on contact page', async () => {
const { getByText } = render(
const { getByText, findByText } = render(
<ThemeProvider theme={theme}>
<TestRouter
router={{
Expand Down Expand Up @@ -248,11 +250,11 @@ describe('ContactsPageContext', () => {
</ThemeProvider>,
);
expect(getByText('Loading')).toBeInTheDocument();
await waitFor(() =>
expect(getByText(`contactDetailsId: ${contactId}`)).toBeInTheDocument(),
);

await waitFor(() => expect(getByText('Close Contact')).toBeInTheDocument());
expect(
await findByText(`contactDetailsId: ${contactId}`),
).toBeInTheDocument();
expect(await findByText('Close Contact')).toBeInTheDocument();
userEvent.click(getByText('Close Contact'));

await waitFor(() =>
Expand Down
12 changes: 6 additions & 6 deletions src/components/Tool/Appeal/Flow/ContactFlow.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,13 +76,13 @@ const Components = (props: ContactFlowProps) => (

describe('ContactFlow', () => {
it('default', async () => {
const { getByText } = render(<Components {...initialProps} />);
const { getByText, findByText } = render(<Components {...initialProps} />);

await waitFor(() => expect(getByText('Excluded')).toBeInTheDocument());
await waitFor(() => expect(getByText('Asked')).toBeInTheDocument());
await waitFor(() => expect(getByText('Committed')).toBeInTheDocument());
await waitFor(() => expect(getByText('Received‌⁠')).toBeInTheDocument());
await waitFor(() => expect(getByText('Given')).toBeInTheDocument());
expect(await findByText('Excluded')).toBeInTheDocument();
expect(getByText('Asked')).toBeInTheDocument();
expect(getByText('Committed')).toBeInTheDocument();
expect(getByText('Received‌⁠')).toBeInTheDocument();
expect(getByText('Given')).toBeInTheDocument();
});

it('Drag and drop', async () => {
Expand Down
10 changes: 6 additions & 4 deletions src/components/Tool/Appeal/Flow/ContactFlowColumn/ContactFlowColumn.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,8 @@ const Components = () => (

describe('ContactFlowColumn', () => {
it('should render a column with correct details', async () => {
const { getByText, getByTestId } = render(<Components />);
await waitFor(() => expect(getByText(title)).toBeInTheDocument());
const { getByText, findByText, getByTestId } = render(<Components />);
expect(await findByText(title)).toBeInTheDocument();
expect(getByText('1')).toBeInTheDocument();
expect(getByText('Test Person')).toBeInTheDocument();
expect(getByTestId('column-header')).toHaveStyle({
Expand All @@ -83,9 +83,11 @@ describe('ContactFlowColumn', () => {
});

it('should open menu', async () => {
const { getByText, getByTestId, getByRole } = render(<Components />);
const { getByText, findByText, getByTestId, getByRole } = render(
<Components />,
);

await waitFor(() => expect(getByText(title)).toBeInTheDocument());
expect(await findByText(title)).toBeInTheDocument();

userEvent.click(getByTestId('MoreVertIcon'));
expect(getByText('Not Interested')).toBeInTheDocument();
Expand Down
Loading

0 comments on commit 7dae0ac

Please sign in to comment.