chore: rewrite watch mechanism

Author: lacolaco

.bazelrc

@@ -0,0 +1,10 @@
+# Print all the options that apply to the build.
+# This helps us diagnose which options override others
+# (e.g. /etc/bazel.bazelrc vs. tools/bazel.rc)
+build --announce_rc
+
+# More details on failures
+build --verbose_failures=true
+
+# CI supports colors but Bazel does not detect it.
+common --color=yes

.prettierignore

@@ -0,0 +1,4 @@
+*.md
+
+origin
+

.prettierrc

@@ -0,0 +1,3 @@
+{
+    "singleQuote": true
+}

package.json

@@ -18,10 +18,12 @@
   "packageManager": "yarn@1.22.10",
   "devDependencies": {
     "chokidar": "3.6.0",
+    "execa": "^9.3.0",
     "prh-rules": "prh/rules",
     "textlint": "^14.0.4",
     "textlint-filter-rule-comments": "^1.2.2",
     "textlint-rule-prh": "^6.0.0",
+    "tree-kill": "^1.2.2",
     "zx": "8.1.3"
   }
 }

tools/lib/common.mjs

@@ -1,10 +1,20 @@
 import { watch } from 'chokidar';
 import { resolve } from 'node:path';
+import { execa } from 'execa';
+// TODO: replace $ to execa
 import { $, cd, chalk, glob, within } from 'zx';
+import kill from 'tree-kill';
 import { cpRf, exists, initDir, rename, sed } from './fileutils.mjs';
 
+const $$ = execa({
+  stdin: 'inherit',
+  stdout: 'inherit',
+  stderr: 'inherit',
+  preferLocal: true,
+});
+
 const rootDir = resolve(__dirname, '../');
-const adevDir = resolve(rootDir, 'adev-ja');
+const adevJaDir = resolve(rootDir, 'adev-ja');
 const aiojaDir = resolve(rootDir, 'aio-ja');
 const outDir = resolve(rootDir, 'build');
 
@@ -20,6 +30,8 @@ export async function resetBuildDir({ init = false }) {
     await initDir(outDir);
     console.log(chalk.cyan('copying origin files to build directory...'));
     await cpRf(resolve(rootDir, 'origin'), outDir);
+    console.log(chalk.cyan('copying .bazelrc to build directory...'));
+    await cpRf(resolve(rootDir, '.bazelrc'), resolve(outDir, '.bazelrc.user'));
   }
 }
 
@@ -31,11 +43,22 @@ export async function buildAdev() {
   });
 }
 
