Merge pull request #1314 from makeabilitylab/1110-member-page-load-more

Member page: dynamic load-more, vertical papers, bio expand, section nav (#1110)

Author: jonfroehlich

.github/workflows/test.yml

@@ -58,3 +58,66 @@ jobs:
 
       - name: Run tests
         run: python manage.py test website --settings=makeabilitylab.settings_test --verbosity=2
+
+  # Browser end-to-end tests (member-page "Load more"/"Load all", bio toggle,
+  # section nav). Kept in a SEPARATE job from `test` so the fast unit/integration
+  # signal stays fast and isolated — a slow or flaky browser run doesn't muddy
+  # "did the logic break?". Like `test`, this is report-only (it doesn't block
+  # the push or the deploy). Playwright + its browser live in requirements-dev.txt
+  # only, never in the production image.
+  e2e:
+    runs-on: ubuntu-latest
+
+    services:
+      postgres:
+        image: postgres:16
+        env:
+          POSTGRES_DB: makeability
+          POSTGRES_USER: admin
+          POSTGRES_PASSWORD: password
+        ports:
+          - 5432:5432
+        options: >-
+          --health-cmd "pg_isready -U admin -d makeability"
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+
+    env:
+      DATABASE_HOST: localhost
+      DATABASE_PORT: 5432
+      DJANGO_ENV: DEBUG
+
+    steps:
+      - uses: actions/checkout@v4
+
+      # Same ImageMagick/Ghostscript deps as `test` — the Talk fixtures the e2e
+      # tests create run Artifact.save()'s PDF->thumbnail path.
+      - name: Install system dependencies
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y --no-install-recommends imagemagick ghostscript libpq-dev
+          sudo cp imagemagick-policy.xml /etc/ImageMagick-6/policy.xml
+
+      - name: Set up Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: "3.13"
+          cache: pip
+
+      - name: Install Python dependencies (incl. Playwright)
+        run: pip install -r requirements-dev.txt
+
+      # Cache the downloaded browser keyed on the pinned Playwright version, so
+      # only the first run (or a version bump) pays the ~120 MB download.
+      - name: Cache Playwright browser
+        uses: actions/cache@v4
+        with:
+          path: ~/.cache/ms-playwright
+          key: playwright-${{ hashFiles('requirements-dev.txt') }}
+
+      - name: Install Chromium for Playwright
+        run: python -m playwright install --with-deps chromium
+
+      - name: Run end-to-end tests
+        run: python manage.py test website.tests.test_member_e2e --settings=makeabilitylab.settings_test --verbosity=2

makeabilitylab/settings.py

@@ -72,8 +72,8 @@
     ALLOWED_HOSTS = ['*']
 
 # Makeability Lab Global Variables, including Makeability Lab version
-ML_WEBSITE_VERSION = "2.8.2" # Keep this updated with each release and also change the short description below
-ML_WEBSITE_VERSION_DESCRIPTION = "SEO: add a dynamic sitemap.xml and advertise it in robots.txt (#1252). /sitemap.xml is generated on each request from our querysets via django.contrib.sitemaps — static listing pages (home, people, publications, projects, awards, news), visible projects, people with a position, and news items — so it stays current with no maintenance. It emits the correct per-environment domain via RequestSite (no django.contrib.sites, no DB migration) and pins URLs to https so the sitemap lists canonical links rather than http URLs that 302-redirect. Validated on the test server: all 189 sitemap URLs return 200. The top-level static robots.txt (served directly by Apache, not Django) now points crawlers at the sitemap. Remaining one-time step: submit the sitemap in Google Search Console once it is live on production."
+ML_WEBSITE_VERSION = "2.9.0" # Keep this updated with each release and also change the short description below
+ML_WEBSITE_VERSION_DESCRIPTION = "Member pages: dynamic per-section 'Load more'/'Load all' backed by a new member_artifacts AJAX endpoint that renders the same snippet templates, with higher initial counts (8 projects / 6 papers / 6 videos / 8 talks; 4/3/3/4 on mobile via a CSS cap). Fixes the recent-projects ordering (now sorted by most-recent-artifact date, descending, instead of a set re-sorted by project start_date). Prolific members' papers switch from the 3-up card grid to a scannable vertical list; over-long bios get a Show more/less toggle. Adds a sticky section nav with scroll-spy, the person's name revealed once the heading scrolls away, and live (loaded/total) counts shown in both the nav and the section headings (which drop the old 'Recent' wording); plus a floating Back to top button. Covered by unit/integration tests and a Playwright browser e2e suite wired into a new report-only CI job (#1110)."
 DATE_MAKEABILITYLAB_FORMED = datetime.date(2012, 1, 1)  # Date Makeability Lab was formed
 MAX_BANNERS = 7 # Maximum number of banners on a page
 

requirements-dev.txt

@@ -0,0 +1,17 @@
+# Development / test-only dependencies.
+#
+# These are NOT installed into the production (or test/prod server) image — the
+# Dockerfile installs requirements.txt only — which keeps Playwright and its
+# ~120 MB browser out of the deployed stack. This file is used by the Playwright
+# end-to-end CI job (.github/workflows/test.yml) and for running the browser
+# tests locally:
+#
+#   pip install -r requirements-dev.txt
+#   python -m playwright install --with-deps chromium
+#   python manage.py test website.tests.test_member_e2e \
+#       --settings=makeabilitylab.settings_test
+#
+# Pin Playwright so the pip package and the installed browser build stay in
+# lockstep (a mismatch makes `playwright install` download the wrong revision).
+-r requirements.txt
+playwright==1.60.0