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(); + }); });