Skip to content

Conversation

@jchris
Copy link
Contributor

@jchris jchris commented Aug 4, 2025

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.

jchris and others added 6 commits August 4, 2025 13:58
- Make pnpm lint quiet (errors only) with --quiet flag
- Make pnpm format quiet in check script with --log-level silent
- Exclude browser/ tests from Node.js test configs (file, memory, indexeddb)
- Add browser-integration config to main vitest config
- Ensure localStorage tests only run in browser environment

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Install @playwright/test and http-server for E2E testing
- Create playwright.config.ts with Chromium-only setup and local server
- Build comprehensive test fixture pages (page1.html, page2.html, page3.html)
- Implement real page.reload() tests with localStorage persistence
- Add navigation tests with actual page transitions and browser back/forward
- Test complex data structures, multiple reloads, and navigation cycles
- All 9 E2E tests passing with real browser environment (not iframe simulation)
- Add npm scripts: test:e2e and test:e2e:headed for running tests

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Remove core/tests/browser/ fixtures and tests (not needed for Playwright)
- Remove localStorage-reload.test.ts (real reload testing now in Playwright)
- Remove vitest.browser-integration.config.ts and related npm script
- Clean up vitest.config.ts to remove browser-integration project
- Focus on Playwright E2E tests for real navigation and reload testing

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Fix prefer-const eslint error in localStorage-navigation.spec.ts
- Apply Prettier formatting to all HTML fixtures and TypeScript files

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Add HTML fixture using Fireproof CDN for browser compatibility
- Implement E2E test for put/get/allDocs operations with page reload
- Test validates data persistence through page.reload() cycles
- Update Playwright config to serve from project root for dist access
- Add line reporter to E2E test scripts for better console output

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Aug 4, 2025

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
Loading

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
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • fix indexeddb test #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.

Copy link
Contributor

@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: 4

🧹 Nitpick comments (8)
e2e/fixtures/page1.html (1)

52-76: Code duplication in helper functions.

The helper functions are identical to those in page2.html. Consider extracting these into a shared JavaScript file to follow DRY principles.

Create a shared e2e/fixtures/localStorage-helpers.js file:

// Helper functions for localStorage testing
function setTestData(key, value) {
  localStorage.setItem(key, JSON.stringify(value));
  displayStorageContent();
}

function getTestData(key) {
  const data = localStorage.getItem(key);
  return data ? JSON.parse(data) : null;
}

function displayStorageContent() {
  const content = document.getElementById("storage-content");
  const keys = Object.keys(localStorage);
  if (keys.length === 0) {
    content.innerHTML = "<em>localStorage is empty</em>";
    return;
  }

  let html = "<strong>localStorage contents:</strong><br>";
  keys.forEach((key) => {
    const value = localStorage.getItem(key);
    html += `<strong>${key}:</strong> ${value}<br>`;
  });
  content.innerHTML = html;
}

Then include it in each HTML page:

<script src="localStorage-helpers.js"></script>
playwright.config.ts (1)

24-29: Consider adding more browser coverage.

Currently only Chromium is configured. For comprehensive E2E testing, consider adding Firefox and WebKit browsers to catch browser-specific issues.

 projects: [
   {
     name: "chromium",
     use: { ...devices["Desktop Chrome"] },
   },
+  {
+    name: "firefox",
+    use: { ...devices["Desktop Firefox"] },
+  },
+  {
+    name: "webkit",
+    use: { ...devices["Desktop Safari"] },
+  },
 ],
e2e/fixtures/page3.html (1)

52-76: Add error handling for JSON operations.

The localStorage helper functions work correctly, but could benefit from error handling around JSON operations to prevent test failures from malformed data.

Consider adding try-catch blocks:

 function setTestData(key, value) {
-  localStorage.setItem(key, JSON.stringify(value));
-  displayStorageContent();
+  try {
+    localStorage.setItem(key, JSON.stringify(value));
+    displayStorageContent();
+  } catch (error) {
+    console.error('Failed to set test data:', error);
+  }
 }

 function getTestData(key) {
-  const data = localStorage.getItem(key);
-  return data ? JSON.parse(data) : null;
+  try {
+    const data = localStorage.getItem(key);
+    return data ? JSON.parse(data) : null;
+  } catch (error) {
+    console.error('Failed to get test data:', error);
+    return null;
+  }
 }
e2e/localStorage-reload.spec.ts (1)

87-93: Simplify data update logic for clarity.

The nested page.evaluate for updating data is complex and could be simplified for better maintainability.

Consider simplifying the update logic:

