feat(playground): add svelte 4 playground

matschik · Oct 25, 2024 · ed143c2 · ed143c2
1 parent d7b8776
commit ed143c2
Showing 1 changed file with 44 additions and 25 deletions.
diff --git a/build/lib/playgroundUrlByFramework.js b/build/lib/playgroundUrlByFramework.js
@@ -21,33 +21,19 @@ export default {
     const url = generateURLFromData(data);
     return url;
   },
+  svelte4: async (contentByFilename, title) => {
+    return generateSveltePlaygroundURL({
+      version: 4,
+      contentByFilename,
+      title,
+    });
+  },
   svelte5: async (contentByFilename, title) => {
-    const BASE_URL = "https://svelte.dev/playground/untitled?version=5#";
-
-    const filenames = Object.keys(contentByFilename);
-    if (filenames.some((f) => f.includes(".html"))) {
-      return;
-    }
-
-    const files = filenames.map((filename, index) => {
-      const contents = contentByFilename[filename];
-      const name = index === 0 ? "App.svelte" : nodePath.parse(filename).base;
-      return {
-        type: "file",
-        name,
-        basename: name,
-        contents,
-        text: true,
-      };
+    return generateSveltePlaygroundURL({
+      version: 5,
+      contentByFilename,
+      title,
     });
-
-    const payload = { title, files };
-
-    const hash = await compress_and_encode_text(JSON.stringify(payload));
-
-    const url = `${BASE_URL}${hash}`;
-
-    return url;
   },
   alpine: (contentByFilename) => {
     const BASE_URL =
@@ -119,6 +105,39 @@ export default {
   },
 };
 
+async function generateSveltePlaygroundURL({
+  version,
+  contentByFilename,
+  title,
+}) {
+  const BASE_URL = `https://svelte.dev/playground/untitled?version=${version}#`;
+
+  const filenames = Object.keys(contentByFilename);
+  if (filenames.some((f) => f.includes(".html"))) {
+    return;
+  }
+
+  const files = filenames.map((filename, index) => {
+    const contents = contentByFilename[filename];
+    const name = index === 0 ? "App.svelte" : nodePath.parse(filename).base;
+    return {
+      type: "file",
+      name,
+      basename: name,
+      contents,
+      text: true,
+    };
+  });
+
+  const payload = { title, files };
+
+  const hash = await compress_and_encode_text(JSON.stringify(payload));
+
+  const url = `${BASE_URL}${hash}`;
+
+  return url;
+}
+
 // method `compress_and_encode_text` from https://github.com/sveltejs/svelte.dev/blob/main/apps/svelte.dev/src/routes/(authed)/playground/%5Bid%5D/gzip.js
 async function compress_and_encode_text(input) {
   const reader = new Blob([input])