fix(web): handle the 2026-09 ChatGPT redesign (composer, send, turns, blob: images)

[leeguooooo]

Fixes #41

ChatGPT's redesigned chat UI (rolling out per account) removed every DOM hook the web backend used. This keeps the legacy selectors and adds the redesigned ones next to them.

	legacy	redesign
composer	#prompt-textarea	form div.ProseMirror[contenteditable=true]
send	button[data-testid=send-button]	button[type=submit], localized label (发送)
turns	[data-message-author-role]	div[data-turn-key] + [data-user-message-bubble] + h4[data-conversation-role=assistant], whole thread rendered twice
result	<img src=…estuary/content…>	<img src="blob:https://chatgpt.com/…"> in [data-testid=generated-image-preview]

Changes

• Selectors are WEB_*_SEL constants, shared by the page JS and the chrome-use fill/click commands.
• Send is scoped to the composer's form (form:has(div.ProseMirror…)) and excludes voice/dictation buttons.
• User turns are counted per distinct data-turn-key, so the doubled render and nested markers count once.
• A redesigned reply counts only once it has content (markdown or image gallery), not just the heading.
• blob: results are accepted once decoded and downloaded inside the page. If the blob was revoked, the page re-encodes the decoded <img> as PNG.
• The stop button also matches localized labels (停止, 中止).

Tests

• tests/fixtures/chatgpt-thread-legacy.html: a scrubbed live capture of the legacy layout from a real run.
• tests/fixtures/chatgpt-thread-redesign.html: the redesign, built from the DOM recorded in web backend broken by ChatGPT UI redesign (composer / send button / turn markers / blob: image src) #41. The account used here is still served the legacy layout, so the redesign couldn't be captured live.
• A small stdlib CSS matcher checks every selector against both layouts. The tests also cover the doubled-thread turn count, the voice-button exclusion, localized stop labels, JS template formatting, and a simulated blob download.
• Verified in real Chrome: the actual page JS was run against both fixtures (with a live decoded blob), including the revoked-blob fallback.
• E2E: one real --backend web generation on the legacy layout (regression check) saved a valid 1254x1254 PNG.

Summary by CodeRabbit

• New Features
  • ChatGPT image generation now works with both the legacy and redesigned web layouts, including support for retrieving generated images from page-local previews.
• Documentation
  • Updated English and Chinese guidance to explain that redesigned image previews use blob: URLs readable only by the page.

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Advanced

Run ID: fcec3dc9-07c2-4fb0-960f-1fb2085041bb

📥 Commits

Reviewing files that changed from the base of the PR and between fdf9bd5 and 9f39e10.

📒 Files selected for processing (6)

• docs/how-it-works.md
• docs/how-it-works.zh-CN.md
• image-use
• test_image_use.py
• tests/fixtures/chatgpt-thread-legacy.html
• tests/fixtures/chatgpt-thread-redesign.html

Included review availability: This review used your included allowance. Your plan provides up to 2 included reviews per hour; 1 remain after this review.

---

📝 Walkthrough

Walkthrough

The web backend now supports legacy and redesigned ChatGPT layouts for prompt submission and generated-image detection. It also retrieves generated images served through page-local blob: URLs. Tests cover both layouts and blob-image retrieval.

Changes

Web backend compatibility

Layer / File(s)	Summary
DOM selectors and prompt submission image-use, test_image_use.py, tests/fixtures/chatgpt-thread-*	Composer, send, stop, and user-message handling support both ChatGPT layouts. Tests use legacy and redesigned DOM fixtures.
Generated-image detection image-use, test_image_use.py	State and baseline scripts recognize redesigned assistant replies and generated-image previews. Fixture tests cover selector and result detection.
Blob image retrieval image-use, test_image_use.py, docs/how-it-works.md, docs/how-it-works.zh-CN.md	Image retrieval runs in the page for blob URLs and can fall back to PNG canvas extraction. Tests verify the returned image bytes. Documentation describes the page-local blob URL.

Priority: ➖ Normal

Estimated code review effort: 3 (Moderate) | ~25 minutes

Change: Bug fix · Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to 9f39e

The change adds support for the redesigned ChatGPT layout and blob-URL images while keeping the legacy layout working. No merge-blocking issues were found.

Security Architecture Review

Security architecture risk: 🔵 Low · up to 9f39e

The change broadens support within an existing ChatGPT browser session, without an identified new external entrypoint or demonstrated security-control bypass. The redesigned layout has not been verified against a live account, and behavior with multiple matching composer forms remains uncertain.

Retained concerns
No architecture-level concerns identified.

Security review details

Security Blast Radius

• inferred — The added image-read capability operates within the existing authenticated ChatGPT page and its generated-image workflow; the reviewed changes do not establish a new service or public caller.

Trust Boundaries and Controls

• observed — Fresh-image selection is limited to images in the conversation main area, excludes sources found in user messages and the pre-submit baseline, and requires a decoded generated preview before accepting that new layout's image.
• observed — The redesigned Send selector is scoped to a form containing the composer and excludes named voice and dictation controls. The available fixture checks one matching composer form, not concurrent matching forms.

Resilience and Maintainability Implications

• observed — A failed blob fetch can recover from a decoded image; if retrieval or recovery fails, generation returns an error rather than image bytes. Uncertain prompt submission likewise does not trigger an automatic second click.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 23.33% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 30 functions across 1 files. (5 skipped: …	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely identifies the main change: support for the September 2026 ChatGPT redesign, including composer, send controls, turns, and blob: images.
Linked Issues check	✅ Passed	Issue #41 requires compatibility with the redesigned ChatGPT DOM. The PR adds fallback selectors for the composer, send control, localized stop control, user messages, turns, and generated-image previ…
Out of Scope Changes check	✅ Passed	The changes stay within Issue #41. The documentation explains the blob: URL behavior. The fixtures and tests verify legacy and redesigned layouts and the new page-side download path. No unrelated prod…

Full details: Docstring Coverage

Explanation

Docstring coverage is 23.33% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 30 functions across 1 files. (5 skipped: 5 unsupported.)

• Fix all pre-merge checks with AI

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}