reload on config change (#1147)

* reload on config change

* symmetric style

Author: mbostock

src/config.ts

@@ -57,6 +57,7 @@ export interface Config {
   search: boolean; // default to false
   md: MarkdownIt;
   loaders: LoaderResolver;
+  watchPath?: string;
 }
 
 /**
@@ -76,17 +77,16 @@ async function importConfig(path: string): Promise<any> {
 }
 
 export async function readConfig(configPath?: string, root?: string): Promise<Config> {
-  if (configPath === undefined) return readDefaultConfig(root);
-  return normalizeConfig(await importConfig(resolveConfig(configPath, root)), root);
+  if (configPath === undefined) configPath = await resolveDefaultConfig(root);
+  if (configPath === undefined) return normalizeConfig(undefined, root);
+  return normalizeConfig(await importConfig(configPath), root, configPath);
 }
 
-export async function readDefaultConfig(root?: string): Promise<Config> {
+async function resolveDefaultConfig(root?: string): Promise<string | undefined> {
   const jsPath = resolveConfig("observablehq.config.js", root);
-  if (existsSync(jsPath)) return normalizeConfig(await importConfig(jsPath), root);
+  if (existsSync(jsPath)) return jsPath;
   const tsPath = resolveConfig("observablehq.config.ts", root);
-  if (!existsSync(tsPath)) return normalizeConfig(undefined, root);
-  await import("tsx/esm"); // lazy tsx
-  return normalizeConfig(await importConfig(tsPath), root);
+  if (existsSync(tsPath)) return await import("tsx/esm"), tsPath; // lazy tsx
 }
 
 let cachedPages: {key: string; pages: Page[]} | null = null;
@@ -127,7 +127,7 @@ export function setCurrentDate(date = new Date()): void {
 // module), we want to return the same Config instance.
 const configCache = new WeakMap<any, Config>();
 
-export function normalizeConfig(spec: any = {}, defaultRoot = "docs"): Config {
+export function normalizeConfig(spec: any = {}, defaultRoot = "docs", watchPath?: string): Config {
   const cachedConfig = configCache.get(spec);
   if (cachedConfig) return cachedConfig;
   let {
@@ -184,7 +184,8 @@ export function normalizeConfig(spec: any = {}, defaultRoot = "docs"): Config {
     deploy,
     search,
     md,
-    loaders: new LoaderResolver({root, interpreters})
+    loaders: new LoaderResolver({root, interpreters}),
+    watchPath
   };
   if (pages === undefined) Object.defineProperty(config, "pages", {get: () => readPages(root, md)});
   if (sidebar === undefined) Object.defineProperty(config, "sidebar", {get: () => config.pages.length > 0});

src/preview.ts

@@ -282,6 +282,7 @@ function handleWatch(socket: WebSocket, req: IncomingMessage, configPromise: Pro
   let files: Map<string, string> | null = null;
   let tables: Map<string, string> | null = null;
   let stylesheets: string[] | null = null;
+  let configWatcher: FSWatcher | null = null;
   let markdownWatcher: FSWatcher | null = null;
   let attachmentWatcher: FileWatchers | null = null;
   let emptyTimeout: ReturnType<typeof setTimeout> | null = null;
@@ -352,7 +353,7 @@ function handleWatch(socket: WebSocket, req: IncomingMessage, configPromise: Pro
   }
 
   async function hello({path: initialPath, hash: initialHash}: {path: string; hash: string}): Promise<void> {
-    if (markdownWatcher || attachmentWatcher) throw new Error("already watching");
+    if (markdownWatcher || configWatcher || attachmentWatcher) throw new Error("already watching");
     path = decodeURI(initialPath);
     if (!(path = normalize(path)).startsWith("/")) throw new Error("Invalid path: " + initialPath);
     if (path.endsWith("/")) path += "index";
@@ -371,6 +372,7 @@ function handleWatch(socket: WebSocket, req: IncomingMessage, configPromise: Pro
     stylesheets = Array.from(resolvers.stylesheets, resolvers.resolveStylesheet);
     attachmentWatcher = await loaders.watchFiles(path, getWatchFiles(resolvers), () => watcher("change"));
     markdownWatcher = watch(join(root, path), (event) => watcher(event));
+    if (config.watchPath) configWatcher = watch(config.watchPath, () => send({type: "reload"}));
   }
 
   socket.on("message", async (data) => {
@@ -402,6 +404,10 @@ function handleWatch(socket: WebSocket, req: IncomingMessage, configPromise: Pro
       markdownWatcher.close();
       markdownWatcher = null;
     }
+    if (configWatcher) {
+      configWatcher.close();
+      configWatcher = null;
+    }
     console.log(faint("socket close"), req.url);
   });
 

test/config-test.ts

@@ -1,4 +1,5 @@
 import assert from "node:assert";
+import {resolve} from "node:path";
 import MarkdownIt from "markdown-it";
 import {normalizeConfig as config, mergeToc, readConfig, setCurrentDate} from "../src/config.js";
 import {LoaderResolver} from "../src/dataloader.js";
@@ -33,7 +34,8 @@ describe("readConfig(undefined, root)", () => {
         workspace: "acme",
         project: "bi"
       },
-      search: false
+      search: false,
+      watchPath: resolve("test/input/build/config/observablehq.config.js")
     });
   });
   it("returns the default config if no config file is found", async () => {
@@ -56,7 +58,8 @@ describe("readConfig(undefined, root)", () => {
       footer:
         'Built with <a href="https://observablehq.com/" target="_blank">Observable</a> on <a title="2024-01-10T16:00:00">Jan 10, 2024</a>.',
       deploy: null,
-      search: false
+      search: false,
+      watchPath: undefined
     });
   });
 });