fix: harden responsive layout integration - #4
Conversation
There was a problem hiding this comment.
Pull request overview
Hardens the layout laboratory’s container-responsive specimens by ensuring they query within an appropriate inline-size containment boundary, while also aligning published dependency versions and replacing the external preview server used for Playwright runs.
Changes:
- Wrap split/two-pane/three-pane/media specimens in a local
container-type: inline-sizescope and document the container-query constraint. - Replace the
serve-based Playwright preview server with a repository-owned static preview server and update Playwright webServer command accordingly. - Pin
layout-style-css@2.1.1everywhere (fixtures, docs, ecosystem metadata, and tests) and expand browser coverage for responsive/overflow/runtime-error assertions across multiple viewports.
Reviewed changes
Copilot reviewed 14 out of 15 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| tests/fixtures.test.mjs | Updates expected fixture asset paths and versions for layout-style-css@2.1.1. |
| tests/export.test.mjs | Aligns structured data + exported asset expectations with layout-style-css@2.1.1. |
| tests/ecosystem.test.ts | Updates pinned install/CDN strings and registry ordering to include layout-style-css@2.1.1. |
| tests/browser/site.spec.ts | Updates metadata/version assertions for layout-style-css@2.1.1. |
| tests/browser/capabilities.spec.ts | Adds containment boundary checks, Reel accessibility/scroll assertions, viewport matrix expansion, and runtime error capture. |
| scripts/verify-export.mjs | Aligns structured data verification with layout-style-css@2.1.1. |
| scripts/serve-preview.mjs | Adds a repository-owned static preview server for Playwright’s webServer. |
| scripts/build-fixtures.mjs | Updates fixture build contracts and expected asset targets to layout-style-css@2.1.1. |
| README.md | Updates pinned install/CDN examples and package table version to layout-style-css@2.1.1. |
| playwright.config.ts | Switches Playwright webServer command to use the new preview server script. |
| package.json | Pins layout-style-css@2.1.1, updates Next/eslint tooling, removes serve, and adds preview:serve. |
| package-lock.json | Lockfile refresh for dependency updates (Next/PostCSS/Sharp/etc.) and removal of serve. |
| app/styles/labs.css | Introduces .primitive-query-scope containment boundary styling and documents why it’s needed. |
| app/data/ecosystem.ts | Updates ecosystem package version + pinned install/CDN links for layout-style-css@2.1.1. |
| app/components/labs/LayoutLab.tsx | Wraps container-responsive primitives in .primitive-query-scope and adds Reel accessibility attributes. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| createReadStream(filePath).pipe(response); |
There was a problem hiding this comment.
Fixed in d639087. File streams now register the error handler before the open event, return a controlled 500 when opening fails, and close an already-started response without leaving an unhandled stream error. Added a real HTTP regression test that issues two failing reads and verifies the server remains available.
What changed
layout-style-css@2.1.1package and align install, CDN, fixture, metadata, and export contractsRoot cause
Container-responsive primitives had no parent containment boundary matching their allocated atlas cell. A queried element cannot establish and query its own inline-size containment context.
Verification
npm.cmd run qualitygit diff --checkThe full npm audit retains nine dev-only findings in Next's bundled ESLint/minimatch chain; npm's proposed remediation is a breaking ESLint 10 upgrade, and the compatible lint configuration remains green.