@davidsouther/jiffies 2.2.4 → 2.3.0

package/src/server/http/css.ts

@@ -1,10 +1,7 @@
-import * as fs from "fs/promises";
-import * as path from "path";
-import { contentResponse } from "./response.js";
-import { MiddlewareFactory } from "./index.js";
-// @ts-ignore
-import sass from "sass";
-const { compileStringAsync } = sass;
+import * as fs from "node:fs/promises";
+import * as path from "node:path";
+import type { MiddlewareFactory } from "./index.ts";
+import { contentResponse } from "./response.ts";
 
 function render(source: string) {
   // Replace `from "@scope` with `from "/@scope`, for browsers
@@ -14,17 +11,6 @@ function render(source: string) {
   return contentResponse(source, "text/css");
 }
 
-async function compile(
-  filename: string,
-  root: string,
-  vars: string
-): Promise<string> {
-  vars = vars.substring(1).replaceAll("=", ":");
-  filename = filename.replaceAll("\\", "/"); // Normalize for dart-sass
-  const sassString = `// Using variables: ${vars}\n${vars};\n@import "${filename}";`;
-  return (await compileStringAsync(sassString, { loadPaths: [root] })).css;
-}
-
 /**
  * Serves .css files statically. Finds .sass files and transpiles them to css.
  */
@@ -33,12 +19,14 @@ export const cssFileServer: MiddlewareFactory =
   async (req) => {
     const Url = new URL(req.url ?? "/", `http://${req.headers.host}`);
     if (Url.pathname.endsWith(".css")) {
-      let scope = Object.entries(scopes).find(([s]) =>
-        Url.pathname.startsWith(`/${s}`)
+      const scope = Object.entries(scopes).find(([s]) =>
+        Url.pathname.startsWith(`/${s}`),
       );
       // Expand url with found scope
       Url.protocol = "file";
-      let url = scope ? Url.pathname.replace(scope[0], scope[1]) : Url.pathname;
+      const url = scope
+        ? Url.pathname.replace(scope[0], scope[1])
+        : Url.pathname;
       let filename = path.join(root, url);
       try {
         const stat = await fs.stat(filename);
@@ -52,11 +40,7 @@ export const cssFileServer: MiddlewareFactory =
       try {
         const stat = await fs.stat(filename);
         if (stat.isFile()) {
-          const css = await compile(
-            filename.replace(root, "."),
-            root,
-            Url.search
-          );
+          const css = (await fs.readFile(filename)).toString();
           return render(css);
         }
       } catch {}

package/src/server/http/index.ts

@@ -2,25 +2,26 @@
 
 import {
   createServer,
-  IncomingMessage,
-  RequestListener,
-  ServerResponse,
-} from "http";
-import { AddressInfo } from "net";
-import * as path from "path";
-import { info } from "../../log.js";
-import { findIndex } from "./apps.js";
-import { cssFileServer } from "./css.js";
-import { fileResponse } from "./response.js";
-import { sitemap } from "./sitemap.js";
-import { staticFileServer } from "./static.js";
-import { tsFileServer } from "./typescript.js";
+  type IncomingMessage,
+  type RequestListener,
+  type ServerResponse,
+} from "node:http";
+import type { AddressInfo } from "node:net";
+import * as path from "node:path";
+import { info } from "../../log.ts";
+import { findIndex } from "./apps.ts";
+import { cssFileServer } from "./css.ts";
+import { fileResponse } from "./response.ts";
+import { sitemap } from "./sitemap.ts";
+import { staticFileServer } from "./static.ts";
+import { tsFileServer } from "./typescript.ts";
 
 export interface StaticResponse {
   status: 200 | 404 | 500;
   content: Buffer;
   contentType: string;
   contentLength?: number;
+  headers?: Map<string, string>;
 }
 
 export interface ServerConfig {
@@ -28,13 +29,13 @@ export interface ServerConfig {
   scopes?: Record<`@${string}`, string>;
 }
 
-export interface MiddlewareFactory {
-  (config: ServerConfig): Promise<StaticMiddleware>;
-}
+export type MiddlewareFactory = (
+  config: ServerConfig,
+) => Promise<StaticMiddleware>;
 
-export interface StaticMiddleware {
-  (req: IncomingMessage): Promise<undefined | (() => Promise<StaticResponse>)>;
-}
+export type StaticMiddleware = (
+  req: IncomingMessage,
+) => Promise<undefined | (() => Promise<StaticResponse>)>;
 
 const notFound: MiddlewareFactory =
   async ({ root }) =>
@@ -43,7 +44,7 @@ const notFound: MiddlewareFactory =
       // path.join(path.dirname(FLAGS.argv0), "404.html"),
       path.join(root, "404.html"),
       undefined,
-      404
+      404,
     );
 
 const BASE_MIDDLEWARES: MiddlewareFactory[] = [
@@ -65,10 +66,15 @@ const error = (res: ServerResponse, message: string) => {
 
 const sendContent = async (
   res: ServerResponse,
-  { content, contentType, contentLength }: StaticResponse
+  { content, contentType, contentLength, headers }: StaticResponse,
 ) => {
   res.setHeader("Content-Length", `${contentLength}`);
   res.setHeader("Content-Type", contentType);
+  if (headers) {
+    for (const [header, value] of headers.entries()) {
+      res.setHeader(header.toLowerCase(), value);
+    }
+  }
   await res.write(content);
   res.end();
   return true;
@@ -84,10 +90,10 @@ const log = (req: IncomingMessage) => {
 
 export const makeServer = async (
   config: ServerConfig,
-  middlewares: MiddlewareFactory[] = []
+  middlewares: MiddlewareFactory[] = [],
 ) => {
   const handlers = await Promise.all(
-    [...middlewares, ...BASE_MIDDLEWARES].map(async (m) => m(config))
+    [...middlewares, ...BASE_MIDDLEWARES].map(async (m) => m(config)),
   );
   const middlewareHandler: RequestListener = async (req, res) => {
     log(req);
@@ -105,7 +111,7 @@ export const makeServer = async (
         res.end();
       }
     } catch (e) {
-      error(res, (e as Error).message + "\n" + (e as Error).stack);
+      error(res, `${(e as Error).message}\n${(e as Error).stack}`);
     }
   };
 

package/src/server/http/response.ts

@@ -1,9 +1,10 @@
-import { Stats } from "fs";
-import * as fs from "fs/promises";
-import { StaticResponse } from ".";
+import type { Stats } from "node:fs";
+import * as fs from "node:fs/promises";
+import type { StaticResponse } from ".";
 
 const MIME_TYPES: Record<string, string> = {
   js: "text/javascript",
+  ts: "text/javascript",
   json: "text/javascript",
   css: "text/css",
   html: "text/html",
@@ -38,13 +39,19 @@ export const fileResponse =
 
 const CHARSET = "utf-8";
 export const contentResponse =
-  (content: string, contentType: string, status: 200 | 404 | 500 = 200) =>
+  (
+    content: string,
+    contentType: string,
+    status: 200 | 404 | 500 = 200,
+    headers: Map<string, string> = new Map(),
+  ) =>
   async (): Promise<StaticResponse> => {
     const contentBuffer = Buffer.from(content, CHARSET);
     return {
       content: contentBuffer,
-      contentType: contentType.split(";")[0] + "; charset=" + CHARSET,
+      contentType: `${contentType.split(";")[0]}; charset=${CHARSET}`,
       status,
       contentLength: contentBuffer.length,
+      headers,
     };
   };

package/src/server/http/sitemap.ts

@@ -1,8 +1,8 @@
-import * as fs from "fs/promises";
-import * as path from "path";
-import { info } from "../../log.js";
-import { MiddlewareFactory } from "./index.js";
-import { contentResponse } from "./response.js";
+import * as fs from "node:fs/promises";
+import * as path from "node:path";
+import { info } from "../../log.ts";
+import type { MiddlewareFactory } from "./index.ts";
+import { contentResponse } from "./response.ts";
 
 const findSiteMap = async (root: string, prefix = root) => {
   if (root.startsWith("node_modules")) {
@@ -16,8 +16,8 @@ const findSiteMap = async (root: string, prefix = root) => {
         .replaceAll(path.sep, "/");
       if (entry.isFile()) {
         if (entry.name === "index.html") {
-          let index = next.replace(prefix, "");
-          info(`Adding to sitemap`, { index });
+          const index = next.replace(prefix, "");
+          info("Adding to sitemap", { index });
           return [index];
         }
       } else if (entry.isDirectory()) {
@@ -30,7 +30,7 @@ const findSiteMap = async (root: string, prefix = root) => {
         return flattened;
       }
       return [];
-    }
+    },
   );
   return children;
 };

package/src/server/http/static.ts

@@ -1,15 +1,15 @@
-import * as path from "path";
-import * as fs from "fs/promises";
-import { fileResponse } from "./response.js";
-import type { MiddlewareFactory } from "./index.js";
+import * as fs from "node:fs/promises";
+import * as path from "node:path";
+import type { MiddlewareFactory } from "./index.ts";
+import { fileResponse } from "./response.ts";
 
 export const staticFileServer: MiddlewareFactory =
   async ({ root, scopes = {} }) =>
   async (req) => {
     const scope = Object.entries(scopes).find(([s]) =>
-      req.url?.startsWith(`/${s}`)
+      req.url?.startsWith(`/${s}`),
     );
-    const url = new URL(req.url ?? "", `http://localhost`);
+    const url = new URL(req.url ?? "", "http://localhost");
     const pathname = scope
       ? url.pathname.replace(scope[0], scope[1])
       : url.pathname;
@@ -21,6 +21,9 @@ export const staticFileServer: MiddlewareFactory =
       const stat = await fs.stat(filename);
       return stat.isDirectory() ? undefined : fileResponse(filename, stat);
     } catch (e) {
+      if ((e as { code?: string }).code === "ENOENT") {
+        return fileResponse(filename, undefined, 404);
+      }
       console.error(e);
       return undefined;
     }

package/src/server/http/typescript.ts

@@ -1,15 +1,15 @@
-import * as fs from "fs/promises";
-import * as path from "path";
-import { contentResponse } from "./response.js";
+import * as fs from "node:fs/promises";
+import * as path from "node:path";
 import { transpile } from "../../transpile.mjs";
-import { MiddlewareFactory } from "./index.js";
+import type { MiddlewareFactory } from "./index.ts";
+import { contentResponse } from "./response.ts";
 
-function render(source: string) {
+function render(source: string, headers: Map<string, string>) {
   // Replace `from "@scope` with `from "/@scope`, for browsers
   source = source
     .replaceAll(`from "@`, 'from "/@')
     .replaceAll(`import("@`, 'import("/@');
-  return contentResponse(source, "application/javascript");
+  return contentResponse(source, "application/javascript", 200, headers);
 }
 
 /**
@@ -18,29 +18,29 @@ function render(source: string) {
 export const tsFileServer: MiddlewareFactory =
   async ({ root, scopes = {} }) =>
   async (req) => {
-    if (req.url?.endsWith(".js")) {
-      let scope = Object.entries(scopes).find(([s]) =>
-        req.url?.startsWith(`/${s}`)
+    if (req.url?.endsWith(".js") || req.url?.endsWith(".ts")) {
+      const scope = Object.entries(scopes).find(([s]) =>
+        req.url?.startsWith(`/${s}`),
       );
       // Expand url with found scope
-      let url = scope ? req.url.replace(scope[0], scope[1]) : req.url;
+      const url = scope ? req.url.replace(scope[0], scope[1]) : req.url;
       let filename = path.join(root, url);
-      try {
-        const stat = await fs.stat(filename);
-        if (stat.isFile()) {
-          const js = (await fs.readFile(filename)).toString("utf-8");
-          return render(js);
+      const stat = await fs.stat(filename);
+      if (stat.isFile()) {
+        let js: string;
+        const headers: Map<string, string> = new Map();
+        if (filename.endsWith(".ts")) {
+          js = await transpile(filename, () => fs.readFile(filename));
+          headers.set("SourceMap", `${url}.map`);
+          js += `\n//# sourceURL=${url}`;
+        } else {
+          if (url.endsWith(".ts.map")) {
+            filename = filename.replace(/\.map$/, "");
+          }
+          js = (await fs.readFile(filename)).toString("utf-8");
         }
-      } catch {}
-
-      filename = filename.replace(/\.js$/, ".ts");
-      try {
-        const stat = await fs.stat(filename);
-        if (stat.isFile()) {
-          const js = await transpile(filename, () => fs.readFile(filename));
-          return render(js);
-        }
-      } catch {}
+        return render(js, headers);
+      }
     }
     return undefined;
   };

package/src/server/main.ts

@@ -1,19 +1,22 @@
 #!/usr/bin/env node --experimental-loader ../loader.mjs
+import * as process from "node:process";
+
+import { info } from "../log.ts";
 
-import { info } from "../log.js";
 info("Starting server", { cwd: process.cwd() });
 
-import { parse } from "../flags.js";
+import { parse } from "../flags.ts";
+
 const FLAGS = parse(process.argv);
 
-import { makeServer } from "./http/index.js";
 import * as path from "node:path";
+import { makeServer } from "./http/index.ts";
 
 async function main() {
   const server = await makeServer({ root: path.join(process.cwd(), "src") });
   server.listen(
     FLAGS.asNumber("port", 8080),
-    FLAGS.asString("host", "0.0.0.0")
+    FLAGS.asString("host", "0.0.0.0"),
   );
 }
 

package/src/test.mjs

@@ -1,24 +1,24 @@
 #!/usr/bin/env node
 
-import { parse } from "./flags.js";
-import { execute } from "./scope/execute.js";
-import { asXML } from "./scope/display/junit.js";
-import { onConsole } from "./scope/display/console.js";
+import { parse } from "./flags.ts";
+import { onConsole } from "./scope/display/console.ts";
+import { asXML } from "./scope/display/junit.ts";
+import { execute } from "./scope/execute.ts";
 
 async function main() {
-  await import("./test_all.js");
+  await import("./test_all.ts");
 
-  (async function () {
+  (async () => {
     const results = await execute();
 
     const FLAGS = parse(process.argv);
 
     switch (FLAGS.asString("mode", "console")) {
-      case "junit":
+      case "junit": {
         const xml = asXML(results);
         console.log(xml);
         break;
-      case "console":
+      }
       default:
         onConsole(results);
         break;

package/src/test_all.ts

@@ -1,6 +1,6 @@
 // This file must be .js for imports to run. Unused imports in .ts files are
 // discarded during transpilation.
-import { describe, expect, it } from "./scope/index.js";
+import { describe, expect, it } from "./scope/index.ts";
 
 describe("Test executor", () => {
   it("matches equality", () => {
@@ -12,20 +12,23 @@ describe("Test executor", () => {
   });
 });
 
-import "./context.test.js";
-import "./diff.test.js";
-import "./equal.test.js";
-import "./flags.test.js";
-import "./fs.test.js";
-import "./generator.test.js";
-import "./lock.test.js";
-import "./result.test.js";
-import "./observable/observable.test.js";
+import "./context.test.ts";
+import "./diff.test.ts";
+import "./equal.test.ts";
+import "./flags.test.ts";
+import "./fs.test.ts";
+import "./generator.test.ts";
+import "./lock.test.ts";
+import "./result.test.ts";
+import "./observable/observable.test.ts";
 
-if (typeof process != "undefined" && process.env.CI?.toLowerCase() !== "true") {
+if (
+  typeof process !== "undefined" &&
+  process.env.CI?.toLowerCase() !== "true"
+) {
   (async () => {
-    const components = await import("./components/test.js");
-    const dom = await import("./dom/test.js");
+    const components = await import("./components/test.ts");
+    const dom = await import("./dom/test.ts");
     await components.loadTests();
     await dom.loadTests();
   })();

package/src/transpile.mjs

@@ -1,28 +1,16 @@
-// @ts-ignore
-import ts from "typescript";
-
-const compilerOptions = {
-  target: ts.ScriptTarget.ESNext,
-  module: ts.ModuleKind.ESNext,
-  inlineSourceMap: true,
-  inlineSources: true,
-};
+// @ts-expect-error
+import tsBlankSpace from "ts-blank-space";
 
 const tsmap = new Map();
 
 export async function transpile(
   /** @type string */ url,
-  /** @type {() => Promise<{toString(): string}>} */ get
+  /** @type {() => Promise<{toString(): string}>} */ get,
 ) {
   if (!tsmap.has(url)) {
-    const source = ts.transpile(
-      (await get()).toString(),
-      compilerOptions,
-      url,
-      undefined,
-      url
-    );
-    tsmap.set(url, source);
+    const source = (await get()).toString();
+    const js = tsBlankSpace(source);
+    tsmap.set(url, js);
   }
 
   return tsmap.get(url);