-    await page.evaluate(
-      (data) => {
-        const existing = window.getTestData("multi-reload");
-        window.setTestData("multi-reload", { ...existing, ...data });
-      },
-      { counter: 2, reloaded: true },
-    );
+    await page.evaluate(() => {
+      const existing = window.getTestData("multi-reload");
+      window.setTestData("multi-reload", { ...existing, counter: 2, reloaded: true });
+    });
e2e/fireproof-basic.spec.ts (3)

42-44: Improve error handling specificity.

The error message could be more helpful by checking all required functions, not just fpPut.

-  // If functions aren't available, the import probably failed
-  if (windowFunctions.fpPut !== "function") {
-    throw new Error(`window.fpPut is ${windowFunctions.fpPut}, not function. Console messages: ${consoleMessages.join(", ")}`);
-  }
+  // Verify all required functions are available
+  const missingFunctions = Object.entries(windowFunctions)
+    .filter(([, type]) => type !== "function")
+    .map(([name]) => name);
+  
+  if (missingFunctions.length > 0) {
+    throw new Error(`Missing window functions: ${missingFunctions.join(", ")}. Console messages: ${consoleMessages.join(", ")}`);
+  }

47-51: Consider extracting test data to improve maintainability.

The test document structure is duplicated later in the test. Consider extracting to a shared constant or factory function.

+const createTestDoc = (suffix = "") => ({
+  value: `test-data-value${suffix}`,
+  timestamp: Date.now(),
+  message: `This is a test document${suffix ? ` ${suffix}` : ""} for E2E testing`,
+});
+
-  // Put a test document
-  const testDoc = {
-    value: "test-data-value",
-    timestamp: Date.now(),
-    message: "This is a test document for E2E testing",
-  };
+  // Put a test document
+  const testDoc = createTestDoc();

107-111: Use the suggested test data factory for consistency.

The second document creation should use the same pattern as the first for maintainability.

-  // Add a second document to test database versioning across reloads
-  const secondDoc = {
-    value: "second-test-value",
-    timestamp: Date.now(),
-    message: "This is a second test document to verify database versioning",
-  };
+  // Add a second document to test database versioning across reloads
+  const secondDoc = createTestDoc("second");
e2e/fixtures/fireproof-basic.html (1)

187-196: Potential race condition in auto-initialization.

The auto-initialization could conflict with manual initialization calls from tests. Consider adding a flag to prevent double initialization.

+      let isInitialized = false;
+
       async function initializeDatabase() {
         try {
+          if (isInitialized && db) {
+            showStatus(`Database '${dbName}' already initialized`);
+            return db;
+          }
           db = fireproof(dbName);
+          isInitialized = true;
           showStatus(`Database '${dbName}' initialized successfully`);
           return db;
         } catch (error) {
           showStatus(`Error initializing database: ${error.message}`, true);
           throw error;
         }
       }
📜 Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 32e2053 and a18e574.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (13)
  • core/tests/vitest.file.config.ts (1 hunks)
  • core/tests/vitest.indexeddb.config.ts (1 hunks)
  • core/tests/vitest.memory.config.ts (1 hunks)
  • e2e/fireproof-basic.spec.ts (1 hunks)
  • e2e/fixtures/fireproof-basic.html (1 hunks)
  • e2e/fixtures/page1.html (1 hunks)
  • e2e/fixtures/page2.html (1 hunks)
  • e2e/fixtures/page3.html (1 hunks)
  • e2e/localStorage-navigation.spec.ts (1 hunks)
  • e2e/localStorage-reload.spec.ts (1 hunks)
  • e2e/types.ts (1 hunks)
  • package.json (2 hunks)
  • playwright.config.ts (1 hunks)
🧰 Additional context used
🧠 Learnings (3)
📚 Learning: in src/use-fireproof/index.ts, the defaultchanged function intentionally throws an error as part of ...
Learnt from: mabels
PR: fireproof-storage/fireproof#801
File: src/use-fireproof/index.ts:19-22
Timestamp: 2025-05-29T11:19:21.299Z
Learning: In src/use-fireproof/index.ts, the defaultChanged function intentionally throws an error as part of a lazy initialization pattern. This error should only occur if the lazy logic fails to properly replace the default handler with actual event handlers during setup. The error serves as a fail-fast mechanism to catch initialization problems early.

Applied to files:

  • e2e/fixtures/fireproof-basic.html
  • e2e/fireproof-basic.spec.ts
  • e2e/types.ts
📚 Learning: for example applications in the fireproof-storage/fireproof repository, prefer simplicity over produ...
Learnt from: drmikecrowe
PR: fireproof-storage/fireproof#543
File: examples/react-router/src/App.tsx:6-17
Timestamp: 2025-01-15T12:48:26.350Z
Learning: For example applications in the fireproof-storage/fireproof repository, prefer simplicity over production-ready features like error boundaries and lazy loading, to maintain clarity and focus on demonstrating core concepts.

