diff --git a/src/discussions/posts/post/PostFooter.jsx b/src/discussions/posts/post/PostFooter.jsx
index 45628f47..8aa8c810 100644
--- a/src/discussions/posts/post/PostFooter.jsx
+++ b/src/discussions/posts/post/PostFooter.jsx
@@ -37,21 +37,17 @@ function PostFooter({
)}
>
- {preview
- ?
- : (
- {
- dispatch(updateExistingThread(post.id, { following: !post.following }));
- return true;
- }}
- alt="Follow"
- iconAs={Icon}
- size="inline"
- className="mx-2.5 my-0"
- src={post.following ? StarFilled : StarOutline}
- />
- )}
+ {
+ dispatch(updateExistingThread(post.id, { following: !post.following }));
+ return true;
+ }}
+ alt="Follow"
+ iconAs={Icon}
+ size="inline"
+ className="mx-2.5 my-0"
+ src={post.following ? StarFilled : StarOutline}
+ />
{preview && post.commentCount > 1
&& (
diff --git a/src/discussions/posts/post/PostFooter.test.jsx b/src/discussions/posts/post/PostFooter.test.jsx
index 7ff4ac8c..646b2f9d 100644
--- a/src/discussions/posts/post/PostFooter.test.jsx
+++ b/src/discussions/posts/post/PostFooter.test.jsx
@@ -1,11 +1,14 @@
import React from 'react';
-import { render, screen } from '@testing-library/react';
+import {
+ act, fireEvent, render, screen,
+} from '@testing-library/react';
import { IntlProvider } from 'react-intl';
import { initializeMockApp } from '@edx/frontend-platform';
import { AppProvider } from '@edx/frontend-platform/react';
+import { RequestStatus } from '../../../data/constants';
import { initializeStore } from '../../../store';
import PostFooter from './PostFooter';
@@ -81,4 +84,18 @@ describe('PostFooter', () => {
renderComponent({ ...mockPost, groupId: 5, groupName: 'Test Cohort' });
expect(screen.getByTestId('cohort-icon')).toBeTruthy();
});
+ it.each([[true, /unfollow/i], [false, /follow/i]])('test follow button when following=%s', async (following, message) => {
+ renderComponent({ ...mockPost, following });
+ const followButton = screen.getByRole('button', { name: /follow/i });
+ expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
+ await act(async () => {
+ fireEvent.mouseEnter(followButton);
+ });
+ expect(screen.getByRole('tooltip')).toHaveTextContent(message);
+ await act(async () => {
+ fireEvent.click(followButton);
+ });
+ // clicking on the button triggers thread update.
+ expect(store.getState().threads.status === RequestStatus.IN_PROGRESS).toBeTruthy();
+ });
});