Run the playwright tests against multiple browsers.

.github/workflows/tests.yml

@@ -54,7 +54,18 @@ jobs:
         run: uv run pytest --cov --cov-branch --cov-report=xml --cov-report=term
 
       - name: Run playwright tests
-        run: uv run pytest --tracing retain-on-failure -m playwright --cov --cov-branch --cov-report=xml --cov-append --cov-report=term
+        run: >-
+          uv run pytest
+          --tracing retain-on-failure
+          -m playwright
+          --browser webkit
+          --browser firefox
+          --browser chromium
+          --cov
+          --cov-branch
+          --cov-report=xml
+          --cov-append
+          --cov-report=term
 
       - name: Upload results to Codecov
         uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de  # v5

tests/conftest.py

@@ -1,11 +1,35 @@
 import os
+import re
 
 import pytest
-from playwright.sync_api import expect
+from playwright.sync_api import Page, expect
 
 expect.set_options(timeout=5_000)
 
 
+def drag_select(page: Page, from_locator, to_locator) -> None:
+    """Simulate a mouse drag selection between two elements.
+
+    Uses explicit mouse events (mousedown/mousemove/mouseup) instead of
+    Playwright's drag_to(), which uses HTML5 drag events that libraries
+    like Viselect don't listen for — causing failures in WebKit.
+    """
+    from_locator.scroll_into_view_if_needed()
+    to_locator.scroll_into_view_if_needed()
+    box_start = from_locator.bounding_box()
+    box_end = to_locator.bounding_box()
+    start_x = box_start["x"] + box_start["width"] / 2
+    start_y = box_start["y"]
+    end_x = box_end["x"] + box_end["width"] / 2
+    end_y = box_end["y"] + box_end["height"]
+    page.mouse.move(start_x, start_y)
+    page.mouse.down()
+    page.mouse.move(end_x, end_y)
+    # Wait for viselect to visually mark the last cell before releasing
+    expect(to_locator).to_have_class(re.compile(r"\bselecting\b"))
+    page.mouse.up()
+
+
 def pytest_addoption(parser):
     """Add custom command-line options."""
     parser.addoption(

tests/test_complete_session_onboarding_flow.py

@@ -54,6 +54,8 @@
 from django.utils.http import urlsafe_base64_encode
 from playwright.sync_api import BrowserContext, Page, expect
 
+from tests.conftest import drag_select
+
 from accounts.models import CustomUser
 from accounts.tokens import account_activation_token
 from home.models import Project, Question, Session, SessionMembership, Survey, Team
@@ -179,8 +181,7 @@ def set_availability(self, page: Page, username: str):
         # Select some availability slots (Monday 9 AM - 10 AM)
         monday_9am = page.locator('.time-slot[data-day="1"][data-hour="9"]')
         monday_10am = page.locator('.time-slot[data-day="1"][data-hour="10"]')
-        monday_9am.drag_to(monday_10am)
-        page.wait_for_timeout(200)
+        drag_select(page, monday_9am, monday_10am)
 
         # Save availability
         page.get_by_role("button", name="Save Availability").first.click()

tests/test_end_to_end.py

@@ -20,6 +20,8 @@
 from playwright.sync_api import expect, BrowserContext
 from playwright.sync_api import Page
 
+from tests.conftest import drag_select
+
 from accounts.factories import UserFactory, UserAvailabilityFactory
 from accounts.models import CustomUser
 from home.factories import (
@@ -419,12 +421,7 @@ def test_availability_workflow(self, page: Page, authenticated_user):
         monday_10am = page.locator('.time-slot[data-day="1"][data-hour="10"]')
         monday_1030am = page.locator('.time-slot[data-day="1"][data-hour="10.5"]')
 
-        # Use drag selection to select the block
-        # Drag from the first cell to the last cell
-        monday_9am.drag_to(monday_1030am)
-
-        # Wait for selection to be processed
-        page.wait_for_timeout(200)
+        drag_select(page, monday_9am, monday_1030am)
 
         # Wait for the first cell to have the selected class
         # (indicates JS has processed the selection)
@@ -491,12 +488,7 @@ def test_availability_workflow(self, page: Page, authenticated_user):
         tuesday_230pm = page.locator('.time-slot[data-day="2"][data-hour="14.5"]')
         tuesday_3pm = page.locator('.time-slot[data-day="2"][data-hour="15"]')
 
-        # Use drag selection to select the new block
-        # Drag from the first cell to the last cell
-        tuesday_2pm.drag_to(tuesday_3pm)
-
-        # Wait for selection to be processed
-        page.wait_for_timeout(200)
+        drag_select(page, tuesday_2pm, tuesday_3pm)
 
         # Verify all cells in the new block are selected
         expect(tuesday_2pm).to_have_class(re.compile(r".*\bselected\b.*"))