test: add unit test

src/components/micro-frame-sse/__tests__/__snapshots__/micro-frame-sse/csr-slot-done-and-error/renders.expected/loading.0.html

@@ -0,0 +1,9 @@
+<div>
+  Host app
+</div>
+<button>
+  Load Slot1
+</button>
+<script>
+  $csr_slot_done_and_error_index_C=(window.$csr_slot_done_and_error_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["BQ+bMDNF"]})
+</script>

src/components/micro-frame-sse/__tests__/__snapshots__/micro-frame-sse/csr-slot-done-and-error/renders.expected/loading.1.html

@@ -0,0 +1,13 @@
+<div>
+  Host app
+</div>
+<button>
+  Load Slot1
+</button>
+<div />
+<div>
+  Loading...
+</div>
+<script>
+  $csr_slot_done_and_error_index_C=(window.$csr_slot_done_and_error_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["BQ+bMDNF"]})
+</script>

src/components/micro-frame-sse/__tests__/__snapshots__/micro-frame-sse/csr-slot-done-and-error/renders.expected/loading.2.html

@@ -0,0 +1,16 @@
+<div>
+  Host app
+</div>
+<button>
+  Load Slot1
+</button>
+<div />
+<div>
+  Loading...
+  <p>
+    test_html for slot_2
+  </p>
+</div>
+<script>
+  $csr_slot_done_and_error_index_C=(window.$csr_slot_done_and_error_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["BQ+bMDNF"]})
+</script>

src/components/micro-frame-sse/__tests__/__snapshots__/micro-frame-sse/csr-slot-done-and-error/renders.expected/loading.3.html

@@ -0,0 +1,15 @@
+<div>
+  Host app
+</div>
+<button>
+  Load Slot1
+</button>
+<div />
+<div>
+  <p>
+    test_html for slot_2
+  </p>
+</div>
+<script>
+  $csr_slot_done_and_error_index_C=(window.$csr_slot_done_and_error_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["BQ+bMDNF"]})
+</script>

src/components/micro-frame-sse/__tests__/__snapshots__/micro-frame-sse/csr-slot-done-and-error/renders.expected/step-0.0.html

@@ -0,0 +1,18 @@
+<div>
+  Host app
+</div>
+<button>
+  Load Slot1
+</button>
+<div />
+<div>
+  <p>
+    test_html for slot_2
+  </p>
+</div>
+<div>
+  Loading...
+</div>
+<script>
+  $csr_slot_done_and_error_index_C=(window.$csr_slot_done_and_error_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["BQ+bMDNF"]})
+</script>

src/components/micro-frame-sse/__tests__/__snapshots__/micro-frame-sse/csr-slot-done-and-error/renders.expected/step-0.1.html

@@ -0,0 +1,20 @@
+<div>
+  Host app
+</div>
+<button>
+  Load Slot1
+</button>
+<div />
+<div>
+  <p>
+    test_html for slot_2
+  </p>
+</div>
+<div>
+  <p>
+    test_html for slot_1
+  </p>
+</div>
+<script>
+  $csr_slot_done_and_error_index_C=(window.$csr_slot_done_and_error_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["BQ+bMDNF"]})
+</script>

src/components/micro-frame-sse/__tests__/fixtures/csr-slot-done-and-error/components/app.marko

@@ -0,0 +1,31 @@
+class {
+  onCreate() {
+    this.state = { mounted: false, loadSlot1: false };
+  }
+  onMount() {
+    this.state.mounted = true;
+  }
+  loadSlot1() {
+    this.state.loadSlot1 = true;
+  }
+}
+
+<button onClick("loadSlot1")>Load Slot1</button>
+<if(state.mounted)>
+  <micro-frame-sse src="embed" name="test" read(e) { return [e.lastEventId, e.data, true] } />
+  <micro-frame-slot from="test" slot="slot_2">
+    <@loading>
+      Loading...
+    </@loading>
+  </micro-frame-slot>
+  <if(state.loadSlot1)>
+    <micro-frame-slot from="test" slot="slot_1">
+      <@loading>
+        Loading...
+      </@loading>
+      <@catch|err|>
+        ${err}
+      </@catch>
+    </micro-frame-slot>
+  </if>
+</if>

src/components/micro-frame-sse/__tests__/fixtures/csr-slot-done-and-error/embed.marko

@@ -0,0 +1,26 @@
+import { wait } from "../../../../../__tests__/queue";
+import fs from "fs";
+import path from "path";
+
+$ const slot_1_html = fs.readFileSync(path.resolve(__dirname ,'slot_1.html'), 'utf8');
+$ const slot_2_html = fs.readFileSync(path.resolve(__dirname ,'slot_2.html'), 'utf8');
+$ const first = `id: slot_1\ndata: ${slot_1_html.replace(/\r?\n/g, '')}\n\n`;
+$ const second = `id: slot_2\ndata: ${slot_2_html.replace(/\r?\n/g, '')}\n\n`;
+$ const third = `id: slot_1\ndata: next chunk for slot_1\n\n`;
+
+<await(wait())>
+  <@then>
+    $!{first}
+    <await(wait())>
+      <@then>
+        $!{second}
+        <await(wait())>
+          <@then>
+            $!{third}
+            <await(new Promise((_, reject) => setTimeout(() => reject("Error"), 100))) />
+          </@then>
+        </await>
+      </@then>
+    </await>
+  </@then>
+</await>

src/components/micro-frame-sse/__tests__/fixtures/csr-slot-done-and-error/index.marko

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Simple Example</title>
+  <esbuild-assets/>
+</head>
+<body>
+  <div>Host app</div>
+  <app/>
+</body>
+</html>

src/components/micro-frame-sse/__tests__/fixtures/csr-slot-done-and-error/slot_1.html

@@ -0,0 +1 @@
+<p>test_html for slot_1</p>

src/components/micro-frame-sse/__tests__/fixtures/csr-slot-done-and-error/slot_2.html

@@ -0,0 +1 @@
+<p>test_html for slot_2</p>

src/components/micro-frame-sse/__tests__/server.test.ts

@@ -171,6 +171,13 @@ describe("micro-frame-sse", () => {
     fixture(path.join(__dirname, "fixtures/csr-slot-done-signal"))
   );
 
+  describe(
+    "csr slot done and error",
+    fixture(path.join(__dirname, "fixtures/csr-slot-done-and-error"), [
+      async (page) => await page.click("text=Load Slot1"),
+    ])
+  );
+
   describe("csr 404", fixture(path.join(__dirname, "fixtures/csr-404")));
 
   describe("ssr 404", fixture(path.join(__dirname, "fixtures/ssr-404")));

src/util/stream.ts

@@ -113,7 +113,6 @@ export function createWritable(): StreamWritable {
     },
     error(reason: unknown) {
       error = reason;
-      buf = "";
 
       if (pending) {
         pending.reject(reason);