ci(): add build.lock

CHANGELOG.md

@@ -1,9 +1,8 @@
 # Changelog
 
-# Changelog
-
 ## [next]
 
+- ci(): adds a lock file to the repo when build is in progress, makes local testing wait for the build to complete [#8290](https://github.com/fabricjs/fabric.js/pull/8290)
 - fix(`WebGLProbe`): regression caused by [#8199](https://github.com/fabricjs/fabric.js/pull/8199), [#8301](https://github.com/fabricjs/fabric.js/pull/8301)
 - fix(fabric.utils) added missing import in dom_misc [#8293](https://github.com/fabricjs/fabric.js/pull/8293)
 - fix(Object): `extraParam` should not be passed to options [#8295](https://github.com/fabricjs/fabric.js/pull/8295)

package.json

@@ -101,6 +101,7 @@
     "nyc": "^15.1.0",
     "pixelmatch": "^4.0.2",
     "prettier": "2.7.1",
+    "ps-list": "^8.1.0",
     "qunit": "^2.17.2",
     "rollup": "^2.75.6",
     "rollup-plugin-terser": "^7.0.2",

scripts/build.mjs

@@ -0,0 +1,56 @@
+import cp from 'child_process';
+import path from 'node:path';
+import process from 'node:process';
+import { wd } from './dirname.mjs';
+
+/**
+ * Handles rollup build
+ *
+ * Hooks to build events to create `cli_output/build-lock.json`
+ * @see https://rollupjs.org/guide/en/#--watchonstart-cmd---watchonbundlestart-cmd---watchonbundleend-cmd---watchonend-cmd---watchonerror-cmd
+ * @param {*} options
+ */
+export function build({ watch, fast, input, output } = {}) {
+  const cmd = [
+    'rollup',
+    '-c',
+    watch ? '--watch' : '',
+    '--no-watch.clearScreen',
+    ...['onStart', 'onError', 'onEnd'].map(
+      (type) =>
+        `--watch.${type} "node ./scripts/buildReporter.mjs ${type
+          .toLowerCase()
+          .slice(2)}"`
+    ),
+  ].join(' ');
+  const processOptions = {
+    stdio: 'inherit',
+    shell: true,
+    cwd: wd,
+    env: {
+      ...process.env,
+      MINIFY: Number(!fast),
+      BUILD_INPUT: input,
+      BUILD_OUTPUT: output,
+      BUILD_MIN_OUTPUT:
+        output && !fast
+          ? path.resolve(
+              path.dirname(output),
+              `${path.basename(output, '.js')}.min.js`
+            )
+          : undefined,
+    },
+  };
+  if (watch) {
+    cp.spawn(cmd, processOptions);
+  } else {
+    try {
+      cp.execSync(cmd, processOptions);
+    } catch (error) {
+      // minimal logging, no need for stack trace
+      console.error(error.message);
+      // inform ci
+      process.exit(1);
+    }
+  }
+}

scripts/buildLock.mjs

@@ -0,0 +1,115 @@
+import chalk from 'chalk';
+import fs from 'fs-extra';
+import _ from 'lodash';
+import moment from 'moment';
+import path from 'node:path';
+import process from 'node:process';
+import psList from 'ps-list';
+import { dumpsPath } from './dirname.mjs';
+
+export const lockFile = path.resolve(dumpsPath, 'build-lock.json');
+
+/**
+ *
+ * @returns {{start:{pid:number,timestamp:string},error?:{pid:number,timestamp:string}} | null}
+ */
+function readLockFile() {
+  return fs.existsSync(lockFile) ? JSON.parse(fs.readFileSync(lockFile)) : null;
+}
+
+/**
+ * For concurrency reasons, the last process to lock is granted permission to unlock.
+ * If the process died the next process to try to unlock will be granted permission.
+ */
+export async function unlock() {
+  const lock = readLockFile();
+  if (!lock) return;
+  const lockPID = lock.start.pid;
+  const hasPermissionToUnlock =
+    process.pid === lockPID ||
+    !(await psList()).find(({ pid }) => pid === lockPID);
+  try {
+    hasPermissionToUnlock && fs.unlinkSync(lockFile);
+  } catch (error) {}
+}
+
+export function isLocked() {
+  return fs.existsSync(lockFile);
+}
+
+export function awaitBuild() {
+  return new Promise((resolve) => {
+    if (isLocked()) {
+      console.log(chalk.cyanBright('> waiting for build to finish...'));
+      const watcher = subscribe((locked) => {
+        if (!locked) {
+          watcher.close();
+          resolve();
+        }
+      }, 500);
+    } else {
+      resolve();
+    }
+  });
+}
+
+/**
+ * Subscribe to build start/error/completion.
+ *
+ * @param {(locked: boolean, error: boolean) => any} cb
+ * @param {number} [debounce]
+ * @returns
+ */
+export function subscribe(cb, debounce) {
+  return fs.watch(
+    path.dirname(lockFile),
+    _.debounce((type, file) => {
+      if (file !== path.basename(lockFile)) return;
+      cb(isLocked(), !!(readLockFile() ?? {}).error);
+    }, debounce)
+  );
+}
+
+/**
+ *
+ * @param {'start'|'error'|'end'} type
+ * @param {*} [data]
+ */
+export function report(type, data) {
+  switch (type) {
+    case 'start':
+      fs.writeFileSync(
+        lockFile,
+        JSON.stringify(
+          {
+            start: {
+              timestamp: moment().format('YYYY-MM-DD HH:mm:ss'),
+              pid: process.pid,
+            },
+          },
+          null,
+          '\t'
+        )
+      );
+      break;
+    case 'error':
+      fs.writeFileSync(
+        lockFile,
+        JSON.stringify(
+          {
+            ...readLockFile(),
+            error: {
+              timestamp: moment().format('YYYY-MM-DD HH:mm:ss'),
+              pid: process.pid,
+              data,
+            },
+          },
+          null,
+          '\t'
+        )
+      );
+      break;
+    case 'end':
+      !readLockFile().error && unlock();
+  }
+}

scripts/buildReporter.mjs

@@ -0,0 +1,15 @@
+/**
+ * This file is used by `./build` to create `cli_output/build-lock.json`
+ */
+
+import { Command } from 'commander';
+import { report } from './buildLock.mjs';
+
+const program = new Command();
+
+program
+  .command('report <type>', { isDefault: true })
+  .action((type) => {
+    report(type);
+  })
+  .parse(process.argv);

scripts/dirname.mjs

@@ -0,0 +1,14 @@
+import fs from 'fs-extra';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __filename = fileURLToPath(import.meta.url);
+export const __dirname = path.dirname(__filename);
+
+export const wd = path.resolve(__dirname, '..');
+export const dumpsPath = path.resolve(wd, 'cli_output');
+export const CLI_CACHE = path.resolve(dumpsPath, 'cli_cache.json');
+
+if (!fs.existsSync(dumpsPath)) {
+  fs.mkdirSync(dumpsPath);
+}

scripts/index.mjs

@@ -23,25 +23,15 @@ import _ from 'lodash';
 import moment from 'moment';
 import path from 'node:path';
 import process from 'node:process';
-import { fileURLToPath } from 'node:url';
 import os from 'os';
+import { build } from './build.mjs';
+import { awaitBuild } from './buildLock.mjs';
+import { CLI_CACHE, wd } from './dirname.mjs';
 import { listFiles, transform as transformFiles } from './transform_files.mjs';
 
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-// import rollup from 'rollup';
-// import loadConfigFile from 'rollup/loadConfigFile';
-
 const program = new commander.Command();
 
-const wd = path.resolve(__dirname, '..');
-const dumpsPath = path.resolve(wd, 'cli_output');
-const CLI_CACHE = path.resolve(dumpsPath, 'cli_cache.json');
 const websiteDir = path.resolve(wd, '../fabricjs.com');
-if (!fs.existsSync(dumpsPath)) {
-  fs.mkdirSync(dumpsPath);
-}
 
 function execGitCommand(cmd) {
   return cp
@@ -109,67 +99,6 @@ class ICheckbox extends Checkbox {
 }
 inquirer.registerPrompt('test-selection', ICheckbox);
 
-// async function rollupBuild(options = {}, onComplete) {
-//     const { options: buildOptions, warnings } = await loadConfigFile(path.resolve(__dirname, '..', 'rollup.config.js'), { format: 'es' });
-//     warnings.flush();
-//     if (options.output) {
-//         buildOptions.output = [options.output];
-//     }
-//     if (options.watch) {
-//         const watcher = rollup.watch(buildOptions);
-//         watcher.on('END', () => {
-//             onComplete && onComplete();
-//         });
-//         watcher.on('event', ({ result }) => {
-//             if (result) {
-//                 result.close();
-//             }
-//         });
-//         process.on('beforeExit', () => watcher.close());
-//     }
-//     else {
-//         for (const optionsObj of buildOptions) {
-//             const bundle = await rollup.rollup(optionsObj);
-//             await Promise.all(optionsObj.output.map(bundle.write));
-//         }
-
-//         onComplete && onComplete();
-//     }
-// }
-
-function build(options = {}) {
-  const cmd = ['rollup', '-c', options.watch ? '--watch' : ''].join(' ');
-  let minDest;
-  if (options.output && !options.fast) {
-    const { name, base, ...rest } = path.parse(path.resolve(options.output));
-    minDest = path.format({ name: `${name}.min`, ...rest });
-  }
-  const processOptions = {
-    stdio: 'inherit',
-    shell: true,
-    cwd: wd,
-    env: {
-      ...process.env,
-      MINIFY: Number(!options.fast),
-      BUILD_INPUT: options.input,
-      BUILD_OUTPUT: options.output,
-      BUILD_MIN_OUTPUT: minDest,
-    },
-  };
-  if (options.watch) {
-    cp.spawn(cmd, processOptions);
-  } else {
-    try {
-      cp.execSync(cmd, processOptions);
-    } catch (error) {
-      // minimal logging, no need for stack trace
-      console.error(error.message);
-      // inform ci
-      process.exit(1);
-    }
-  }
-}
-
 function startWebsite() {
   if (
     JSON.parse(fs.readFileSync(path.resolve(websiteDir, 'package.json')))
@@ -372,6 +301,7 @@ async function runTestem({
  */
 async function test(suite, tests, options = {}) {
   let failed = false;
+  await awaitBuild();
   const qunitEnv = {
     QUNIT_DEBUG_VISUAL_TESTS: Number(options.debug),
     QUNIT_RECREATE_VISUAL_REFS: Number(options.recreate),