Skip to content

feat(xiaohongshu): use CDP DOM.setFileInputFiles for image upload#574

Merged
jackwener merged 3 commits intojackwener:mainfrom
james0x-sudo:fix/cdp-file-input-upload
Mar 29, 2026
Merged

feat(xiaohongshu): use CDP DOM.setFileInputFiles for image upload#574
jackwener merged 3 commits intojackwener:mainfrom
james0x-sudo:fix/cdp-file-input-upload

Conversation

@james0x-sudo
Copy link
Copy Markdown
Contributor

Summary

  • Replace base64 DataTransfer injection with CDP DOM.setFileInputFiles for image upload in xiaohongshu publish
  • Chrome reads files directly from local filesystem — no base64 encoding, no payload size limits
  • Graceful fallback to legacy base64 method for older extension versions
  • Clear warning message when base64 fallback encounters large payloads (>500KB)

Problem

When publishing with images larger than ~500KB, the base64-encoded payload sent through page.evaluate()sendCommand('exec') exceeds the browser bridge message channel limits, causing a cryptic TypeError: fetch failed with no useful error context. Users have no idea the issue is image size.

Solution

Use CDP DOM.setFileInputFiles (the same mechanism Playwright/Puppeteer use internally) to set file paths directly on the <input type="file"> element. Chrome reads the files from disk — zero base64 overhead.

Files changed:

  • extension/src/protocol.ts — add set-file-input action type
  • extension/src/cdp.ts — add setFileInputFiles() using DOM.getDocumentDOM.querySelectorDOM.setFileInputFiles
  • extension/src/background.ts — add handleSetFileInput dispatcher
  • src/browser/daemon-client.ts — extend DaemonCommand with files and selector fields
  • src/browser/page.ts — add Page.setFileInput() method
  • src/types.ts — add optional setFileInput to IPage interface
  • src/clis/xiaohongshu/publish.ts — rewrite uploadImages() with CDP primary + base64 fallback

Backward compatibility

  • setFileInput is optional on IPage — no breaking change for other adapters
  • If the extension returns "Unknown action", publish falls back to the original base64 method automatically
  • The base64 fallback now warns when total payload exceeds 500KB

Test plan

  • Publish with a large image (>500KB PNG) — should succeed without compression
  • Publish with a small image (<100KB JPEG) — should also work via CDP path
  • Publish with an older extension version — should fall back to base64 gracefully
  • Publish with multiple images — verify all are uploaded
  • Verify TypeScript compiles cleanly (npx tsc --noEmit passes)

🤖 Generated with Claude Code

james0x-sudo and others added 3 commits March 29, 2026 15:28
Replace base64 DataTransfer injection with CDP DOM.setFileInputFiles,
which lets Chrome read image files directly from the local filesystem.
This eliminates payload size limits that caused "fetch failed" errors
when uploading large images (>500KB) through the browser bridge.

Changes:
- Add 'set-file-input' action to protocol, extension handler, and CDP executor
- Add Page.setFileInput() method for CLI-side usage
- Rewrite publish image upload to use CDP path, with base64 fallback
  for older extension versions that don't support the new action
- Add clear warning when falling back to base64 with large payloads

Closes jackwener#542 (partially — image upload reliability)

Co-Authored-By: Claude Opus 4.6 <[email protected]>
@jackwener jackwener merged commit 5925849 into jackwener:main Mar 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants