Add data-testid to preloader and spinner, add test case for profile.spec

frontend/app/components/preloader.tsx

@@ -6,5 +6,5 @@ type Props = {
 };
 
 export function Preloader({ className }: Props) {
-  return <div className={clsx('preloader', className)} aria-label="Loading..." />;
+  return <div className={clsx('preloader', className)} aria-label="Loading..." data-testid="preloader" />;
 }

frontend/app/components/profile/profile.spec.tsx

@@ -171,12 +171,25 @@ describe('<Profile />', () => {
       .spyOn(api, 'getUserComments')
       .mockImplementation(async () => ({ comments: new Array(10).fill(commentStub), count: 15 }));
 
-    const { findByRole, getByRole, queryByRole } = render(<Profile />);
+    const { findByRole, getByRole, queryByRole, queryByTestId } = render(<Profile />);
 
     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(<Profile />);
+
+    fireEvent.click(await findByRole('button', { name: /load more/i }));
+    expect(queryByTestId('preloader')).not.toBeInTheDocument();
   });
 });

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"
     />
   );
 }