-export async function watchAIO() {
-  await within(async () => {
-    cd(`${outDir}`);
-    await $`yarn docs`;
+export function serveAdev() {
+  const p = $$({
+    cwd: outDir,
+    reject: false,
+  })`npx bazel run //adev:serve --fast_adev`;
+  console.debug(chalk.gray('adev process started.', p.pid));
+  const abort = () => kill(p.pid);
+  p.finally(() => {
+    console.debug(chalk.gray('adev process exited.', p.pid));
   });
+  return {
+    cancel: async () => {
+      abort();
+      return await p;
+    },
+  };
 }
 
 /**
@@ -45,29 +68,32 @@ const lozalizedFilePatterns = ['**/*', '!**/*.en.*', '!**/*.old'];
 
 export async function copyLocalizedFiles() {
   const jaFiles = await glob(lozalizedFilePatterns, {
-    cwd: aiojaDir,
+    cwd: adevJaDir,
   });
   for (const file of jaFiles) {
-    const src = resolve(aiojaDir, file);
-    const dest = resolve(outDir, 'aio', file);
+    const src = resolve(adevJaDir, file);
+    const dest = resolve(outDir, 'adev', file);
     await cpRf(src, dest);
   }
 }
 
 /**
- *
- * @param {AbortSignal} signal
+ * @param {() => () => void} onChangeCallback
  */
-export async function watchLocalizedFiles(signal) {
-  const watcher = watch(lozalizedFilePatterns, {
-    cwd: aiojaDir,
-  });
-  watcher.on('change', (path) => {
-    const src = resolve(aiojaDir, path);
-    const dest = resolve(outDir, 'aio', path);
-    cpRf(src, dest);
+export function watchLocalizedFiles(onChangeCallback) {
+  const watcher = watch(lozalizedFilePatterns, { cwd: adevJaDir });
+  watcher.on('change', async (path) => {
+    console.log(chalk.cyan(`File changed: ${path}`));
+    const src = resolve(adevJaDir, path);
+    const dest = resolve(outDir, 'adev', path);
+    await cpRf(src, dest);
+    onChangeCallback();
   });
-  signal.addEventListener('abort', () => watcher.close());
+  return {
+    cancel: () => {
+      watcher.close();
+    },
+  };
 }
 
 export async function applyPatches() {
@@ -100,11 +126,9 @@ export async function copyRobots() {
 // Copy static files into build output directory
 export async function copyStaticFiles() {
   await $`chmod -R +w ${resolve(outDir, 'dist/bin/adev/build/browser')}`;
-  const files = [
-    '_headers',
-  ];
+  const files = ['_headers'];
   for (const file of files) {
-    const src = resolve(adevDir, file);
+    const src = resolve(adevJaDir, file);
     const dest = resolve(outDir, 'dist/bin/adev/build/browser', file);
     await cpRf(src, dest);
   }
@@ -113,7 +137,10 @@ export async function copyStaticFiles() {
 // replace angular.io to angular.jp in sitemap.xml
 export async function modifySitemap() {
   await $`chmod -R +w ${resolve(outDir, 'dist/bin/aio/build')}`;
-  const sitemapPath = resolve(outDir, 'dist/bin/aio/build/generated/sitemap.xml');
+  const sitemapPath = resolve(
+    outDir,
+    'dist/bin/aio/build/generated/sitemap.xml'
+  );
   await sed(sitemapPath, 'angular.io', 'angular.jp');
 }
 

tools/watch.mjs

@@ -1,7 +1,12 @@
 #!/usr/bin/env zx
 
 import { argv, chalk } from 'zx';
-import { applyPatches, copyLocalizedFiles, resetBuildDir, watchAIO, watchLocalizedFiles } from './lib/common.mjs';
+import {
+  applyPatches,
+  resetBuildDir,
+  serveAdev,
+  watchLocalizedFiles,
+} from './lib/common.mjs';
 
 try {
   const { init = false } = argv;
@@ -19,11 +24,17 @@ try {
 
 async function setup({ init }) {
   console.log('');
-  console.log(chalk.white('変更監視の対象は、aio-ja 内のファイル と build/aio 内のソースコードです。'));
+  console.log(chalk.white('変更監視の対象は、adev-ja 内のファイルです'));
   if (init) {
-    console.log(chalk.yellow('build ディレクトリを初期化し、キャッシュを破棄します。'));
+    console.log(
+      chalk.yellow('build ディレクトリを初期化し、キャッシュを破棄します。')
+    );
   } else {
-    console.log(chalk.white('build ディレクトリを初期化するには --init オプションを指定してください。'));
+    console.log(
+      chalk.white(
+        'build ディレクトリを初期化するには --init オプションを指定してください。'
+      )
+    );
   }
   console.log('');
   await resetBuildDir({ init });
@@ -32,8 +43,8 @@ async function setup({ init }) {
 async function preWatch({ init }) {
   if (init) {
     // copy translated files
-    console.log(chalk.cyan('Copy localized files...'));
-    await copyLocalizedFiles();
+    // console.log(chalk.cyan('Copy localized files...'));
+    // await copyLocalizedFiles();
 
     // apply patches
     console.log(chalk.cyan('Apply patches...'));
@@ -42,12 +53,13 @@ async function preWatch({ init }) {
 }
 
 async function watch() {
-  const ctrl = new AbortController();
-  await watchLocalizedFiles(ctrl.signal);
-  try {
-    await watchAIO();
-  } finally {
-    console.log(chalk.cyan('Abort watching...'));
-    ctrl.abort();
-  }
+  let adevProcess = serveAdev();
+  console.log(chalk.cyan('Start watching adev-ja files...'));
+  watchLocalizedFiles(async () => {
+    if (adevProcess != null) {
+      await adevProcess.cancel();
+    }
+    console.log(chalk.cyan('Restarting adev...'));
+    adevProcess = serveAdev();
+  });
 }