diff --git a/frontend/app/components/comment/comment-actions.spec.tsx b/frontend/app/components/comment/comment-actions.spec.tsx index 752291111b..48b1e5c5c5 100644 --- a/frontend/app/components/comment/comment-actions.spec.tsx +++ b/frontend/app/components/comment/comment-actions.spec.tsx @@ -35,7 +35,7 @@ describe('', () => { }); afterEach(() => { jest.resetAllMocks(); - }) + }); it('should render "Reply"', () => { render(); @@ -145,11 +145,11 @@ describe('', () => { }); it('calls `onToggleEditing` when edit button is pressed', () => { + props.editable = true; + props.editDeadline = Date.now() + 300 * 1000; render(); fireEvent(screen.getByText('Edit'), new MouseEvent('click', { bubbles: true })); expect(props.onToggleEditing).toHaveBeenCalledTimes(1); - fireEvent(screen.getByText('Cancel'), new MouseEvent('click', { bubbles: true })); - expect(props.onToggleEditing).toHaveBeenCalledTimes(2); - }) + }); }); }); diff --git a/frontend/app/components/comment/comment.test.tsx b/frontend/app/components/comment/comment.test.tsx index 51d05a5c6e..3e52f4713e 100644 --- a/frontend/app/components/comment/comment.test.tsx +++ b/frontend/app/components/comment/comment.test.tsx @@ -1,15 +1,18 @@ import { h } from 'preact'; import '@testing-library/jest-dom'; -import { screen } from '@testing-library/preact'; +import { fireEvent, screen, waitFor } from '@testing-library/preact'; import { useIntl, IntlShape } from 'react-intl'; import { render } from 'tests/utils'; import { StaticStore } from 'common/static-store'; import { Comment, CommentProps } from './comment'; +import { CommentMode } from 'common/types'; function CommentWithIntl(props: CommentProps) { - return ; + const intl = useIntl(); + + return ; } function getProps(): CommentProps { @@ -230,4 +233,26 @@ describe('', () => { render(); expect(screen.queryByRole('timer')).not.toBeInTheDocument(); }); + + it('toggles edit mode', async () => { + props = getProps(); + props.repliesCount = 0; + props.data.user = props.user!; + props.data.time = new Date().toString(); + props.setReplyEditState = jest.fn().mockImplementation(() => { + props.editMode = props.editMode === undefined ? CommentMode.Edit : CommentMode.None; + }); + StaticStore.config.edit_duration = 300; + const { rerender } = render(); + fireEvent(screen.getByText('Edit'), new MouseEvent('click', { bubbles: true })); + rerender(); + await waitFor(() => { + expect(screen.getByText('Cancel')).toBeVisible(); + }); + fireEvent(screen.getByText('Cancel'), new MouseEvent('click', { bubbles: true })); + rerender(); + await waitFor(() => { + expect(screen.getByText('Edit')).toBeVisible(); + }); + }); }); diff --git a/frontend/app/tests/utils.tsx b/frontend/app/tests/utils.tsx index 2ed50bbced..415aacaca9 100644 --- a/frontend/app/tests/utils.tsx +++ b/frontend/app/tests/utils.tsx @@ -8,9 +8,20 @@ import { mockStore } from '__stubs__/store'; import { StoreState } from 'store'; export function render(children: ComponentChild, s: Partial = {}) { - return originalRender( + const props = originalRender( {children} ); + + return { + ...props, + rerender(children: ComponentChild) { + props.rerender( + + {children} + + ); + }, + }; }