Applied to files:

  • e2e/fixtures/fireproof-basic.html
📚 Learning: the iframestrategy in src/use-fireproof/iframe-strategy.ts is not currently in active use but is mai...
Learnt from: mabels
PR: fireproof-storage/fireproof#801
File: src/use-fireproof/iframe-strategy.ts:72-79
Timestamp: 2025-05-13T14:06:17.899Z
Learning: The IframeStrategy in src/use-fireproof/iframe-strategy.ts is not currently in active use but is maintained to satisfy the TokenStrategie interface requirements. The stop() method is intentionally a no-op for this reason.

Applied to files:

  • e2e/types.ts
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: compile_test
🔇 Additional comments (29)
core/tests/vitest.indexeddb.config.ts (1)

9-9: LGTM! Proper test separation.

Adding "browser/**" to the exclude array correctly separates E2E browser tests from the IndexedDB Vitest suite, ensuring they run only via Playwright.

e2e/fixtures/page2.html (4)

1-49: Well-structured HTML test fixture.

The HTML structure, styling, and UI elements are properly organized for localStorage navigation testing. The page provides clear interactive elements and visual feedback.


52-76: Robust localStorage helper functions.

The helper functions provide good encapsulation for localStorage operations with proper JSON serialization/deserialization and error handling for missing data.


79-116: Comprehensive event handling setup.

The event listeners properly handle data updates, user additions, and display refreshes. The logic for incrementing update counts and managing user arrays is sound.


118-121: Proper global exposure for testing automation.

Exposing the helper functions on the window object correctly enables Playwright tests to interact with localStorage programmatically.

e2e/fixtures/page1.html (3)

1-49: Consistent HTML structure with page2.

The HTML structure and styling are consistent with page2.html, providing a cohesive multi-page test environment.


79-101: Appropriate page-specific event handling.

The event listeners implement page1-specific logic for setting initial data and clearing localStorage, which complements the functionality in other pages.


104-106: Consistent global exposure pattern.

The global function exposure follows the same pattern as page2.html, ensuring consistent Playwright test automation capabilities.

playwright.config.ts (3)

3-14: Solid basic test configuration.

The test directory, parallel execution, and CI-specific settings (forbidOnly, retries, workers) are well-configured for robust E2E testing.


15-21: Appropriate test options for E2E scenarios.

The base URL and trace collection on first retry provide good debugging capabilities while maintaining performance.


31-37: Proper web server configuration.

The http-server setup with disabled caching and CI-aware server reuse is appropriate for E2E testing scenarios.

core/tests/vitest.memory.config.ts (1)

16-16: Consistent test separation across configurations.

Adding "browser/**" to the exclude array maintains consistency with other Vitest configurations and properly separates E2E tests from the memory test suite.

core/tests/vitest.file.config.ts (1)

6-6: LGTM! Clean separation of test frameworks.

The addition of "browser/**" to the exclude array appropriately separates Playwright E2E tests from Vitest unit tests, maintaining clear boundaries between different test execution contexts.

e2e/fixtures/page3.html (2)

1-49: LGTM! Well-structured HTML test fixture.

The HTML structure is clean and semantic, with proper meta tags and accessible navigation elements. The styling provides clear visual separation for test elements.


97-100: All test page dependencies are present and helper functions exposure is consistent

  • e2e/fixtures/page1.html and page2.html both exist.
  • page1.html, page2.html, and page3.html each expose window.setTestData, window.getTestData, and window.displayStorageContent consistently.

No further action needed.

package.json (2)

39-40: LGTM! Well-structured E2E test scripts.

The new Playwright test scripts follow standard conventions with line reporting and headed mode options for debugging.


43-44: LGTM! Improved script output control.

The addition of --log-level silent and --quiet flags will reduce noise in CI/CD environments while maintaining functionality.

e2e/localStorage-reload.spec.ts (2)

3-8: LGTM! Proper test isolation with cleanup.

The beforeEach hook ensures each test starts with a clean localStorage state, preventing test interdependencies.


10-36: LGTM! Comprehensive reload persistence test.

The test properly verifies localStorage persistence through actual page reloads using realistic test data and multiple assertion points.

e2e/localStorage-navigation.spec.ts (3)

3-8: LGTM! Consistent test setup with reload tests.

The beforeEach cleanup ensures proper test isolation, matching the pattern used in the reload test suite.


155-188: LGTM! Comprehensive programmatic navigation test.

