Switch to running QUnit tests via Playwright instead of Puppeteer.

Author: johnbillion

.github/workflows/reusable-javascript-tests.yml

@@ -5,12 +5,6 @@ name: JavaScript tests
 
 on:
   workflow_call:
-    inputs:
-      disable-apparmor:
-        description: 'Whether to disable AppArmor.'
-        required: false
-        type: 'boolean'
-        default: false
 
 # Disable permissions for all available scopes by default.
 # Any needed permissions should be configured at the job level.
@@ -55,15 +49,6 @@ jobs:
       - name: Install npm Dependencies
         run: npm ci
 
-      # Older branches using outdated versions of Puppeteer fail on newer versions of the `ubuntu-24` image.
-      # This disables AppArmor in order to work around those failures.
-      #
-      # See https://issues.chromium.org/issues/373753919
-      # and https://chromium.googlesource.com/chromium/src/+/main/docs/security/apparmor-userns-restrictions.md
-      - name: Disable AppArmor
-        if: ${{ inputs.disable-apparmor }}
-        run: echo 0 | sudo tee /proc/sys/kernel/apparmor_restrict_unprivileged_userns
-
       - name: Run QUnit tests
         run: npm run grunt qunit:compiled
 

Gruntfile.js

@@ -115,7 +115,6 @@ module.exports = function(grunt) {
 			'cssmin',
 			'imagemin',
 			'jshint',
-			'qunit',
 			'uglify',
 			'watch'
 		],
@@ -1010,12 +1009,6 @@ module.exports = function(grunt) {
 				}
 			}
 		},
-		qunit: {
-			files: [
-				'tests/qunit/**/*.html',
-				'!tests/qunit/editor/**'
-			]
-		},
 		phpunit: {
 			'default': {
 				args: ['--verbose', '-c', 'phpunit.xml.dist']
@@ -2172,6 +2165,20 @@ module.exports = function(grunt) {
 		}, this.async());
 	});
 
+	grunt.registerTask( 'qunit', 'Runs QUnit tests.', function() {
+		var done = this.async();
+		grunt.util.spawn( {
+			cmd: 'node_modules/.bin/playwright',
+			args: [ 'test', '--config', 'tests/qunit/playwright.config.js' ],
+			opts: { stdio: 'inherit' }
+		}, function( error, result, code ) {
+			if ( code !== 0 ) {
+				grunt.fail.warn( 'QUnit tests failed.' );
+			}
+			done();
+		} );
+	} );
+
 	grunt.registerTask( 'qunit:compiled', 'Runs QUnit tests on compiled as well as uncompiled scripts.',
 		['build', 'copy:qunit', 'qunit']
 	);

tests/qunit/playwright.config.js

@@ -0,0 +1,18 @@
+/**
+ * Playwright configuration for QUnit tests.
+ */
+const path = require( 'path' );
+const { defineConfig } = require( '@playwright/test' );
+
+module.exports = defineConfig( {
+	testDir: __dirname,
+	outputDir: path.join( __dirname, '..', '..', 'artifacts', 'test-results' ),
+	testMatch: 'qunit.js',
+	timeout: 30_000,
+	workers: 1,
+	use: {
+		headless: true,
+		channel: 'chrome',
+	},
+	reporter: process.env.CI ? 'github' : 'list',
+} );

tests/qunit/qunit.js

@@ -0,0 +1,74 @@
+const { test, expect } = require( '@playwright/test' );
+const path = require( 'path' );
+const glob = require( 'fast-glob' );
+
+const qunitDir = path.resolve( __dirname );
+const htmlFiles = glob.sync( [ '**/*.html' ], {
+	cwd: qunitDir,
+	absolute: true,
+} );
+
+for ( const file of htmlFiles ) {
+	const name = path.relative( qunitDir, file );
+
+	test( `QUnit: ${ name }`, async ( { page } ) => {
+		// Inject a QUnit.done hook before any page scripts run.
+		await page.addInitScript( () => {
+			window.__qunitResults = new Promise( ( resolve ) => {
+				window.__qunitResolve = resolve;
+			} );
+
+			// Keep checking for QUnit to become available.
+			const observer = new MutationObserver( () => {
+				if ( typeof QUnit !== 'undefined' && ! window.__qunitHooked ) {
+					window.__qunitHooked = true;
+					observer.disconnect();
+
+					const failures = [];
+					QUnit.testDone( ( details ) => {
+						if ( details.failed > 0 ) {
+							failures.push(
+								`${ details.module } > ${ details.name } (${ details.failed } assertion(s))`
+							);
+						}
+					} );
+
+					QUnit.done( ( details ) => {
+						window.__qunitResolve( {
+							passed: details.passed,
+							failed: details.failed,
+							total: details.total,
+							runtime: details.runtime,
+							failures,
+						} );
+					} );
+				}
+			} );
+			observer.observe( document, {
+				childList: true,
+				subtree: true,
+			} );
+		} );
+
+		// Navigate to the test file.
+		await page.goto( 'file://' + file, { waitUntil: 'domcontentloaded' } );
+
+		// Wait for QUnit to complete.
+		const results = await page.evaluate( () => window.__qunitResults );
+
+		// Log summary.
+		// eslint-disable-next-line no-console
+		console.log(
+			`  ${ results.passed }/${ results.total } passed, ${ results.failed } failed, ${ results.runtime }ms`
+		);
+
+		if ( results.failures.length > 0 ) {
+			// eslint-disable-next-line no-console
+			console.log(
+				results.failures.map( ( f ) => `    FAIL: ${ f }` ).join( '\n' )
+			);
+		}
+
+		expect( results.failed ).toBe( 0 );
+	} );
+}