Skip to content

[avatar] Fix image status edge cases#4835

Draft
atomiks wants to merge 1 commit into
mui:masterfrom
atomiks:codex/avatar-behavior-coverage
Draft

[avatar] Fix image status edge cases#4835
atomiks wants to merge 1 commit into
mui:masterfrom
atomiks:codex/avatar-behavior-coverage

Conversation

@atomiks
Copy link
Copy Markdown
Contributor

@atomiks atomiks commented May 18, 2026

This is part of the Codex component behavior and test coverage sweep. It fixes Avatar behavior/API issues found during review and adds focused regression coverage for the affected paths.

Root cause

Avatar had edge cases where its implementation and tests did not fully cover the expected image loading, fallback, and native image prop contract.

Changes

  • Fix Avatar image prop forwarding for crossOrigin, referrerPolicy, srcSet, and sizes.
  • Use the same responsive image inputs for the loading probe that the rendered image receives.
  • Reset image loading status when Avatar.Image unmounts so fallback can render again.
  • Reconcile Avatar.Fallback delay changes.
  • Add regression and type tests for the affected Avatar paths.

Original findings addressed

  • [P2] Avatar.Image drops crossOrigin and referrerPolicy from the rendered <img>.
  • [P2] srcSet/sizes are part of the native image API but loading status only looks at src.
  • [P2] Removing a loaded Avatar.Image can leave fallback hidden forever.
  • [P3] Fallback.delay is one-shot state and does not reconcile prop changes.

@atomiks atomiks added type: bug It doesn't behave as expected. component: avatar Changes related to the avatar component. labels May 18, 2026
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented May 18, 2026

commit: 28a5958

@code-infra-dashboard
Copy link
Copy Markdown

code-infra-dashboard Bot commented May 18, 2026

Bundle size

Bundle Parsed size Gzip size
@base-ui/react 🔺+160B(+0.03%) 🔺+89B(+0.06%)

Details of bundle changes

Performance

Total duration: 1,486.29 ms +40.38 ms(+2.8%) | Renders: 50 (+0) | Paint: 2,254.92 ms +66.08 ms(+3.0%)

No significant changes — details


Check out the code infra dashboard for more information about this PR.

@atomiks atomiks force-pushed the codex/avatar-behavior-coverage branch from 6259b46 to 28a5958 Compare May 18, 2026 04:10
@netlify
Copy link
Copy Markdown

netlify Bot commented May 18, 2026

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit 6259b46
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a0a90668bb6360008672fe7
😎 Deploy Preview https://deploy-preview-4835--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@netlify
Copy link
Copy Markdown

netlify Bot commented May 18, 2026

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit 28a5958
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a0a91428bb6360008673eaa
😎 Deploy Preview https://deploy-preview-4835--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

component: avatar Changes related to the avatar component. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant