Improve how flow.html handles older releases.

Gruntfile.js

@@ -1,4 +1,4 @@
-/*
+/************************************************************************************************************
 This Gruntfile supports these commands:  
 
 grunt
@@ -14,26 +14,31 @@ grunt build:cjs
 grunt build:esm
 grunt build:types
 
+grunt get:releases:versionX:versionY:...
+grunt get:releases:3.0.9:4.0.0
+  - retrieve previous releases for regression testing purposes.
 grunt webpack:allFontLibs
   - build the VexFlow font libraries that are used for lazy loading by vexflow-core.js.
-  
+
+*************************************************************************************************************
 This Gruntfile supports these optional environment variables:
-  VEX_DEBUG_CIRCULAR_DEPENDENCIES
-      if true, we display a list of circular dependencies in the code.
-  VEX_DEVTOOL
-      specify webpack's devtool config (e.g., 'source-map' to create source maps).
-      https://webpack.js.org/configuration/devtool/
-  VEX_GENERATE_OPTIONS
-      options for controlling the ./tools/generate_images.js script.
-      see the 'generate:current' and 'generate:reference' tasks.
-
-  To pass in environment variables, you can use your ~/.bash_profile or do something like:
-    export VEX_DEBUG_CIRCULAR_DEPENDENCIES=true
-    export VEX_DEVTOOL=eval
-    grunt
-  You can also do it all on one line:
-    VEX_DEBUG_CIRCULAR_DEPENDENCIES=true VEX_DEVTOOL=eval grunt
-*/
+
+VEX_DEBUG_CIRCULAR_DEPENDENCIES
+    if true, we display a list of circular dependencies in the code.
+VEX_DEVTOOL
+    specify webpack's devtool config (e.g., 'source-map' to create source maps).
+    https://webpack.js.org/configuration/devtool/
+VEX_GENERATE_OPTIONS
+    options for controlling the ./tools/generate_images.js script.
+    see the 'generate:current' and 'generate:reference' tasks.
+
+To pass in environment variables, you can use your ~/.bash_profile or do something like:
+  export VEX_DEBUG_CIRCULAR_DEPENDENCIES=true
+  export VEX_DEVTOOL=eval
+  grunt
+You can also do it all on one line:
+  VEX_DEBUG_CIRCULAR_DEPENDENCIES=true VEX_DEVTOOL=eval grunt
+*************************************************************************************************************/
 
 const path = require('path');
 const fs = require('fs');
@@ -249,11 +254,11 @@ function webpackConfigs() {
       new RenameFontModulesPlugin()
     ),
     // Individual build targets for production VexFlow libraries.
-    prodAllFonts: config(VEX, PRODUCTION_MODE, true, 'Vex'),
+    prodAllFonts: config(VEX, PRODUCTION_MODE, true, 'Vex'), // grunt webpack:prodAllFonts => build/cjs/vexflow.js
     prodBravuraOnly: config(VEX_BRAVURA, PRODUCTION_MODE, true, 'Vex'),
     prodGonvilleOnly: config(VEX_GONVILLE, PRODUCTION_MODE, true, 'Vex'),
     prodPetalumaOnly: config(VEX_PETALUMA, PRODUCTION_MODE, true, 'Vex'),
-    prodNoFonts: config(VEX_CORE, PRODUCTION_MODE, true, 'Vex'),
+    prodNoFonts: config(VEX_CORE, PRODUCTION_MODE, true, 'Vex'), // grunt webpack:prodNoFonts => build/cjs/vexflow-core.js
     // Individual build targets for production VexFlow font modules (for dynamic loading).
     // Pass in `false` to disable the MIT license banner for font module files.
     prodFontBravura: config(VEX_FONT_BRAVURA, PRODUCTION_MODE, false, ['VexFlowFont', 'Bravura']),
@@ -262,7 +267,7 @@ function webpackConfigs() {
     prodFontCustom: config(VEX_FONT_CUSTOM, PRODUCTION_MODE, false, ['VexFlowFont', 'Custom']),
     // Individual build targets for development / debugging.
     // The DEVELOPMENT_MODE flag disables code minification.
-    debug: config(VEX_DEBUG, DEVELOPMENT_MODE, true, 'Vex'),
+    debug: config(VEX_DEBUG, DEVELOPMENT_MODE, true, 'Vex'), // grunt webpack:debug => build/cjs/vexflow-core.js
     debugWithTests: config(VEX_DEBUG_TESTS, DEVELOPMENT_MODE, true, 'Vex'),
   };
 }

src/version.ts

@@ -1,3 +1,3 @@
 export const VERSION: string = '4.0.0';
-export const ID: string = '633316c2a0a9a3403b5c69f8905c7ce0f3726dd2';
-export const DATE: string = '2022-01-09T09:28:18.665Z';
+export const ID: string = '0e3e8f0c8d11377f76cd9f0b3e3d8deb2ded70c4';
+export const DATE: string = '2022-01-09T10:02:24.048Z';

tests/flow.html

@@ -43,9 +43,9 @@ <h3>
       }
 
       // Support a query param to choose which VexFlow version to load.
-      // ver=(build/cjs | reference | releases | etc...)
+      // ver=(build/cjs | reference | releases/3.0.9 | etc...)
       // If omitted, `ver` defaults to 'build/cjs'.
-      // `ver` can also specify a version hosted on unpkg.com / jsdelivr.com:
+      // ver can also specify a version hosted on unpkg.com / jsdelivr.com:
       // ver=unpkg@3.0.9     => https://unpkg.com/vexflow@3.0.9/releases/vexflow-debug.js
       // ver=unpkg@1.2.77    => https://unpkg.com/vexflow@1.2.77/releases/vexflow-debug.js
       // ver=jsdelivr@4.0.0  => https://cdn.jsdelivr.net/npm/vexflow@4.0.0/build/vexflow-debug.js
@@ -83,12 +83,13 @@ <h3>
         // We are loading from the local filesystem (vexflow/build/ | vexflow/reference | vexflow/releases/).
         const path = ver;
 
-        // We assume the 'releases' folder is version 3.0.9 or older, since 4.0.0 moved to the build/ folder.
-        // TODO/RONYEH: This is not a good assumption. We should download releases into versioned subdirectories,
-        // e.g., vexflow/releases/4.0.1/ so we can parse the version correctly.
+        // file://.../vexflow/tests/flow.html?ver=releases/3.0.9
         if (path.startsWith('releases')) {
-          isVersionFourOrNewer = false;
+          const pathParts = path.split('/');
+          const version = parseFloat(pathParts[1]);
+          isVersionFourOrNewer = version >= 4;
         }
+        // TODO RONYEH: For versions 4.0.0 or higher, we need to consider the cjs/ and esm/ directories.
         vexURL = '../' + path + '/vexflow-debug.js';
         testsURL = '../' + path + '/vexflow-tests.js';
         vexPlusTestsURL = '../' + path + '/vexflow-debug-with-tests.js';