Excellent coverage of browser back/forward functionality and programmatic navigation patterns. The test properly verifies URL changes and data persistence across different navigation methods.


84-84: All referenced button and navigation IDs exist in fixtures

I’ve confirmed that the tests’ button IDs (#setData, #updateData, #addUser) are defined in e2e/fixtures/page1.html and page2.html, and the navigation links (#navToPage1, #navToPage2, #navToPage3) are present in page1.html, page2.html, and page3.html. No changes needed.

e2e/fireproof-basic.spec.ts (1)

137-138: Good practice: Sorting for consistent test assertions.

Excellent approach to handle non-deterministic ordering by sorting the results before assertions.

e2e/fixtures/fireproof-basic.html (3)

104-113: Good error handling pattern.

The try-catch block with UI feedback and error re-throwing is well implemented for debugging purposes.


117-117: Ensure database initialization before operations.

Good defensive programming to check and initialize the database if needed before each operation.


181-184: Global function exposure is appropriate for E2E testing.

The global window functions are properly scoped for testing purposes and follow a clear naming convention.

e2e/types.ts (3)

3-6: Well-structured interface for Fireproof documents.

The FireproofDoc interface correctly models the document structure with a required _id field and flexible additional properties.


21-27: Proper global Window interface extension.

The global Window interface extension follows TypeScript best practices and correctly types all the exposed functions.


30-30: Correct export pattern for type-only module.

The empty export statement properly makes this a module while only providing type augmentations.

});

// Wait for page to fully load and scripts to execute
await page.waitForTimeout(3000);
Copy link
Contributor

Choose a reason for hiding this comment

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

🛠️ Refactor suggestion

Replace hard-coded timeout with more reliable waiting strategy.

The 3-second timeout is arbitrary and could cause flaky tests in slower environments. Consider using more specific wait conditions.

-  // Wait for page to fully load and scripts to execute
-  await page.waitForTimeout(3000);
+  // Wait for Fireproof functions to be available
+  await page.waitForFunction(() => {
+    return typeof window.fpInit === 'function' && 
+           typeof window.fpPut === 'function' && 
+           typeof window.fpGet === 'function' && 
+           typeof window.fpAllDocs === 'function';
+  }, { timeout: 10000 });
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
await page.waitForTimeout(3000);
// Wait for Fireproof functions to be available
await page.waitForFunction(() => {
return typeof window.fpInit === 'function' &&
typeof window.fpPut === 'function' &&
typeof window.fpGet === 'function' &&
typeof window.fpAllDocs === 'function';
}, { timeout: 10000 });
🤖 Prompt for AI Agents
In e2e/fireproof-basic.spec.ts at line 22, replace the hard-coded 3-second
waitForTimeout with a more reliable waiting strategy by waiting for a specific
element or condition that indicates the page or feature is ready. Use methods
like page.waitForSelector or page.waitForFunction to wait for a meaningful event
instead of an arbitrary timeout to improve test stability.

</div>

<!-- Include Fireproof from CDN -->
<script src="https://cdn.jsdelivr.net/npm/@fireproof/core/dist/browser/fireproof.global.js"></script>
Copy link
Contributor

Choose a reason for hiding this comment

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

💡 Verification agent

🧩 Analysis chain

Consider CDN reliability and add fallback mechanism.

Loading Fireproof from CDN could cause test flakiness if the CDN is unavailable. Consider adding a fallback or using a local copy for E2E tests.

Let me check if there are any existing patterns for handling CDN dependencies in this project:


🏁 Script executed:

#!/bin/bash
# Search for other CDN usages and fallback patterns
rg -i "cdn\.|jsdelivr|unpkg" --type html --type js -A 3 -B 3

Length of output: 570


Add CDN fallback in E2E fixture

There’s no existing CDN‐fallback pattern in the project—if jsDelivr goes down, your E2E tests will break. Please update e2e/fixtures/fireproof-basic.html around line 80 to load a local copy when the CDN script fails. For example:

<script src="https://cdn.jsdelivr.net/npm/@fireproof/core/dist/browser/fireproof.global.js"></script>
<script>
  if (typeof Fireproof === 'undefined') {
    const script = document.createElement('script');
    script.src = '/e2e/libs/fireproof.global.js';  // adjust path as needed
    document.head.appendChild(script);
  }
</script>
  • File: e2e/fixtures/fireproof-basic.html
  • Location: insert fallback <script> immediately after the CDN <script>
