v4: a comment and a chat message are edited in the same field as every text edited in place — each had an editor of its own: a comment's was its reply form, which showed a refused edit as a card and left the focus nowhere once closed, and a chat message's a box of its own with its own buttons and rules. InlineEdit gives its field, InlineEditField, to the components that open it with an action of their own, as these two do with their Edit and ✎: they keep those, a click on someone's message being no request to edit it. The field opens on the text with the caret at its end and as tall as the text, saves on Ctrl+Enter (and on Enter in the chat, where Shift+Enter breaks a line, as in its composer), leaves on Escape, sends nothing for a text left as it was, refuses an empty one, says why a save was refused in one line, and gives the focus back to the button that opened it, unless the caller has put it elsewhere, as the chat does to its composer. CommentForm only posts a comment or a reply now; ChatEditBox keeps only what is the chat's, scrolling itself into the list's view.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -191,6 +191,21 @@ describe("CommentThread", () => {
|
||||
expect(calls("PATCH /api/comments/:id")).toHaveLength(0);
|
||||
});
|
||||
|
||||
test("a refused edit stays open and says why; Escape goes back to Edit", async () => {
|
||||
route("PATCH /api/comments/:id", () => fail("Too spicy", 400));
|
||||
const user = setup([makeComment({ id: "a", userId: "me", body: "old" })]);
|
||||
await user.click(screen.getByRole("button", { name: "Edit" }));
|
||||
await user.type(
|
||||
screen.getByDisplayValue("old"),
|
||||
"er{Control>}{Enter}{/Control}",
|
||||
);
|
||||
expect(await screen.findByRole("alert")).toHaveTextContent("Too spicy");
|
||||
expect(screen.getByDisplayValue("older")).toBeInTheDocument();
|
||||
await user.keyboard("{Escape}");
|
||||
expect(screen.getByText("old")).toBeInTheDocument();
|
||||
expect(screen.getByRole("button", { name: "Edit" })).toHaveFocus();
|
||||
});
|
||||
|
||||
test("only the author or a moderator can edit and delete", () => {
|
||||
const comments = [
|
||||
makeComment({ id: "mine", userId: "me", body: "mine" }),
|
||||
|
||||
Reference in New Issue
Block a user