Skip to content

fix(preset-mini,preset-wind4): key the breakpoint cache by kind - #5303

Merged
zyyv merged 1 commit into
unocss:mainfrom
rajanpanth:fix/vertical-breakpoints-cache-key
Sep 5, 2026
Merged

zyyv merged 1 commit into
unocss:mainfrom
rajanpanth:fix/vertical-breakpoints-cache-key

Conversation

@rajanpanth

Copy link
Copy Markdown
Contributor

Description

resolveBreakpoints takes a key selecting breakpoints or verticalBreakpoints, but memoizes into a WeakMap keyed only on the theme object:

if (resolvedBreakpoints.has(theme))
  return resolvedBreakpoints.get(theme)

The breakpoints variant calls it with the default horizontal key for every token during variant matching, and variant matching always runs before rule matching. So by the time h-screen-<point> asks for the vertical set, the entry is already populated with the horizontal one and the vertical values are silently ignored.

Isolated, on one theme:

call 1 (horizontal, as the variant does first): [ sm: 640px, md: 768px ]
call 2 (vertical,   as h-screen-* asks):        [ sm: 640px, md: 768px ]   <- should be 400px / 500px

End to end, with verticalBreakpoints: { sm: '400px', md: '500px' }:

- .h-screen-md{height:500px;}     expected
+ .h-screen-md{height:768px;}     actual
- .h-screen-sm{height:400px;}     expected
+ .h-screen-sm{height:640px;}     actual

This is deterministic rather than order-dependent, and it stays hidden with the shipped defaults because verticalBreakpoints starts as a copy of breakpoints. It only surfaces once a user customizes them differently, which the h-screen-$verticalBreakpoints autocomplete and the typed theme key both invite.

Change

The cache becomes a Map keyed by the breakpoint kind, so the two sets no longer share an entry. Applied identically to preset-mini and preset-wind4, which carry the same function.

Tests

One test per preset, asserting h-screen-sm/md follow the vertical set while w-screen-sm still follows the horizontal one, so an over-correction that swapped both would also fail.

Reverting only the two source files and rebuilding the presets fails both with .h-screen-md{height:768px;} against the expected 500px; restoring passes. Full preset-mini and preset-wind4 suites pass 46/46, and eslint is clean on the changed files.

@netlify

netlify Bot commented Sep 4, 2026

Copy link
Copy Markdown

Deploy Preview for unocss ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit 4e1abc6
🔍 Latest deploy log https://app.netlify.com/projects/unocss/deploys/6a9add385ae3250008d16e30
😎 Deploy Preview https://deploy-preview-5303--unocss.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.

@pkg-pr-new

pkg-pr-new Bot commented Sep 4, 2026

Copy link
Copy Markdown

Open in StackBlitz

commit: 4e1abc6

resolveBreakpoints memoized into a WeakMap keyed only on the theme object,
while the function also takes a key selecting breakpoints or
verticalBreakpoints. The breakpoints variant resolves the horizontal set for
every token during variant matching, which always runs before rule matching,
so the cache was already populated by the time h-screen-* asked for the
vertical set and it received the horizontal values instead.

The defaults make verticalBreakpoints a copy of breakpoints, so this is only
visible once the two are customized differently.

The cache is now a Map keyed by the breakpoint kind.
@rajanpanth
rajanpanth force-pushed the fix/vertical-breakpoints-cache-key branch from d69e497 to 4e1abc6 Compare September 4, 2026 15:01
@zyyv
zyyv added this pull request to the merge queue Sep 5, 2026
Merged via the queue into unocss:main with commit 6ec81db Sep 5, 2026
11 checks passed
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

Sponsor
SponsoredKunjungi sekarang
Promo