Claude Fable offers:
Investigation: #1730 — background-* longhands don't match layers
TL;DR: The bug is real and still present on main. CSS requires the computed value of each layered background-* longhand to be truncated or repeated so its list length equals the number of background layers (which is set by the number of comma-separated values in background-image). Alfa implemented this correctly for mask-* (PR #1711, merged Dec 2024) via Resolver.layers, but the older background-* longhands still compute their lists as-parsed. No fix PR exists — the issue's only cross-reference is the originating mask PR.

Root cause
Resolver.layers in resolver.ts:74 already does exactly what's needed — value.cutOrExtend(max(style.computed(name).value.size, 1)) — and its signature already accepts "background-image" as the layer-count source. It's just never wired into the background longhands:

Use it (all 7 non-image mask longhands): mask-clip, mask-composite, mask-mode, mask-origin, mask-position, mask-repeat, mask-size
Don't use it (the bug): background-attachment, background-clip, background-origin, background-position-x, background-position-y, background-repeat-x, background-repeat-y, background-size — their compute functions are (value) => value or per-item resolution with no layer matching
Concretely, background-image: url(a), url(b); background-repeat: no-repeat; should compute background-repeat to two layers (no-repeat, no-repeat), and background-clip: padding-box, content-box, border-box with a single image should truncate to one. Alfa currently returns the raw one- and three-item lists.

Observable impact
The computed background longhands feed get-layers.ts in alfa-rules (get-layers.ts:208-240), used by the color/contrast machinery (R66/R69 etc.), and the R62 serializer reads background-attachment/-clip/-origin lists directly. The most likely real-world symptom: background-size with excess values beyond the layer count doesn't get truncated, so the "non-initial background-size → abort color resolution" check at line 240 can trigger (or compare wrongly) based on values that per spec don't exist. It's a correctness/conformance bug more than a crash.

Fix shape (small, mechanical)
For each of the 8 background longhands, wrap the computed list the same way mask does. Simple keyword ones become:

(value, style) => value.map(Resolver.layers(style, "background-image")),

and the ones with per-item resolution (background-size, background-position-x/y) compose it like mask-size.ts does — resolve items, then apply layers(...). Tests follow the exact pattern already in mask-clip.spec.tsx ("#computed parses multiple layers" / truncation cases). One thing to verify while implementing: the background shorthand parser builds per-layer tuples itself, so layer-matching in the longhands' compute step should compose fine with it, but the shorthand tests in background.spec.tsx should be re-run for separator/list-shape regressions (note background-clip initializes its list with ", " separator while mask-clip uses the default — minor inconsistency the PR could also clean up).

One wrinkle worth flagging in a PR: per spec, background-position is one property, but alfa splits it into -x/-y internally (same for repeat) — each half still needs the layer treatment individually, which is straightforward since both take their count from the same background-image.

SIA-R84 should not consider height: 100% as scrollable #1681

Description

Activity

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions

SIA-R84 should not consider `height: 100%` as scrollable #1681