Skip to content

fix(ci): resolve playwright timeout by pushing db schema#137

Merged
DataDave-Dev merged 2 commits into
DataDave-Dev:mainfrom
YasserYG8:feature/playwright
Jun 25, 2026
Merged

fix(ci): resolve playwright timeout by pushing db schema#137
DataDave-Dev merged 2 commits into
DataDave-Dev:mainfrom
YasserYG8:feature/playwright

Conversation

@YasserYG8

@YasserYG8 YasserYG8 commented Jun 23, 2026

Copy link
Copy Markdown
Contributor

Issue Summary: Playwright E2E CI Timeout Fix

1. Problem Description

During continuous integration (CI), the e2e job within .github/workflows/ci.yml consistently timed out while waiting for the Next.js web server to become healthy:

playwright webServer: timed out waiting 60000ms

Symptoms

In the web server log output, the following error repeated:

SQLITE_ERROR: no such table: testimonial

This error occurred during the rendering of the Testimonials component, which performs a database query on startup.


2. Root Cause

  1. Environment Setup: The E2E job sets the environment variable TURSO_DATABASE_URL to file:local.db.
  2. Untracked Database: Since local.db is configured in .gitignore, the SQLite file does not exist when the action checkouts the codebase in the clean runner environment.
  3. Missing Schema Initialization: The workflow was immediately starting the web server (pnpm dev) and running pnpm test:e2e without initializing the database schema.
  4. Crash on Query: Any request to components retrieving testimonials failed due to the missing table testimonial, rendering the server unhealthy and causing Playwright to hit its timeout threshold.

3. Solution

We inserted a step to initialize/push the database schema using Drizzle Kit right after installing dependencies and before launching Playwright.

Changes Made

In .github/workflows/ci.yml:

       - run: pnpm install --frozen-lockfile
 
+      - name: Push database schema
+        run: pnpm db:push
+
       - name: Install Playwright Chromium Browser
         run: pnpm exec playwright install --with-deps chromium

Why this works:

  • pnpm db:push (which maps to drizzle-kit push) reads the active TURSO_DATABASE_URL (file:local.db) and automatically generates the file and the database schema defined in src/db/schema.ts.
  • Since it is a new SQLite database, the push runs non-interactively without prompting or requiring user input.
  • Once the tables exist, queries return successfully (returning an empty list [] of testimonials), allowing the homepage and app path to load and respond with a 200 OK status, satisfying the Playwright health check.

Summary by CodeRabbit

  • Chores
    • Updated the continuous integration E2E flow to push the database schema before running Playwright smoke tests, improving consistency and reliability.
  • Tests
    • Improved Playwright smoke test assertions for React Flow node label formatting while preserving the same verification coverage.
  • Style
    • Adjusted minor formatting in the theme toggle logic and related theme hook formatting without changing behavior.

@coderabbitai

coderabbitai Bot commented Jun 23, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: da5a43a2-d530-4789-9a57-beed219e7b01

📥 Commits

Reviewing files that changed from the base of the PR and between 67b2f61 and 2f1aa68.

📒 Files selected for processing (3)
  • e2e/smoke.spec.ts
  • src/components/layout/ThemeToggle.tsx
  • src/lib/use-theme.ts
✅ Files skipped from review due to trivial changes (3)
  • e2e/smoke.spec.ts
  • src/components/layout/ThemeToggle.tsx
  • src/lib/use-theme.ts

📝 Walkthrough

Walkthrough

A "Push database schema" step running pnpm db:push is added to the e2e CI job before Playwright installation and smoke tests. E2E test assertions for React Flow node labels are reformatted across multiple lines for readability. Minor whitespace adjustments are made to theme-related components.

Changes

E2E CI Database Schema Push and Test Updates

Layer / File(s) Summary
Add db:push before E2E tests
.github/workflows/ci.yml
Inserts a "Push database schema" step that runs pnpm db:push in the e2e job, ordered before Playwright installation and smoke test execution.
Reformat E2E test assertions
e2e/smoke.spec.ts
Node-label visibility assertions for snippet.py, main, and clean are reformatted from single-line chains into multi-line await expect(page.locator(...)).toBeVisible() blocks; test function parameter formatting adjusted for consistency.
Code formatting cleanup
src/components/layout/ThemeToggle.tsx, src/lib/use-theme.ts
Whitespace adjustments inside the toggle function and at the useIsDark closing brace; no logic or behavioral changes.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Possibly related PRs

  • DataDave-Dev/weftmap#134: Modifies pnpm action configuration in the CI workflow that affects how pnpm commands (including the new pnpm db:push) are executed in the e2e job.
  • DataDave-Dev/weftmap#136: Introduces the initial e2e CI job and smoke test assertions that this PR extends with schema migration and assertion reformatting.

Poem

🐇 Schema pushed before the tests take flight,
Assertions reformatted, clean and bright!
A little whitespace here and there,
Orderly cleanup with utmost care.
The codebase hops along just right! ✨

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (2 warnings)

Check name Status Explanation Resolution
Description check ⚠️ Warning The description provides comprehensive problem context, root cause analysis, and solution explanation. However, it does not follow the required Spanish template with 'Qué hace', 'Tipo', and 'Checklist' sections. Reformat the description to follow the repository's template structure including 'Qué hace', type selection, and checklist items.
Docstring Coverage ⚠️ Warning Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title accurately summarizes the main change: adding a database schema push step to fix Playwright timeouts in CI.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

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

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

@YasserYG8

Copy link
Copy Markdown
Contributor Author

CI/Build Failures & Fixes Summary

We resolved two separate failures in the CI pipeline:

1. **Playwright E2E Test Timeout Fix:**
   * **Issue:** The E2E tests timed out because the database was missing in the clean CI runner. The app crashed on launch with `SQLITE_ERROR: no

such table: testimonialwhen rendering the testimonials section, preventing the server from booting. * **Fix:** Addedpnpm db:pushto.github/workflows/ci.yml` before the E2E tests step. This initializes the SQLite database schema dynamically,
allowing the app to start up successfully.

2. **Prettier Formatting Fix:**
   * **Issue:** The `pnpm format:check` check failed due to minor styling mismatches in `e2e/smoke.spec.ts`, `src/components/layout/ThemeToggle.tsx`,

and src/lib/use-theme.ts (long lines, trailing spaces, missing final newlines).
* Fix: Ran pnpm exec prettier --write to format the files correctly and committed the updates.

@DataDave-Dev DataDave-Dev merged commit 71f6c3c into DataDave-Dev:main Jun 25, 2026
3 checks passed
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