Skip to content

fix: don't apply the thumbnail srcSet to the preview of preview.src - #535

Open
b84330808 wants to merge 1 commit into
react-component:masterfrom
b84330808:fix/preview-src-srcset
Open

b84330808 wants to merge 1 commit into
react-component:masterfrom
b84330808:fix/preview-src-srcset

Conversation

@b84330808

@b84330808 b84330808 commented Oct 20, 2026 •

Copy link
Copy Markdown

Related: ant-design/ant-design#44418

When an image has both srcSet and preview.src, the preview showed the thumbnail. imgCommonProps holds the thumbnail's srcSet and sizes, and it is passed to the preview image (and registered for PreviewGroup) next to src = preview.src. Browsers pick an image from srcset over src, so preview.src was ignored.

When preview.src is set, the preview now gets the common props without srcSet and sizes. Without preview.src the preview still uses the thumbnail's srcSet, as before.

The new tests in tests/preview.test.tsx cover a single Image and an Image in PreviewGroup, which fail on master, plus the case without preview.src. All tests pass, and tsc is clean.

I used Claude Code to write this change.

Summary by CodeRabbit

  • Bug 修复
    • 修复配置预览图片源后,预览图错误继承缩略图 srcSet 和 sizes 的问题。
    • 修复图片预览组中的相同属性继承问题。
    • 未配置独立预览图片源时,预览图仍会保留缩略图的响应式图片属性。

The preview image got the thumbnail's `srcSet` and `sizes`, which browsers
prefer over `src`, so it showed the thumbnail instead of `preview.src`.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@vercel

vercel Bot commented Oct 20, 2026

Copy link
Copy Markdown

@b84330808 is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

@coderabbitai

coderabbitai Bot commented Oct 20, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 83d293a0-82fd-4703-b753-1b821eb99c97
📥 Commits

Reviewing files that changed from the base of the PR and between 4cbfa08 and 50b89cf.

📒 Files selected for processing: 2
  • src/Image.tsx
  • tests/preview.test.tsx

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

当配置 preview.src 时,预览图片会使用移除了缩略图 srcSet 和 sizes 的属性。未配置时,预览图片继续使用原有公共属性。新增测试覆盖普通预览、PreviewGroup 和未配置 preview.src 的情况。

Changes

预览图片属性

层 / 文件 摘要
派生预览属性并验证行为
src/Image.tsx, tests/preview.test.tsx
配置 preview.src 时,图片注册和 Preview 使用移除了 srcSet、sizes 的属性。新增测试覆盖普通预览和 PreviewGroup。未配置时,测试验证预览图片保留 srcSet。

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix

Merge Risk: ⚪ Minimal · up to 50b89

The preview-image change appears mergeable after normal checks; no actionable risk remains identified.

Pre-merge checks: Passed 5
Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed 标题准确概括了主要变更:当设置 preview.src 时,不将缩略图的 srcSet 应用于预览图。标题具体、简洁,并与代码和测试变更一致。
Docstring Coverage Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 2…
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
Full details: Docstring Coverage

Explanation

No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 2 files.

✨ Finishing Touches: 💡 1
🛠️ Fix failing CI checks: 💡
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Warning

Some tools did not complete. Review the errors below.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install timed out. The project may have too many dependencies for the sandbox.

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

我是小兔,蹦过画框旁
预览新源,清清爽爽
缩略图的尺寸,不再跟随
没有新源,旧集仍留
耳朵一竖,测试通过
月光下,我快乐地跳走

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

This branch has not been deployed

No deployments
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.

1 participant