| author |  Wout Stiens <71498452+StiensWout@users.noreply.github.com> 2026-06-23 22:04:20+02:00 |
| committer |  GitHub <noreply@github.com> 2026-06-23 13:04:20-07:00 |
| log | a4964b3b363dc515fad04458e5936cd32053c659 |
| tree | aa55004d0dab1fceb314bdd0fc17d4265ecfd2d8 |
| parent | c6c64918f8c582cc8b12de155d6c9aae12037147 |
| signature | Signed by PGP key B5690EEEBB952194 |
[codex] fix: show standalone element-pick context (#3527)
Co-authored-by: Codex <codex@openai.com>2 files changed, 33 insertions(+), 2 deletions(-)
apps
web
src
components
apps/web/src/components/chat/MessagesTimeline.test.tsx+27
| ... | ... | @@ -193,6 +193,33 @@ describe("MessagesTimeline", () => { |
| 193 | 193 | expect(markup).toContain("Show full message"); |
| 194 | 194 | }, 20_000); |
| 195 | 195 | |
| 196 | it("renders chips for standalone element-pick context messages", async () => { | |
| 197 | const { MessagesTimeline } = await import("./MessagesTimeline"); | |
| 198 | const markup = renderToStaticMarkup( | |
| 199 | <MessagesTimeline | |
| 200 | {...buildProps()} | |
| 201 | timelineEntries={[ | |
| 202 | buildUserTimelineEntry( | |
| 203 | [ | |
| 204 | "<element_context>", | |
| 205 | "- <SubmitButton> (Button.tsx:12):", | |
| 206 | " url: https://example.com/dashboard", | |
| 207 | " selector: button.submit", | |
| 208 | " source: /repo/src/Button.tsx:12:5", | |
| 209 | " html:", | |
| 210 | ' <button class="submit">Save</button>', | |
| 211 | "</element_context>", | |
| 212 | ].join("\n"), | |
| 213 | ), | |
| 214 | ]} | |
| 215 | />, | |
| 216 | ); | |
| 217 | ||
| 218 | expect(markup).toContain("SubmitButton"); | |
| 219 | expect(markup).not.toContain("<element_context"); | |
| 220 | expect(markup).not.toContain("<element_context"); | |
| 221 | }); | |
| 222 | ||
| 196 | 223 | it("keeps the copy button for collapsed long user messages", async () => { |
| 197 | 224 | const { MessagesTimeline } = await import("./MessagesTimeline"); |
| 198 | 225 | const markup = renderToStaticMarkup( |
apps/web/src/components/chat/MessagesTimeline.tsx+6-2
| ... | ... | @@ -448,6 +448,10 @@ function UserTimelineRow({ row }: { row: Extract<TimelineRow, { kind: "message" |
| 448 | 448 | visibleText = extracted.promptText; |
| 449 | 449 | } |
| 450 | 450 | const elementContextState = extractTrailingElementContexts(visibleText); |
| 451 | const elementContexts = [ | |
| 452 | ...displayedUserMessage.elementContexts, | |
| 453 | ...elementContextState.contexts, | |
| 454 | ]; | |
| 451 | 455 | const previewImages = userImages.filter((image) => image.name.startsWith("preview-annotation-")); |
| 452 | 456 | const regularImages = userImages.filter((image) => !image.name.startsWith("preview-annotation-")); |
| 453 | 457 | const canRevertAgentWork = typeof row.revertTurnCount === "number"; |
| ... | ... | @@ -495,9 +499,9 @@ function UserTimelineRow({ row }: { row: Extract<TimelineRow, { kind: "message" |
| 495 | 499 | image={previewImages[index] ?? null} |
| 496 | 500 | /> |
| 497 | 501 | ))} |
| 498 | {elementContextState.contexts.length > 0 ? ( | |
| 502 | {elementContexts.length > 0 ? ( | |
| 499 | 503 | <div className="mb-2 flex flex-wrap gap-1.5"> |
| 500 | {elementContextState.contexts.map((context) => ( | |
| 504 | {elementContexts.map((context) => ( | |
| 501 | 505 | <UserMessageElementContextChip |
| 502 | 506 | key={`${context.header}:${context.body}`} |
| 503 | 507 | context={context} |