Skip to content

docs(core): document PageScrollLockController like other 2nd-gen controllers - #6534

Draft
rubencarvalho wants to merge 2 commits into
mainfrom
rcarvalho/refactor-page-scroll-lock-controller-structure
Draft

docs(core): document PageScrollLockController like other 2nd-gen controllers#6534
rubencarvalho wants to merge 2 commits into
mainfrom
rcarvalho/refactor-page-scroll-lock-controller-structure

Conversation

@rubencarvalho

@rubencarvalho rubencarvalho commented Jul 20, 2026

Copy link
Copy Markdown
Contributor

Description

Restructures PageScrollLockController from a bare file (controllers/page-scroll-lock.ts) into the standard 2nd-gen controller folder layout used by every other controller (color-controller, hover-controller, placement-controller, pending-controller, etc.): controllers/page-scroll-lock-controller/{index.ts,src/,stories/,test/,page-scroll-lock-controller.mdx}.

No behavioral change to the controller itself (src/page-scroll-lock.ts is an unmodified move). Adds:

  • A Storybook docs page (page-scroll-lock-controller.mdx) covering usage, the reference-counted lock/unlock behavior, and accessibility guidance (it only toggles overflow on document.documentElement and does not manage focus).
  • A single demo host with a lock/unlock toggle button, plus stories (Playground, Overview, Lock and unlock, Accessibility) so the controller is visible in the Storybook controller docs like its siblings. The controller has no host interface requirement, so one plain-LitElement demo is enough to show it.
  • A ./controllers/page-scroll-lock-controller.js export entry in core/package.json.

Motivation and context

PageScrollLockController was the only 2nd-gen controller without its own folder, stories, or .mdx doc page, so it had no Storybook documentation and was easy to overlook compared to the rest of the controllers.

Related issue(s)

  • No tracked issue; internal documentation/organization cleanup.

Screenshots (if appropriate)

N/A — Storybook docs page addition, no visual production component change.

Author's checklist

  • I have read the CONTRIBUTING and PULL_REQUESTS documents.
  • I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
  • I have added automated tests to cover my changes.
  • I have included a well-written changeset if my change needs to be published.
  • I have included updated documentation if my change required it.

Reviewer's checklist

  • Includes a Github Issue with appropriate flag or Jira ticket number without a link
  • Includes thoughtfully written changeset if changes suggested include patch, minor, or major features
  • Automated tests cover all use cases and follow best practices for writing
  • Validated on all supported browsers
  • All VRTs are approved before the author can update Golden Hash

Manual review test cases

  • Controller docs page renders

    1. Go to Storybook, Controllers/Page scroll lock controller
    2. Confirm the Overview, Behaviors ("Lock and unlock"), and Accessibility sections render with working Canvas demos
    3. Expect no console errors
  • Lock/unlock toggle behavior

    1. Go to the "Lock and unlock" story
    2. Click "Lock page scroll" — expect the Canvas iframe becomes unscrollable and the button label changes to "Unlock page scroll"
    3. Click "Unlock page scroll" — expect scroll is restored and the original overflow value is back

Device review

  • Did it pass in Desktop?
  • Did it pass in (emulated) Mobile?
  • Did it pass in (emulated) iPad?

Accessibility testing checklist

  • Keyboard (required — document steps below)

    1. No new interactive production component — the demo toggle button in Storybook is focusable and activates with Enter/Space like a native <button>
    2. Confirm no regressions to existing components that consume PageScrollLockController (e.g. swc-popover), since the controller itself is unchanged
    3. Expect no change in keyboard behavior for consumers
  • Screen reader (required — document steps below)

    1. The controller sets no ARIA attributes and manages no focus; it is a state-only reactive controller (background/foreground overflow toggle)
    2. Confirm existing consumers (e.g. swc-popover) are unaffected since Popover.base.ts continues to import PageScrollLockController from the same package barrel
    3. Expect no announcement changes

…rollers

Move the controller from a bare file into the standard controller folder
layout (index.ts, src/, stories/, test/, .mdx) so it gets Storybook docs
and demo stories like every other 2nd-gen controller. Wires the new export
path into core/package.json.
@rubencarvalho
rubencarvalho requested a review from a team as a code owner July 20, 2026 21:07
@changeset-bot

changeset-bot Bot commented Jul 20, 2026

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 6d4f0a2

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@github-actions

Copy link
Copy Markdown
Contributor

📚 Branch Preview Links

🔍 Gen1 Visual Regression Test Results

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

Deployed to Azure Blob Storage: pr-6534

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

@rubencarvalho
rubencarvalho marked this pull request as draft July 20, 2026 21:22
Drop the separate status readout component and the two-host stacked-locks
story. One host with a lock/unlock toggle is enough to demonstrate the
controller, which has no host interface requirement of its own.
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