Skip to content

upgrade: page-utilities packages migration and adaptation upgrade for Solid 2.0 #901

Open
davedbase wants to merge 5 commits into
solidjs-community:nextfrom
davedbase:update/v2/page-visibility
Open

upgrade: page-utilities packages migration and adaptation upgrade for Solid 2.0 #901
davedbase wants to merge 5 commits into
solidjs-community:nextfrom
davedbase:update/v2/page-visibility

Conversation

@davedbase
Copy link
Copy Markdown
Member

@davedbase davedbase commented May 16, 2026

Migrates the former @solid-primitives/page-visibility package to Solid.js v2.0 (beta.13), adds two new navigation-blocking primitives, and renames the package to @solid-primitives/page-utilities to reflect its broader scope.

Solid 2.0 migration

  • isServer import moved from solid-js/web@solidjs/web
  • INTERNAL_OPTIONS (ownedWrite: true) added to the internal signal — required because DOM event handlers firing within an owned scope trigger Solid 2.0's write guard
  • flush() added in tests after dispatchEvent calls to commit pending signal values before asserting
  • test/server.test.ts added to verify SSR behaviour
  • Peer dependencies updated to solid-js@^2.0.0-beta.13 and @solidjs/web@^2.0.0-beta.13

New primitives: makePageLeave and createPageLeaveBlocker

makePageLeave is the base primitive — it attaches a beforeunload listener that calls e.preventDefault() to trigger the browser's built-in "Leave site?" dialog, and returns a cleanup function.

createPageLeaveBlocker is the reactive wrapper. It accepts an optional MaybeAccessor<boolean> (default true) so navigation blocking can be toggled reactively — the most practical pattern being gating on unsaved state:

const [isDirty, setIsDirty] = createSignal(false);
createPageLeaveBlocker(isDirty);

Static true/false wires up synchronously via onCleanup; a signal uses the Solid 2.0 split createEffect(compute, apply) pattern to arm and disarm the listener as the value changes.

Package rename

@solid-primitives/page-visibility@solid-primitives/page-utilities. The package now covers page-level browser concerns beyond just visibility, and the name change reflects that.

Breaking changes

  • Package renamed to @solid-primitives/page-utilities
  • Peer dependencies now require solid-js@^2.0.0-beta.13 and `@solidjs/web@^2.0.0-beta.13

Summary by CodeRabbit

Release Notes

  • Breaking Changes

    • Requires Solid.js v2.0-beta.13 or higher
    • isServer must now be imported from @solidjs/web instead of solid-js/web
    • @solid-primitives/page-visibility has been replaced by @solid-primitives/page-utilities
  • New Features

    • Added page leave blocking functionality to prevent unintended navigation away from the app
    • Enhanced page utilities package with expanded capabilities

Review Change Stack

@davedbase davedbase added this to the Solid 2.0 Migration milestone May 16, 2026
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented May 16, 2026

🦋 Changeset detected

Latest commit: cebf743

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@solid-primitives/page-utilities Major

Not sure what this means? Click here to learn what changesets are.

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

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented May 24, 2026

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 6edd4819-53a9-4972-afc6-47da6a8cd895

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/page-utilities/package.json`:
- Around line 19-23: Add the exported hook usePageVisibility to the primitive
listing so docs tooling includes it: update the "list" array in the package's
package.json (primitive.list) to include "usePageVisibility", matching the
export in packages/page-utilities/src/index.ts (which currently exports
usePageVisibility) so the public API and generated primitives docs stay in sync.

In `@packages/page-utilities/README.md`:
- Around line 16-17: Fix the README TOC and heading-level lint warnings by
updating the TOC link for createPageLeaveBlocker to match the exact heading id
(use `#createPageLeaveBlocker` with correct camelCase) and change all overly-deep
"#### Definition" headings to "### Definition" so they increment correctly from
the surrounding "##" sections; apply the same "#### → ###" fix to the other
Definition sections referenced for consistency.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: fc472dad-834d-4306-9309-8c3fa5480c97

📥 Commits

Reviewing files that changed from the base of the PR and between 76d6f2e and c61e964.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (13)
  • .changeset/page-utilities-solid2-migration.md
  • .changeset/pre.json
  • packages/page-utilities/CHANGELOG.md
  • packages/page-utilities/LICENSE
  • packages/page-utilities/README.md
  • packages/page-utilities/package.json
  • packages/page-utilities/src/index.ts
  • packages/page-utilities/test/index.test.ts
  • packages/page-utilities/test/server.test.ts
  • packages/page-utilities/tsconfig.json
  • packages/page-visibility/README.md
  • packages/page-visibility/src/index.ts
  • packages/page-visibility/test/index.test.ts
💤 Files with no reviewable changes (3)
  • packages/page-visibility/src/index.ts
  • packages/page-visibility/test/index.test.ts
  • packages/page-visibility/README.md

Comment thread packages/page-utilities/package.json
Comment thread packages/page-utilities/README.md Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant