Repository navigation
fix: unclip filter drop-shadow demonstration - #12
Merged
Merged
Conversation
Co-authored-by: arena-agent <297053741+arena-agent@users.noreply.github.com>
Co-authored-by: arena-agent <297053741+arena-agent@users.noreply.github.com>
Co-authored-by: arena-agent <297053741+arena-agent@users.noreply.github.com>
Co-authored-by: arena-agent <297053741+arena-agent@users.noreply.github.com>
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
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.
Summary
The
filter: drop-shadow()teaching demo was clipped by the shared.swatch { overflow: hidden }rule. This PR makes only that swatch overflow-visible so the glow is painted outside the motif, while preserving the shared fragments and all other demonstrations.Cause and fix
.f-drop .swatch-ytaapplieddrop-shadow(), but its ancestor.swatchestablished an overflow clipping context. The filter declaration was active; the outer filter output was simply discarded at the swatch boundary.demos/filter-drop-shadow.htmlsource now adds.f-drop { overflow: visible }. The surface getsborder-radius: 9px 9px 0 0so opening the clip does not expose square top corners. The rule is in the canonical source, so the generated copied snippet contains it too.swatch.css,swatch-solo.css, andfilter-motiv.cssfragments are unchanged. No runtime JavaScript, dependencies, support metadata, or generator architecture changed.Exact files
demos/filter-drop-shadow.html: scoped overflow correction and surface corner geometry.index.html: generated live CSS and copied textarea regenerated from that source.tests/demo-source.mjs: pixel-based regression coverage for the live generated demo and independent snippet; samples the host outside the swatch bounds, checks overflow/radii, checks laboratory values 0 and 8, and exercises 375/1280px and light/dark snippet rendering.scripts/build.test.mjs: locks the drop-shadow source ownership and exact snippet selectors.tests/demo-parity.mjs: the smallest explicit parity normalization for this approved visual change: onlyoverflowand the intentional surfaceborder-radius, in addition to the existing migration class token. All other measured properties remain strict.Evidence
The browser regression measures actual screenshot pixels, not only computed style:
.swatch-yta; an interior brightness change cannot satisfy the assertion.Representative screenshots are produced by the existing browser screenshot/parity infrastructure (
tests/demo-source.mjsandtests/demo-parity.mjs --shots ...); the historical baseline is not overwritten. The corrected result is intentionally not pixel-identical to the historical drop-shadow baseline because the previously clipped outer pixels are now painted.Regression scope
Verification
npm run build✅npm run build:check✅npm run check✅node scripts/build.test.mjs✅npm run test:browsercdn.playwright.devconnection reset). The mandatory browser job is configured unchanged and will run in GitHub Actions.Independent CI review (HEAD
ee7bca43d1cb21ae9d70c0b637303c13fb27d2bb): The first browser run failed only because an inherited standalone-snippet test still required exactly two.f-*selectors. The intended.f-drop { overflow: visible; }adds a third. Updated that test to assert the exact expected selector set for all eight filter demos, with the third selector permitted only for drop-shadow. The latest workflow run is green in both mandatory jobs, including standalone painted-glow verification and full measured parity. The historical seven cross-browser text-metric warnings remain. No shared fragments or baseline files were changed by this follow-up.Please keep this PR open and unmerged; the intended CI jobs are the repository's two existing required jobs.