[ENHANCEMENT] [MER-5988] Automate key Simple Author features

.github/workflows/pr-playwright.yml

@@ -133,12 +133,27 @@ jobs:
         run: yarn install --frozen-lockfile
 
       # Watchers are disabled for MIX_ENV=ci_e2e (config/ci_e2e.exs),
-      # so the JS/CSS bundles the app serves must be built once, upfront,
-      # rather than relying on the dev watcher process to build them live.
+      # so the assets the app serves must be built once, upfront, rather
+      # than relying on the dev watcher processes to build them live.
+      # Webpack builds the JS bundles here; the Tailwind CSS is built by
+      # Mix in the next step.
       - name: Build frontend assets
         working-directory: assets
         run: yarn run deploy
 
+      # Writes priv/static/css/app.css, which every layout loads. Without
+      # it, pages render unstyled and responsive (md:hidden, etc.) markup
+      # stays visible.
+      - name: Build Tailwind CSS
+        run: set -a && source oli.env && mix tailwind default --minify
+
+      # Adaptive lesson rules are evaluated server-side by Node.js
+      # (priv/node/rules.js and eval.js, as built in the Dockerfile).
+      # Without these bundles every adaptive "Check" fails with a 500.
+      - name: Build server-side evaluation bundles
+        working-directory: assets
+        run: yarn run deploy-node
+
       - name: Install Playwright dependencies
         working-directory: assets/automation
         run: npm ci
@@ -167,9 +182,11 @@ jobs:
           cat /tmp/torus-server.log
           exit 1
 
+      # Spec files run in parallel across workers; tests within a file stay
+      # serial because playwright.config.ts keeps fullyParallel off.
       - name: Run @pr-tagged Playwright tests
         working-directory: assets/automation
-        run: npx playwright test --grep @pr --reporter=line
+        run: npx playwright test --grep @pr --reporter=line --workers=2
 
       - name: Upload Playwright report
         if: failure()

assets/automation/package.json

@@ -10,6 +10,7 @@
     "test-oauth-logins": "npm run pw oauth-login.spec.ts",
     "test-useraccounts": "npm run pw user-accounts.spec",
     "test-account-linking-smoke": "npm run pw user-accounts.spec -- --grep @account-linking",
+    "test-simple-author": "npm run pw simple-author.spec.ts",
     "test-all": "npm run pw user-accounts.spec course-authoring.spec.ts",
     "show-report": "npx playwright show-report",
     "lint": "eslint .",

assets/automation/src/core/fixture/my-fixture.ts

@@ -10,6 +10,7 @@ import { AccountLinkingTask } from '@tasks/AccountLinkingTask';
 import { CurriculumTask } from '@tasks/CurriculumTask';
 import { HomeTask } from '@tasks/HomeTask';
 import { ProjectTask } from '@tasks/ProjectTask';
