use lol-html 2 without asyncify

Cargo.toml

@@ -5,9 +5,9 @@ edition = "2018"
 [dependencies]
 js-sys = "0.3.72"
 lol_html = "2.0.0"
-serde = { version = "1.0.214", features = ["derive"] }
+serde = { version = "1.0.215", features = ["derive"] }
 serde-wasm-bindgen = "0.6.5"
-wasm-bindgen = "0.2.74"
+wasm-bindgen = "0.2.95"
 thiserror = "2.0.3"
 
 [lib]

src/handlers.rs

@@ -51,7 +51,9 @@ impl IntoNativeHandlers<NativeElementContentHandlers<'static>> for ElementConten
                             let (js_arg, anchor) = Element::from_native(el);
                             let js_arg = JsValue::from(js_arg);
                             let res = match handler.call1(&this, &js_arg) {
-                                Ok(_) => Ok(()),
+                                Ok(_) => {
+                                    Ok(())
+                                }
                                 Err(e) => Err(HandlerJsErrorWrap(e).into()),
                             };
                             mem::drop(anchor);

src/html_rewriter.rs

@@ -107,6 +107,7 @@ impl HTMLRewriter {
         Ok(())
     }
 
+
     pub fn write(&mut self, chunk: &[u8]) -> JsResult<()> {
         self.inner_mut()?
             .write(chunk)

src/html_rewriter_wrapper.ts

@@ -2,22 +2,20 @@ import { HTMLRewriter as RawHTMLRewriter } from "../pkg/html_rewriter.js";
 
 import { ElementHandlers } from "./types.d.ts";
 
-class HTMLRewriter {
-  static initPromise?: Promise<void>;
+type SelectorElementHandlers = [selector: string, handlers: ElementHandlers];
 
-  constructor() {}
+export class HTMLRewriter {
+  readonly #elementHandlers: SelectorElementHandlers[] = [];
 
-  elementHandlers: [selector: string, handlers: ElementHandlers][] = [];
-
-  on(selector: string, handlers: ElementHandlers): HTMLRewriter {
-    this.elementHandlers.push([selector, handlers]);
+  on(selector: string, handlers: ElementHandlers): this {
+    this.#elementHandlers.push([selector, handlers]);
     return this;
   }
 
   transform(response: Response): Response {
     const body = response.body as ReadableStream<Uint8Array> | null;
     // HTMLRewriter doesn't run the end handler if the body is null, so it's
-    // pointless to setup the readable stream.
+    // pointless to setup the transform stream.
     if (body === null) return new Response(body, response);
 
     if (response instanceof Response) {
@@ -27,56 +25,36 @@ class HTMLRewriter {
     }
 
     let rewriter: RawHTMLRewriter;
-    const readable = new ReadableStream<Uint8Array>({
-      start: async (controller) => {
+    const transformStream = new TransformStream<Uint8Array, Uint8Array>({
+      start: (controller) => {
         // Create a rewriter instance for this transformation that writes its
         // output to the transformed response's stream. Note that each
-        // BaseHTMLRewriter can only be used once.
-        await HTMLRewriter.initPromise;
-        // console.log('creating rewriter')
-        rewriter = new RawHTMLRewriter((chunk: Uint8Array) => {
-          // enqueue will throw on empty chunks
-          if (chunk.length !== 0) controller.enqueue(chunk);
-        });
+        // RawHTMLRewriter can only be used once.
+        rewriter = new RawHTMLRewriter(
+          (output: Uint8Array) => {
+            // enqueue will throw on empty chunks
+            if (output.length !== 0) controller.enqueue(output);
+          },
+        );
         // Add all registered handlers
-        for (const [selector, handlers] of this.elementHandlers) {
+        for (const [selector, handlers] of this.#elementHandlers) {
           rewriter.on(selector, handlers);
         }
-
-        // Pipe the response body to the rewriter
-        const reader = body.getReader();
-        try {
-          while (true) {
-            // console.log('reading')
-            const { done, value } = await reader.read();
-            if (done) break;
-            rewriter.write(value);
-          }
-
-          rewriter.end();
-        } catch (error) {
-          // rewriter.end()
-          controller.error(error);
-        } finally {
-          rewriter.free();
-          reader.releaseLock();
-          controller.close();
-        }
       },
+      // The finally() below will ensure the rewriter is always freed.
+      // chunk is guaranteed to be a Uint8Array as we're using the
+      // @miniflare/core Response class, which transforms to a byte stream.
+      transform: (chunk) => rewriter.write(chunk),
+      flush: () => rewriter.end(),
     });
+    const promise = body.pipeTo(transformStream.writable);
+    promise.catch(() => {}).finally(() => rewriter?.free());
 
     // Return a response with the transformed body, copying over headers, etc
-    const res = new Response(readable, response);
+    const res = new Response(transformStream.readable, response);
     // If Content-Length is set, it's probably going to be wrong, since we're
     // rewriting content, so remove it
     res.headers.delete("Content-Length");
     return res;
   }
 }
-
-export function HTMLRewriterWrapper(
-  initPromise: typeof HTMLRewriter.initPromise,
-) {
-  HTMLRewriter.initPromise = initPromise;
-  return HTMLRewriter;
-}

src/index.ts

@@ -1,5 +1,5 @@
 import init from "../pkg/html_rewriter.js";
-import { HTMLRewriterWrapper } from "./html_rewriter_wrapper.ts";
+import { HTMLRewriter } from "./html_rewriter_wrapper.ts";
 import { Element } from "./types.d.ts";
 
 type Params = {
@@ -146,10 +146,7 @@ export async function csp(originalResponse: Response, params?: Params) {
   }
 
   const querySelectors = ["script", 'link[rel="preload"][as="script"]'];
-  const HTMLRewriter: ReturnType<typeof HTMLRewriterWrapper> =
-    HTMLRewriterWrapper(
-      await init(),
-    );
+  await init();
   return new HTMLRewriter()
     .on(querySelectors.join(","), {
       element(element: Element) {