Feat/add cli command (#19)

* feat: add sw to the package and compilation with cli to copy code

* feat: add cli command

* chore: add new cli name

* chore: add package.json keywords

Author: kevinccbsg

examples/my-twd-app/public/mock-sw.js

@@ -5,6 +5,13 @@
   "main": "./dist/twd.umd.js",
   "module": "./dist/twd.es.js",
   "types": "./dist/index.d.ts",
+  "bin": {
+    "twd-js": "./dist/cli.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:BRIKEV/twd.git"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -16,7 +23,7 @@
     "dist"
   ],
   "scripts": {
-    "build": "vite build",
+    "build": "vite build && vite build -c vite.sw.config.js && cp src/cli/installsw.js dist/cli.js",
     "test": "vitest",
     "test:ci": "vitest --run --coverage",
     "conventional-changelog": "conventional-changelog -i CHANGELOG.md",
@@ -37,5 +44,19 @@
     "vite": "^7.1.4",
     "vite-plugin-dts": "^4.5.4",
     "vitest": "^3.2.4"
-  }
+  },
+  "keywords": [
+    "testing",
+    "twd-js",
+    "twd",
+    "tdd",
+    "bdd",
+    "test",
+    "development",
+    "react",
+    "javascript",
+    "typescript",
+    "vite",
+    "vitest"
+  ]
 }

package.json

@@ -0,0 +1,35 @@
+#!/usr/bin/env node
+import fs from "fs";
+import path from "path";
+import { fileURLToPath } from "url";
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+const [, , command, targetDir, ...flags] = process.argv;
+
+if (command !== "init") {
+  console.error("Usage: npx twd-mock init <public-dir> [--save]");
+  process.exit(1);
+}
+
+if (!targetDir) {
+  console.error("❌ You must provide a target public dir");
+  process.exit(1);
+}
+
+const save = flags.includes("--save");
+const src = path.join(__dirname, "../dist/mock-sw.js");
+const dest = path.resolve(process.cwd(), targetDir, "mock-sw.js");
+
+fs.mkdirSync(path.dirname(dest), { recursive: true });
+fs.copyFileSync(src, dest);
+
+console.log(`✅ mock-sw.js copied to ${dest}`);
+if (save) {
+  console.log("💡 Remember to register it in your app:");
+  console.log(`
+if ("serviceWorker" in navigator) {
+  navigator.serviceWorker.register("/mock-sw.js?v=1");
+}
+  `);
+}

src/cli/installsw.js

@@ -0,0 +1,63 @@
+// mock-sw.js
+
+// Storage for rules inside the SW
+let rules = [];
+
+/**
+ * Match a request against rules
+ */
+const findRule = (method, url) => {
+  return rules.find(
+    (r) =>
+      r.method === method &&
+      (typeof r.url === "string" ? r.url === url : new RegExp(r.url).test(url))
+  );
+};
+
+// Intercept fetches
+self.addEventListener("fetch", (event) => {
+  const { method } = event.request;
+  const url = event.request.url;
+
+  const rule = findRule(method, url);
+
+  if (rule) {
+    console.log("Mock hit:", rule.alias, method, url);
+
+    event.respondWith(
+      (async () => {
+        // Capture body if needed
+        let body = null;
+        try {
+          body = await event.request.clone().text();
+        } catch {}
+
+        // Mark executed and notify page
+        self.clients.matchAll().then((clients) => {
+          clients.forEach((client) =>
+            client.postMessage({
+              type: "EXECUTED",
+              alias: rule.alias,
+              request: body,
+            })
+          );
+        });
+
+        return new Response(JSON.stringify(rule.response), {
+          status: rule.status || 200,
+          headers: rule.headers || { "Content-Type": "application/json" },
+        });
+      })()
+    );
+  }
+});
+
+// Listen for messages from the app
+self.addEventListener("message", (event) => {
+  const { type, rule } = event.data || {};
+  if (type === "ADD_RULE") {
+    rules = rules.filter((r) => r.alias !== rule.alias);
+    rules.push(rule);
+    console.log("Rule added:", rule);
+  }
+});

src/cli/mock-sw.js

@@ -0,0 +1,14 @@
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  build: {
+    outDir: "dist",
+    emptyOutDir: false,
+    rollupOptions: {
+      input: "src/cli/mock-sw.js",
+      output: {
+        entryFileNames: "mock-sw.js",
+      },
+    },
+  },
+});