fix: apply preset sizes when component sizes prop is undefined #1919
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Enhanced getSizes function to properly merge preset options using defu - Updated NuxtImg and NuxtPicture components to only pass sizes/densities when explicitly defined - Added tests to verify preset sizes and densities are correctly applied - Fixes issue where undefined props override preset values causing incorrect srcset generation Resolves density-based fallback when width-based srcset should be used from presets Fixes nuxt#1918
|
@tyminko is attempting to deploy a commit to the NuxtLabs Team on Vercel. A member of the Team first needs to authorize it. |
commit: |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🔧 Fix
Fixes #1918
Problem
When using image presets with defined
sizes, the preset sizes are not applied if the component'ssizesprop isundefined. This causes fallback to density-based srcset instead of the expected width-based srcset from presets.Changes Made
Enhanced
getSizesfunction (src/runtime/image.ts):defusizesanddensitiesare used when not overridden by component propsUpdated components (
NuxtImg.vue,NuxtPicture.vue):sizesanddensitiesprops when explicitly defined (!== undefined)undefinedfrom overriding preset valuesAdded tests:
Before vs After
Before:
/_ipx/s_300x400/image.png 1x, /_ipx/s_600x800/image.png 2x(density-based)After:
/_ipx/s_320x427/image.png 320w, /_ipx/s_640x853/image.png 640w, /_ipx/s_1024x1365/image.png 1024w(width-based from preset)Testing
pnpm lint)pnpm build)Breaking Changes
None. This is a bug fix that makes the behavior match the documented/expected behavior.