fix: fix issue with custom fetch function (#7)

marko-js · Sep 1, 2022 · f6b45f8 · f6b45f8
1 parent 9ffc57e
commit f6b45f8
Show file tree

Hide file tree

Showing 11 changed files with 114 additions and 0 deletions.
diff --git a/...ents/micro-frame/__tests__/__snapshots__/csr-custom-fetch/renders.expected/loading.0.html b/...ents/micro-frame/__tests__/__snapshots__/csr-custom-fetch/renders.expected/loading.0.html
@@ -0,0 +1,6 @@
+<div>
+  Host app
+</div>
+<script>
+  $csr_custom_fetch_index_C=(window.$csr_custom_fetch_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["Bj+pRfsl"]})
+</script>
diff --git a/...ents/micro-frame/__tests__/__snapshots__/csr-custom-fetch/renders.expected/loading.1.html b/...ents/micro-frame/__tests__/__snapshots__/csr-custom-fetch/renders.expected/loading.1.html
@@ -0,0 +1,7 @@
+<div>
+  Host app
+</div>
+<div />
+<script>
+  $csr_custom_fetch_index_C=(window.$csr_custom_fetch_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["Bj+pRfsl"]})
+</script>
diff --git a/...ents/micro-frame/__tests__/__snapshots__/csr-custom-fetch/renders.expected/loading.2.html b/...ents/micro-frame/__tests__/__snapshots__/csr-custom-fetch/renders.expected/loading.2.html
@@ -0,0 +1,9 @@
+<div>
+  Host app
+</div>
+<div>
+  Custom fetch(src: embed) content.
+</div>
+<script>
+  $csr_custom_fetch_index_C=(window.$csr_custom_fetch_index_C||[]).concat({"l":1,"w":[["s0-8",0,{},{"f":1}]],"t":["Bj+pRfsl"]})
+</script>
diff --git a/...ents/micro-frame/__tests__/__snapshots__/ssr-custom-fetch/renders.expected/loading.0.html b/...ents/micro-frame/__tests__/__snapshots__/ssr-custom-fetch/renders.expected/loading.0.html
@@ -0,0 +1,9 @@
+<div>
+  Host app
+</div>
+<div
+  data-src="embed"
+  id="GENERATED-0"
+>
+  Custom fetch(src: /embed) content.
+</div>
diff --git a/src/components/micro-frame/__tests__/fixtures/csr-custom-fetch/components/app.marko b/src/components/micro-frame/__tests__/fixtures/csr-custom-fetch/components/app.marko
@@ -0,0 +1,23 @@
+class {
+  onCreate() {
+    this.state = { mounted: false };
+  }
+  onMount() {
+    this.state.mounted = true;
+  }
+}
+
+<if(state.mounted)>
+  <micro-frame src="embed" fetch(src) {
+    return new Promise(resolve => {
+      const stream = new ReadableStream({
+        start(controller) {
+          const encoder = new TextEncoder();
+          controller.enqueue(encoder.encode(`Custom fetch(src: ${src}) content.`));
+          controller.close();
+        }
+      });
+      resolve({ ok: true, body: stream });
+    });
+  } />
+</if>
diff --git a/src/components/micro-frame/__tests__/fixtures/csr-custom-fetch/embed.marko b/src/components/micro-frame/__tests__/fixtures/csr-custom-fetch/embed.marko
@@ -0,0 +1,4 @@
+<esbuild-assets/>
+<div>
+  Embedded App.
+</div>
diff --git a/src/components/micro-frame/__tests__/fixtures/csr-custom-fetch/index.marko b/src/components/micro-frame/__tests__/fixtures/csr-custom-fetch/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>
diff --git a/src/components/micro-frame/__tests__/fixtures/ssr-custom-fetch/embed.marko b/src/components/micro-frame/__tests__/fixtures/ssr-custom-fetch/embed.marko
@@ -0,0 +1,4 @@
+<esbuild-assets/>
+<div>
+  Embedded App.
+</div>
diff --git a/src/components/micro-frame/__tests__/fixtures/ssr-custom-fetch/index.marko b/src/components/micro-frame/__tests__/fixtures/ssr-custom-fetch/index.marko
@@ -0,0 +1,20 @@
+<!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>
+  <micro-frame src="embed" fetch(src) {
+    async function* customFetch() {
+      yield `Custom fetch(src: ${src}) content.`;
+    }
+    return new Promise(resolve => {
+      resolve({ ok: true, body: customFetch() });
+    });
+  } />
+</body>
+</html>
diff --git a/src/components/micro-frame/__tests__/server.test.ts b/src/components/micro-frame/__tests__/server.test.ts
@@ -119,3 +119,13 @@ describe(
 describe("csr 404", fixture(path.join(__dirname, "fixtures/csr-404")));
 
 describe("ssr 404", fixture(path.join(__dirname, "fixtures/ssr-404")));
+
+describe(
+  "csr custom fetch",
+  fixture(path.join(__dirname, "fixtures/csr-custom-fetch"))
+);
+
+describe(
+  "ssr custom fetch",
+  fixture(path.join(__dirname, "fixtures/ssr-custom-fetch"))
+);
diff --git a/src/components/micro-frame/marko-tag.json b/src/components/micro-frame/marko-tag.json
@@ -32,6 +32,15 @@
       }
     ]
   },
+  "@fetch": {
+    "type": "function",
+    "required": false,
+    "autocomplete": [
+      {
+        "description": "Customized fetch function"
+      }
+    ]
+  },
   "@cache": {
     "enum": ["default", "no-store", "reload", "force-cache", "only-if-cached"],
     "autocomplete": [