diff --git a/frontend/app/components/preloader.tsx b/frontend/app/components/preloader.tsx
index bbe34bed..9fca0f8e 100644
--- a/frontend/app/components/preloader.tsx
+++ b/frontend/app/components/preloader.tsx
@@ -6,5 +6,5 @@ type Props = {
};
export function Preloader({ className }: Props) {
- return
;
+ return ;
}
diff --git a/frontend/app/components/profile/profile.spec.tsx b/frontend/app/components/profile/profile.spec.tsx
index 923da6de..bc01b5ac 100644
--- a/frontend/app/components/profile/profile.spec.tsx
+++ b/frontend/app/components/profile/profile.spec.tsx
@@ -171,12 +171,25 @@ describe('', () => {
.spyOn(api, 'getUserComments')
.mockImplementation(async () => ({ comments: new Array(10).fill(commentStub), count: 15 }));
- const { findByRole, getByRole, queryByRole } = render();
+ const { findByRole, getByRole, queryByRole, queryByTestId } = render();
expect(await findByRole('button', { name: /load more/i })).toBeInTheDocument();
fireEvent.click(getByRole('button', { name: /load more/i }));
- expect(getByRole('presentation')).toHaveClass('spinner');
- await waitFor(() => expect(queryByRole('presentation')).not.toBeInTheDocument());
- expect(queryByRole('button', { name: /load more/i })).not.toBeInTheDocument();
+ expect(queryByTestId('spinner')).toBeInTheDocument();
+
+ await waitFor(() => {
+ expect(queryByRole('button', { name: /load more/i })).not.toBeInTheDocument();
+ });
+ });
+
+ it('preloader should not be rendered after click on load more button', async () => {
+ jest
+ .spyOn(api, 'getUserComments')
+ .mockImplementation(async () => ({ comments: new Array(10).fill(commentStub), count: 15 }));
+
+ const { findByRole, queryByTestId } = render();
+
+ fireEvent.click(await findByRole('button', { name: /load more/i }));
+ expect(queryByTestId('preloader')).not.toBeInTheDocument();
});
});
diff --git a/frontend/app/components/spinner/spinner.tsx b/frontend/app/components/spinner/spinner.tsx
index f4450243..e972b43f 100644
--- a/frontend/app/components/spinner/spinner.tsx
+++ b/frontend/app/components/spinner/spinner.tsx
@@ -17,6 +17,7 @@ export function Spinner({ color }: Props) {
className={clsx('spinner', styles.root, { [styles.dark]: color === 'gray' })}
role="presentation"
aria-label={intl.formatMessage(messages.loading)}
+ data-testid="spinner"
/>
);
}