+import { SimpleAuthorTask } from '@tasks/SimpleAuthorTask';
 import { StudentTask } from '@tasks/StudentTask';
 import {
   getBaseUrl,
@@ -27,6 +28,7 @@ type MyFixtures = {
   curriculumTask: CurriculumTask;
   homeTask: HomeTask;
   projectTask: ProjectTask;
+  simpleAuthorTask: SimpleAuthorTask;
   studentTask: StudentTask;
   seedScenario: (
     relativePath: string,
@@ -88,6 +90,12 @@ export const test = base.extend<MyFixtures>({
     },
     { title: '📂 Project Task' },
   ],
+  simpleAuthorTask: [
+    async ({ page }, use) => {
+      await use(new SimpleAuthorTask(page));
+    },
+    { title: '🧩 Simple Author Task' },
+  ],
   studentTask: [
     async ({ page }, use) => {
       await use(new StudentTask(page));

assets/automation/src/systems/torus/pom/course/StudentCoursePO.ts

@@ -88,7 +88,7 @@ export class StudentCoursePO {
       }
     }
 
-    await Verifier.expectIsVisible(this.page.getByRole('heading', { name: pageName, exact: true }));
+    await Verifier.expectIsVisible(this.openedPageTitle(pageName));
   }
 
   async openFirstPage(pageName: string) {
@@ -105,15 +105,28 @@ export class StudentCoursePO {
         startCourse.click(),
       ]);
 
-      await Verifier.expectIsVisible(
-        this.page.getByRole('heading', { name: pageName, exact: true }),
-      );
+      await Verifier.expectIsVisible(this.openedPageTitle(pageName));
       return;
     }
 
     await this.openPage(pageName);
   }
 
+  /**
+   * The title of an opened page. Basic pages render it as a heading. The adaptive
+   * lesson header renders it as plain text after a screen-reader "Title:" prefix.
+   */
+  private openedPageTitle(pageName: string) {
+    const adaptiveHeaderTitle = this.page
+      .locator('#delivery-header .lessonTitle')
+      .filter({ hasText: new RegExp(`(^|\\s)${escapeRegExp(pageName)}$`) });
+
+    return this.page
+      .getByRole('heading', { name: pageName, exact: true })
+      .or(adaptiveHeaderTitle)
+      .first();
+  }
+
   private galleryTitle(pageName: string) {
     return this.page.getByRole('heading', {
       name: pageName,
@@ -277,3 +290,7 @@ export class StudentCoursePO {
 function isStudentLessonPath(pathname: string) {
   return pathname.includes('/lesson/') || pathname.includes('/adaptive_lesson/');
 }
+
+function escapeRegExp(value: string) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}

assets/automation/src/systems/torus/pom/delivery/AdaptiveDeckPO.ts

@@ -112,6 +112,15 @@ export class AdaptiveDeckPO {
       .catch(() => '');
   }
 
+  /**
+   * The deck's single footer control, including while it is disabled during a
+   * check. Its label follows the screen state (the screen's check label, then
+   * the feedback's button label).
+   */
+  footerButton(): Locator {
+    return this.page.locator('.checkContainer .buttonContainer button').first();
+  }
+
   // ------------------------------------------------------------ navigation
 
   /**

assets/automation/src/systems/torus/pom/page/BasicPracticePagePO.ts

@@ -164,21 +164,7 @@ export class BasicPracticePagePO {
 
   async ensureSimpleAuthorReady() {
     await this.completeSimpleAuthorOnboardingIfPresent();
-
-    const hasToggle = (await this.adaptiveReadOnlyInput.count().catch(() => 0)) > 0;
-    if (hasToggle && (await this.adaptiveReadOnlyInput.isChecked().catch(() => false))) {
-      await expect(this.adaptiveReadOnlyInput).toBeEnabled({ timeout: 30000 });
-
-      await this.page.evaluate(() => {
-        const input = document.querySelector<HTMLInputElement>('input[name="adaptive_read_only"]');
-
-        if (input?.checked) {
-          input.click();
-        }
-      });
-
-      await expect(this.adaptiveReadOnlyInput).not.toBeChecked({ timeout: 10000 });
-    }
+    await this.disableAdaptiveReadOnly();
 
     await this.adaptiveAuthorToolbar.first().waitFor({ state: 'visible', timeout: 30000 });
     await expect(
@@ -192,6 +178,26 @@ export class BasicPracticePagePO {
     });
   }
 
+  /** Switches a reopened adaptive lesson out of read-only mode when it loads locked. */
+  async disableAdaptiveReadOnly() {
+    const hasToggle = (await this.adaptiveReadOnlyInput.count().catch(() => 0)) > 0;
+    if (!hasToggle) return;
+
+    // The toggle reflects the lock state only once it is enabled.
+    await expect(this.adaptiveReadOnlyInput).toBeEnabled({ timeout: 30000 });
+    if (!(await this.adaptiveReadOnlyInput.isChecked().catch(() => false))) return;
+
+    await this.page.evaluate(() => {
+      const input = document.querySelector<HTMLInputElement>('input[name="adaptive_read_only"]');
+
+      if (input?.checked) {
+        input.click();
+      }
+    });
+
+    await expect(this.adaptiveReadOnlyInput).not.toBeChecked({ timeout: 10000 });
+  }
+
   private async assertAdvancedAuthorEditable() {
     await expect(this.editTitleButton, 'Advanced authoring should be editable.').toBeEnabled({
       timeout: 15000,