{ const canvas = within(canvasElement); const textarea = canvas.getByPlaceholderText("Leave a reply..."); expect(canvas.queryByRole("button", { name: "Reply" })).toBeNull(); expect(canvas.queryByRole("switch")).toBeNull(); await userEvent.type(textarea, "first line{Shift>}{Enter}{/Shift}second line"); await expect(canvas.getByRole("button", { name: "Reply" })).toBeInTheDocument(); expect(canvas.queryByRole("button", { name: "Cancel" })).toBeNull(); await userEvent.clear(textarea); await waitFor(() => expect(canvas.queryByRole("button", { name: "Reply" })).toBeNull()); }} /> { const canvas = within(canvasElement); await userEvent.click( canvas.getByRole("button", { name: /more actions for alice\.tngl\.sh's comment/i }) ); await userEvent.click(await canvas.findByRole("menuitem", { name: "Edit comment" })); const textarea = await waitFor(() => canvas.getByPlaceholderText(/edit your comment/i)); await expect(textarea).toHaveValue(sampleComments.mine.body); await expect(canvas.getByRole("button", { name: "Save" })).toBeInTheDocument(); await expect(canvas.getByRole("button", { name: "Cancel" })).toBeInTheDocument(); }} /> { const canvas = within(canvasElement); await userEvent.click( canvas.getByRole("button", { name: /more actions for frank\.tngl\.sh's reply/i }) ); // the actions row fades in on real hover, which a synthetic pointer cannot do, so // assert the menu is in the tree rather than painted await expect( await canvas.findByRole("menuitem", { name: /report reply/i }) ).toBeInTheDocument(); await expect(canvas.getByRole("menuitem", { name: /report user/i })).toBeInTheDocument(); expect(canvas.queryByRole("button", { name: "Edit comment" })).toBeNull(); await userEvent.click( canvas.getByRole("button", { name: /more actions for erin\.tngl\.sh's comment/i }) ); await expect( await canvas.findByRole("menuitem", { name: /report comment/i }) ).toBeInTheDocument(); }} /> { const canvas = within(canvasElement); await userEvent.click( canvas.getByRole("button", { name: /more actions for alice\.tngl\.sh's comment/i }) ); await userEvent.click(await canvas.findByRole("menuitem", { name: "Edit comment" })); await waitFor(() => canvas.getByPlaceholderText(/edit your comment/i)); await expect(canvas.getByRole("button", { name: "Save" })).toBeInTheDocument(); expect(canvas.queryByRole("button", { name: /comment as/i })).toBeNull(); }} /> { const canvas = within(canvasElement); await expect(canvas.getByText("This account has been flagged.")).toBeInTheDocument(); expect(canvas.queryByText(/on the cusp/)).toBeNull(); expect(canvas.queryByPlaceholderText("Leave a reply...")).toBeNull(); }} /> { const canvas = within(canvasElement); await userEvent.click(canvas.getByRole("button", { name: "Show anyway" })); await expect(canvas.getByText(/on the cusp/)).toBeInTheDocument(); await expect(canvas.getByPlaceholderText("Leave a reply...")).toBeInTheDocument(); }} /> { const canvas = within(canvasElement); await expect( canvas.getByText("This account has been hidden by moderators.") ).toBeInTheDocument(); expect(canvas.queryByRole("button", { name: "Show anyway" })).toBeNull(); expect(canvas.queryByText(/to leave a reply/)).toBeNull(); }} /> { const canvas = within(canvasElement); expect(canvas.queryByText("This account has been hidden by moderators.")).toBeNull(); await expect(canvas.getByPlaceholderText("Leave a reply...")).toBeInTheDocument(); }} /> { const canvas = within(canvasElement); await expect(canvas.getByText("This comment has been flagged.")).toBeInTheDocument(); }} /> (read = { self: { ...thumbed }, replies: [] })}>Re-read (readBare = { ...soloThread, self: { ...soloThread.self } })} >Re-read