Feat: Playwright setup

compose.yml

@@ -41,3 +41,15 @@ services:
       - "8000"
     volumes:
       - ./.devcontainer:/.devcontainer
+
+  playwright:
+    build:
+      context: .
+      dockerfile: playwright/Dockerfile
+    image: benefits_client:playwright
+    env_file: playwright/.env
+    volumes:
+      - ./playwright:/playwright
+    # https://code.visualstudio.com/docs/remote/create-dev-container#_use-docker-compose
+    entrypoint: sleep infinity
+    profiles: ["testing"]

playwright/.env.sample

@@ -0,0 +1,10 @@
+MEDICARE_FLOW_USERNAME=
+MEDICARE_FLOW_PASSWORD=
+
+AGENCY_CARD_SUB=
+AGENCY_CARD_NAME=
+
+TRANSIT_PROCESSOR_CARDHOLDER_NAME=
+TRANSIT_PROCESSOR_CARD_NUMBER=
+TRANSIT_PROCESSOR_CARD_EXPIRATION=
+TRANSIT_PROCESSOR_CARD_SECURITY_CODE=

playwright/.gitignore

@@ -0,0 +1,3 @@
+__pycache__
+.pytest_cache
+test-results

playwright/Dockerfile

@@ -0,0 +1,11 @@
+# https://playwright.dev/docs/docker
+FROM mcr.microsoft.com/playwright/python:v1.48.0-jammy
+
+WORKDIR /playwright
+
+COPY playwright/requirements.txt requirements.txt
+
+RUN python -m pip install --upgrade pip && \
+   pip install -r requirements.txt
+
+USER pwuser

playwright/pytest.ini

@@ -0,0 +1,2 @@
+[pytest]
+addopts = --tracing on -v --template=html1/index.html --report=test-results/report.html --video on

playwright/requirements.txt

@@ -0,0 +1,3 @@
+pytest
+pytest-playwright
+pytest-reporter-html1

playwright/run.sh

@@ -0,0 +1,8 @@
+#!/bin/bash
+
+set -e
+
+base_url="https://dev-benefits.calitp.org"
+
+# also uses arguments from pytest.ini
+pytest --base-url $base_url

playwright/test_agencycard_flow.py

@@ -0,0 +1,70 @@
+import os
+
+from playwright.sync_api import Page, expect
+
+
+def test_agency_card_flow(page: Page):
+    page.goto("https://dev-benefits.calitp.org/")
+
+    # Index - select transit agency
+    page.get_by_role("link", name="Choose your Provider").click()
+    page.get_by_role("link", name="California State Transit (dev)").click()
+
+    # Eligibility Index - select enrollment flow
+    page.get_by_label("Agency Cardholder").check()
+    page.get_by_role("button", name="Choose this benefit").click()
+
+    # Eligibility Start - continue
+    page.get_by_role("button", name="Continue").click()
+
+    # Eligibility Confirm - fill out form and submit
+    page.get_by_placeholder("12345").click()
+
+    sub = os.environ.get("AGENCY_CARD_SUB")
+    page.get_by_placeholder("12345").fill(sub)
+    page.keyboard.press("Tab")
+
+    name = os.environ.get("AGENCY_CARD_NAME")
+    page.get_by_placeholder("Hernandez-Demarcos").fill(name)
+
+    page.get_by_role("button", name="Find my record").click()
+
+    # Enrollment Index - fill out transit processor form in pop-up window
+    page.mouse.wheel(0, 200)
+
+    with page.expect_popup() as popup_info:
+        page.get_by_role("button", name="Enroll").click()
+
+    popup = popup_info.value
+    popup.wait_for_timeout(3000)
+
+    popup.get_by_text("Cardholder name").click()
+
+    cardholder_name = os.environ.get("TRANSIT_PROCESSOR_CARDHOLDER_NAME")
+    popup.get_by_label("Cardholder name").fill(cardholder_name)
+    popup.keyboard.press("Tab")
+
+    card_number = os.environ.get("TRANSIT_PROCESSOR_CARD_NUMBER")
+    popup.get_by_label("Card number").fill(card_number)
+    popup.keyboard.press("Tab")
+
+    expiration = os.environ.get("TRANSIT_PROCESSOR_CARD_EXPIRATION")
+    popup.get_by_label("mm/yy").fill(expiration)
+    popup.keyboard.press("Tab")
+
+    security_code = os.environ.get("TRANSIT_PROCESSOR_CARD_SECURITY_CODE")
+    popup.get_by_text("Security code", exact=True).click()
+    popup.get_by_label("Security code").fill(security_code)
+
+    # trigger form validation - not sure why their form behaves this way
+    popup.keyboard.press("Shift+Tab")
+    popup.keyboard.press("Shift+Tab")
+    popup.keyboard.press("Shift+Tab")
+    popup.keyboard.press("Tab")
+
+    popup.get_by_role("group", name="Enter your card details").get_by_role("button").click()
+
+    page.wait_for_timeout(10000)
+
+    success_message = page.get_by_text("You can now use your contactless card to tap to ride with a reduced fare!")
+    expect(success_message).to_be_visible()

playwright/test_logingov_flow.py

@@ -0,0 +1,13 @@
+from playwright.sync_api import Page
+
+
+def test_older_adult_flow(page: Page):
+    pass
+
+
+def test_veteran_flow(page: Page):
+    pass
+
+
+def test_calfresh_cardholder_flow(page: Page):
+    pass

playwright/test_medicaregov_flow.py

@@ -0,0 +1,26 @@
+import os
+
+import pytest
+
+from playwright.sync_api import Page, expect
+
+
+@pytest.mark.skip(reason="WIP - Medicare.gov not allowing test to login")
+def test_medicare_cardholder_flow(page: Page):
+    page.goto("/")
+    page.click("text='Choose your Provider'")
+    page.get_by_role("link", name="California State Transit (dev)").click()
+    page.get_by_label("Medicare Cardholder You must").check()
+    page.get_by_role("button", name="Choose this benefit").click()
+    page.get_by_role("button", name="Continue to Medicare.gov").click()
+    page.get_by_label("Username", exact=True).click()
+
+    username = os.environ.get("MEDICARE_FLOW_USERNAME")
+    page.get_by_label("Username", exact=True).fill(username)
+
+    password = os.environ.get("MEDICARE_FLOW_PASSWORD")
+    page.get_by_label("Password").fill(password)
+
+    page.get_by_role("button", name="Log in").click()
+
+    expect

pyproject.toml

@@ -38,6 +38,7 @@ test = [
     "pytest",
     "pytest-django",
     "pytest-mock",
+    "pytest-playwright", # only for writing tests. run tests using playwright Docker Compose service
     "pytest-socket",
 ]
 

tests/pytest/run.sh

@@ -2,7 +2,7 @@
 set -eu
 
 # run normal pytests
-coverage run -m pytest
+coverage run -m pytest tests/pytest
 
 # clean out old coverage results
 rm -rf benefits/static/coverage