🤖 Prompt for AI Agents
In e2e/fixtures/fireproof-basic.html at line 80, the current script tag loads
Fireproof from the jsDelivr CDN without a fallback, risking test failures if the
CDN is down. Add a script block immediately after the CDN script that checks if
the Fireproof object is undefined, and if so, dynamically loads a local copy of
the Fireproof script from a specified path like '/e2e/libs/fireproof.global.js'.
This ensures the E2E tests can still run using the local script if the CDN
fails.

Comment on lines +13 to +19
interface FireproofAllDocsResult {
rows: {
key: string;
value: FireproofDoc;
}[];
clock: unknown[];
}
Copy link
Contributor

Choose a reason for hiding this comment

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

💡 Verification agent

🧩 Analysis chain

Consider more specific typing for the clock property.

The clock property is typed as unknown[] which might be too generic. Consider defining a more specific type if the clock structure is known.

Let me check the actual Fireproof API to understand the clock structure:


🏁 Script executed:

#!/bin/bash
# Search for clock-related types or usage in the codebase
rg -i "clock.*:" --type ts --type js -A 2 -B 2
ast-grep --pattern 'clock: $_'

Length of output: 12036


Use Fireproof’s ClockHead for the clock field
Replace the generic unknown[] with the concrete ClockHead to improve type safety:

  • File: e2e/types.ts (lines 13–19)
     interface FireproofAllDocsResult {
       rows: {
         key: string;
         value: FireproofDoc;
       }[];
  • clock: unknown[];
  • clock: ClockHead;
    }
- Add import at the top of `e2e/types.ts`:
```ts
import type { ClockHead } from "@fireproof/core-types-base";
🤖 Prompt for AI Agents
In e2e/types.ts around lines 13 to 19, replace the type of the clock field in
the FireproofAllDocsResult interface from unknown[] to the specific ClockHead
type for better type safety. To do this, add an import statement at the top of
the file: import type { ClockHead } from "@fireproof/core-types-base"; then
update the clock field's type to ClockHead.

"devDependencies": {
"@eslint/js": "^9.32.0",
"@fireproof/core-cli": "workspace:0.0.0",
"@playwright/test": "^1.54.2",
Copy link
Contributor

Choose a reason for hiding this comment

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

💡 Verification agent

🧩 Analysis chain

Verify Playwright dependency versions are current.

The Playwright dependencies have been updated to version 1.54.2. Ensure this is the latest stable version and check for any security advisories.

Also applies to: 78-78, 80-81


🌐 Web query:

What is the latest stable version of Playwright and @playwright/test? Are there any known security issues with version 1.54.2?

💡 Result:

As of August 4, 2025, the latest stable version of Playwright is v1.54.1, released on July 11, 2025. (versionrelease.com) The corresponding version of @playwright/test is v1.54.0, released on July 8, 2025. (releasealert.dev)

Regarding version 1.54.2, there is no record of such a release. The latest stable release is v1.54.1. Additionally, there are no known security issues associated with version 1.54.1. The Playwright team maintains a comprehensive release notes page, which includes details on each release and any associated security advisories.

Citations:


🏁 Script executed:

#!/bin/bash
# Search for all Playwright-related dependencies in package.json with line numbers
rg -n '"playwright' package.json || true

Length of output: 264


🏁 Script executed:

#!/bin/bash
# Find @playwright/test dependency in package.json
rg -n '"@playwright/test"' -C2 package.json || true

Length of output: 229


Update Playwright dependency versions to actual latest stable releases

The version ^1.54.2 doesn’t exist. Please adjust to the real latest stable versions and confirm no outstanding security advisories:

• In package.json

  • Change “playwright” and “playwright-chromium” to ^1.54.1 (latest Playwright core)
  • Change “@playwright/test” to ^1.54.0 (latest test runner)

Suggested diff:

-  "playwright": "^1.54.2",
+  "playwright": "^1.54.1",

-  "playwright-chromium": "^1.54.2",
+  "playwright-chromium": "^1.54.1",

-  "@playwright/test": "^1.54.2",
+  "@playwright/test": "^1.54.0",

After updating, verify against the official Playwright release notes for any security advisories.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
"@playwright/test": "^1.54.2",
"playwright": "^1.54.1",
"playwright-chromium": "^1.54.1",
"@playwright/test": "^1.54.0",
🤖 Prompt for AI Agents
In package.json at line 71, the version "^1.54.2" for "@playwright/test" is
invalid. Update the version to "^1.54.0" for "@playwright/test" and also update
"playwright" and "playwright-chromium" dependencies to "^1.54.1" as per the
latest stable releases. After making these changes, check the official
Playwright release notes to ensure there are no outstanding security advisories.

@mabels
Copy link
Contributor

mabels commented Aug 5, 2025

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.

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.

3 participants