Use screenshots to generate reference visuals

Gruntfile.cjs

@@ -6,45 +6,7 @@ module.exports = function (grunt) {
 
         pkg: grunt.file.readJSON("package.json"),
 
-        clean: ["<%= properties.webappBuildDir %>", "<%= properties.umdBuildDir %>"],
-
-        sync: {
-            all: {
-                files:
-                    [
-                        // copy tests
-                        { expand: true, cwd: "<%= properties.webappTestDir %>", src: "**", dest: "<%= properties.webappBuildDir %>" },
-
-                        // copy tests resources
-                        { expand: true, cwd: "<%= properties.unitTestsResourcesDir %>", src: "imsc-tests/imsc1/ttml/**", dest: "<%= properties.webappBuildDir %>" },
-                        { expand: true, cwd: "<%= properties.unitTestsResourcesDir %>", src: "imsc-tests/imsc1/tests.json", dest: "<%= properties.webappBuildDir %>" },
-                        { expand: true, cwd: "<%= properties.unitTestsResourcesDir %>", src: "imsc-tests/imsc1_1/ttml/**", dest: "<%= properties.webappBuildDir %>" },
-                        { expand: true, cwd: "<%= properties.unitTestsResourcesDir %>", src: "imsc-tests/imsc1_1/tests.json", dest: "<%= properties.webappBuildDir %>" },
-                        { expand: true, cwd: "<%= properties.unitTestsResourcesDir %>", src: "unit-tests/**", dest: "<%= properties.webappBuildDir %>" },
-                    ],
-            },
-
-            release: {
-                src: "<%= properties.umdBuildDir %>/<%= properties.umdMinName %>",
-                dest: "<%= properties.webappBuildDir %>/libs/imsc.js",
-            },
-
-            debug: {
-                src: "<%= properties.umdBuildDir %>/<%= properties.umdDebugName %>",
-                dest: "<%= properties.webappBuildDir %>/libs/imsc.js",
-            },
-        },
-
-        npmcopy: {
-            default: {
-                files: {
-                    "<%= properties.webappBuildDir %>/libs/": [
-                        "filesaver.js-npm:main",
-                        "jszip/dist/jszip.js",
-                    ],
-                },
-            },
-        },
+        clean: ["<%= properties.umdBuildDir %>"],
 
         exec: {
             compile: {
@@ -65,18 +27,10 @@ module.exports = function (grunt) {
 
     grunt.loadNpmTasks("grunt-contrib-clean");
 
-    grunt.loadNpmTasks("grunt-npmcopy");
-
-    grunt.loadNpmTasks("grunt-sync");
-
     grunt.loadNpmTasks("grunt-exec");
 
     grunt.registerTask("lint", ["exec:lint"]);
 
-    grunt.registerTask("build:release", ["lint", "exec:compile", "exec:bundle", "sync:all", "sync:release", "npmcopy"]);
-
-    grunt.registerTask("build:debug", ["lint", "exec:compile", "exec:bundle", "sync:all", "sync:debug", "npmcopy"]);
-
-    grunt.registerTask("build", ["build:debug"]);
+    grunt.registerTask("build", ["lint", "exec:compile", "exec:bundle"]);
 
 };

README.md

@@ -39,10 +39,10 @@ Rendering to HTML5 requires a browser environment, but parsing an IMSC document
 
 * run the `build` target defined in [Gruntfile.cjs](./Gruntfile.cjs) using [grunt](http://gruntjs.com/).
 
-* the resulting `imsc.js` file at `build/public_html/libs` is the imscJS library. For example, it can be included in a web page as follows:
+* the resulting `dist/imsc.debug.js` (non-minified) or `dist/imsc.min.js` (minified) file is the imscJS library. For example, it can be included in a web page as follows:
 
 ```html
-    <script src="libs/imsc.js"></script>
+    <script src="imsc.min.js"></script>
 ```
 
 See BUILD ARTIFACTS for a full list of build artifacts, and TESTS AND SAMPLES for a list of samples and tests available.
@@ -80,19 +80,14 @@ imscJS consists of the following ES modules at [src/main/js](src/main/js), which
 
 ## Build
 
-imscJS is built using the `build:release` or `build:debug` Grunt tasks -- the `build` task is an alias of `build:debug`.
+imscJS is built using the `build` Grunt task.
 
 The `dist` directory contains the following build artifacts:
 
 * `imsc.debug.js`: Non-minified UMD build.
 * `imsc.min.js`: Minified UMD build.
 * `main/`: ES modules and TypeScript type declarations, used when the library is imported as an NPM package.
 
-The `build/public_html/libs/imsc.js` file is identical to:
-
-* `imsc.debug.js`, if the `build:debug` task is executed.
-* `imsc.min.js`, if the `build:release` task is executed.
-
 ## Releases
 
 imscJS is released as an NPM package under [imsc](https://www.npmjs.com/package/imsc). The `dev` distribution tag indicates pre-releases.
@@ -105,7 +100,7 @@ To access the latest builds, please consult the [release page](https://github.co
 
 ### W3C Test Suite
 
-The `gen-renders.html` web app or the headless script [src/test/script/gen-render-package.mjs](src/test/script/gen-render-package.mjs) can be used to generate PNG renderings as well as intermediary files (JSON document, ISD documents and HTML documents) from the [W3C IMSC test suite](https://github.com/w3c/imsc-tests).
+The headless script [src/test/script/gen-render-package.mjs](src/test/script/gen-render-package.mjs) can be used to generate PNG renderings as well as intermediary files (JSON document, ISD documents and HTML documents) from the [W3C IMSC test suite](https://github.com/w3c/imsc-tests).
 
 ```sh
 npm run gen-imsc1
@@ -157,8 +152,4 @@ npm run gen-reference-files
 
 * [src/test](src/test): Test files
 
-* [src/test/webapp](src/test/webapp): Web app, used to generate PNG renderings and intermediary files from the W3C IMSC test suite
-
 * [dist](dist): Built libraries
-
-* [build/public_html](build/public_html): Test web applications

eslint.config.js

@@ -4,7 +4,6 @@ import globals from "globals";
 export default [
   {
     ignores: [
-      "src/test/webapp/**/*",
       "dist",
       "build",
     ],
@@ -30,6 +29,7 @@ export default [
   },
   {
     files: ["src/test/script/**/*"],
+    ignores: ["src/test/script/**/*.browser.js"],
     languageOptions: {
       globals: {
         ...globals.node,

package.json

@@ -46,8 +46,7 @@
         "./package.json": "./package.json"
     },
     "scripts": {
-        "prepublishOnly": "grunt build:release",
-        "dev": "npx http-server build/public_html",
+        "prepublishOnly": "grunt build",
         "gen-imsc1": "node src/test/script/gen-render-package.mjs imsc-tests/imsc1 build/renders-imsc1.zip",
         "gen-imsc1_1": "node src/test/script/gen-render-package.mjs imsc-tests/imsc1_1 build/renders-imsc1_1.zip",
         "gen-reference-files": "node src/test/script/gen-reference-files.mjs",
@@ -67,13 +66,10 @@
         "@rollup/plugin-node-resolve": "16.0.3",
         "@rollup/plugin-terser": "1.0.0",
         "eslint": "10.10.0",
-        "filesaver.js-npm": "1.0.1",
         "globals": "17.12.0",
         "grunt": "1.6.3",
         "grunt-contrib-clean": "2.0.1",
         "grunt-exec": "3.0.0",
-        "grunt-npmcopy": "0.2.0",
-        "grunt-sync": "0.8.2",
         "jszip": "3.10.1",
         "rollup": "4.63.1",
         "rollup-plugin-polyfill-node": "0.13.0",

properties.json

@@ -1,7 +1,5 @@
 {
     "webappSrcDir" : "src/main/webapp",
-    "webappTestDir" : "src/test/webapp",
-    "webappBuildDir" : "build/public_html",
     "unitTestsResourcesDir" : "src/test/resources",
     "umdBuildDir" : "dist",
     "umdDebugName" : "imsc.debug.js",

src/test/js/GenerateReferenceFilesTest.js

@@ -3,7 +3,7 @@ import fs from "node:fs/promises";
 import path from "node:path";
 import { test } from "node:test";
 import { fileURLToPath } from "node:url";
-import { renderTTMLInBrowser } from "../script/gen-renders-page.mjs";
+import { renderTestSuite } from "../script/render-harness.mjs";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const REFERENCE_FILES_ROOT = path.resolve(__dirname, "..", "resources", "reference-files");
@@ -21,41 +21,38 @@ async function listFilesRecursively(dir) {
 
 async function generateAndCompare(browserProduct) {
 
-  await renderTTMLInBrowser(browserProduct, async (page) => {
+  const results = [];
 
-    for (const reffilesRoot of REFFILES_ROOTS) {
+  for (const reffilesRoot of REFFILES_ROOTS) {
+    results.push([reffilesRoot, await renderTestSuite(browserProduct, reffilesRoot)]);
+  }
 
-      const generatedFiles = await page.evaluate(async (root) => {
-        // eslint-disable-next-line no-undef -- injected by gen-renders.js in the page context
-        return await generateReferenceFiles(root);
-      }, reffilesRoot);
+  for (const [reffilesRoot, generatedFiles] of results) {
 
-      const referenceDir = path.join(REFERENCE_FILES_ROOT, path.basename(reffilesRoot));
+    const referenceDir = path.join(REFERENCE_FILES_ROOT, path.basename(reffilesRoot));
 
-      const generatedPaths = Object.keys(generatedFiles).sort();
-      const referencePaths = await listFilesRecursively(referenceDir);
+    const generatedPaths = Object.keys(generatedFiles).map((p) => p.replace(/^generated\//, "")).sort();
+    const referencePaths = await listFilesRecursively(referenceDir);
 
-      assert.deepStrictEqual(
-        generatedPaths,
-        referencePaths,
-        `generated files for ${reffilesRoot} do not match the set of reference files at ${referenceDir}`,
-      );
-
-      for (const relativePath of generatedPaths) {
+    assert.deepStrictEqual(
+      generatedPaths,
+      referencePaths,
+      `generated files for ${reffilesRoot} do not match the set of reference files at ${referenceDir}`,
+    );
 
-        const referenceContents = await fs.readFile(path.join(referenceDir, relativePath), "utf8");
+    for (const relativePath of generatedPaths) {
 
-        assert.strictEqual(
-          generatedFiles[relativePath],
-          referenceContents,
-          `${reffilesRoot}/${relativePath} does not match its reference file`,
-        );
+      const referenceContents = await fs.readFile(path.join(referenceDir, relativePath), "utf8");
 
-      }
+      assert.strictEqual(
+        generatedFiles["generated/" + relativePath],
+        referenceContents,
+        `${reffilesRoot}/${relativePath} does not match its reference file`,
+      );
 
     }
 
-  });
+  }
 
 }