[material-ui][Avatar] Fix slotProps.img not spread to hook
#44536
Conversation
Netlify deploy previewhttps://deploy-preview-44536--material-ui.netlify.app/ Bundle size reportDetails of bundle changes (Toolpad) |
Can we mock it to add a test? |
…avatar-slotProps-img
I decided to use the global.Image instead of mocking the hook. It's cleaner. |
| // Use a hook instead of onError on the img element to support server-side rendering. | ||
| const loaded = useLoaded({ | ||
| ...imgProps, | ||
| ...(typeof slotProps.img === 'function' ? slotProps.img(ownerState) : slotProps.img), |
There was a problem hiding this comment.
Off topic:
I think this common pattern (...(typeof slotProps.x === 'function' ? slotProps.x(ownerState) : slotProps.x)) could have a util in the future, it would also be useful for users: #44350 (comment)
What do you think?
There was a problem hiding this comment.
Could be. It is already handled by the useSlot but I think this is an edge case.
closes #44501
before: https://codesandbox.io/p/sandbox/avatar-imgprops-demo-7jdnp5
after: https://codesandbox.io/p/sandbox/material-ui-cra-ts-forked-l9rtth
The problem is
slotProps.imgis not spread to theuseLoadedhook inside Avatar, so the crossOrigin does not take into account.Test added.