fireproof Test for browser reload

currently passes. might be useful for finding integration issues

Summary by CodeRabbit

New Features
- Introduced end-to-end tests for Fireproof database operations and localStorage persistence, verifying data integrity across page reloads and navigation.
- Added new HTML test fixture pages to support localStorage and Fireproof E2E scenarios.
- Provided TypeScript type declarations for Fireproof E2E test helpers.
Chores
- Added Playwright configuration and scripts for running E2E tests.
- Updated dependencies and scripts to support Playwright and local web server for testing.
Tests
- Expanded test exclusion patterns to omit browser-related files from certain test suites.

Aug 04 '25 23:08 jchris

Walkthrough

This change introduces a new end-to-end test framework using Playwright, including configuration, scripts, and HTML test fixtures for Fireproof database and localStorage persistence scenarios. It also updates Vitest test configurations to exclude the browser directory from certain test runs and makes related updates to package scripts and dependencies.

Changes

Cohort / File(s)	Change Summary
Vitest Test Config Exclusions `core/tests/vitest.file.config.ts`, `core/tests/vitest.indexeddb.config.ts`, `core/tests/vitest.memory.config.ts`	Added `"browser/**"` to the `exclude` arrays to prevent tests under the `browser` directory from running in these configurations.
Playwright E2E Test Infrastructure `playwright.config.ts`, `package.json`	Added Playwright test configuration, scripts for running E2E tests, and updated dependencies.
Fireproof E2E Tests and Types `e2e/fireproof-basic.spec.ts`, `e2e/types.ts`, `e2e/fixtures/fireproof-basic.html`	Added a Playwright E2E test for Fireproof basic operations, supporting HTML fixture, and global TypeScript types for Fireproof E2E tests.
localStorage E2E Tests and Fixtures `e2e/localStorage-navigation.spec.ts`, `e2e/localStorage-reload.spec.ts`, `e2e/fixtures/page1.html`, `e2e/fixtures/page2.html`, `e2e/fixtures/page3.html`	Added Playwright E2E tests and HTML fixtures to verify localStorage persistence across navigation and reloads.

Sequence Diagram(s)

Fireproof Basic E2E Test Flow

sequenceDiagram
    participant TestRunner as Playwright Test
    participant Browser as Browser Page (fireproof-basic.html)
    participant Fireproof as Fireproof DB

    TestRunner->>Browser: Navigate to fireproof-basic.html
    Browser->>Fireproof: window.fpInit()
    Fireproof-->>Browser: Initialization complete
    Browser-->>TestRunner: Fireproof functions detected

    TestRunner->>Browser: window.fpPut("test1", {...})
    Browser->>Fireproof: Put document "test1"
    Fireproof-->>Browser: Ack (ok: true)
    Browser-->>TestRunner: Put result

    TestRunner->>Browser: window.fpGet("test1")
    Browser->>Fireproof: Get document "test1"
    Fireproof-->>Browser: Return document
    Browser-->>TestRunner: Document data

    TestRunner->>Browser: window.fpAllDocs()
    Browser->>Fireproof: Get all documents
    Fireproof-->>Browser: Return docs
    Browser-->>TestRunner: Docs list

    TestRunner->>Browser: Reload page
    Browser->>Fireproof: window.fpInit() (auto)
    Fireproof-->>Browser: Initialization complete
    Browser-->>TestRunner: Re-initialization detected

    TestRunner->>Browser: window.fpGet("test1")
    Browser->>Fireproof: Get document "test1"
    Fireproof-->>Browser: Return document
    Browser-->>TestRunner: Document data

localStorage Navigation E2E Test Flow

sequenceDiagram
    participant TestRunner as Playwright Test
    participant Page1 as page1.html
    participant Page2 as page2.html
    participant Page3 as page3.html

    TestRunner->>Page1: Navigate to page1.html
    Page1->>Page1: setTestData()
    Page1->>Page1: getTestData()
    Page1-->>TestRunner: Data verified

    TestRunner->>Page1: Click link to page2.html
    Page1->>Page2: Navigate to page2.html
    Page2->>Page2: getTestData()
    Page2-->>TestRunner: Data verified

    TestRunner->>Page2: Click link to page3.html
    Page2->>Page3: Navigate to page3.html
    Page3->>Page3: getTestData()
    Page3-->>TestRunner: Data verified

    TestRunner->>Page3: Reload page
    Page3->>Page3: getTestData()
    Page3-->>TestRunner: Data verified

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

fireproof-storage/fireproof#631: Modifies core/tests/vitest.indexeddb.config.ts (also changed here) by adding a name: "chrome" property and updates related package scripts, overlapping with this PR's updates to the same config file but focusing on different aspects.

[!NOTE]

⚡️ Unit Test Generation is now available in beta!

Learn more here, or try it out under "Finishing Touches" below.

✨ Finishing Touches

[ ] 📝 Generate Docstrings

🧪 Generate unit tests

[ ] Create PR with unit tests
[ ] Post copyable unit tests in a comment
[ ] Commit unit tests in branch jchris/reload

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Explain this complex logic.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai explain this code block.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and explain its main purpose.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR.
@coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
@coderabbitai generate unit tests to generate unit tests for this PR.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

Aug 04 '25 23:08 coderabbitai[bot]

A good started but to review it i need atleast 2-3 days. The first look brought some question thats why i have to dig into it.

Aug 05 '25 07:08 mabels