twd-js 0.5.0 → 0.5.2

package/README.md

@@ -72,10 +72,10 @@ pnpm add twd-js
     if (import.meta.env.DEV) {
       // Use Vite's glob import to find all test files
       const testModules = import.meta.glob("./**/*.twd.test.ts");
-      const { initViteLoadTests, twd } = await import('twd-js');
-      // Initialize the TWD sidebar and load tests
-      initViteLoadTests(testModules, { open: true, position: 'left' });
-      // Optionally initialize request mocking
+      const { initTests, twd, TWDSidebar } = await import('twd-js');
+      // You need to pass the test modules, the sidebar component, and createRoot function
+      initTests(testModules, <TWDSidebar open={true} position="left" />, createRoot);
+      // if you want to use mock requests, you can initialize it here
       twd.initRequestMocking()
         .then(() => {
           console.log("Request mocking initialized");
@@ -88,7 +88,6 @@ pnpm add twd-js
    createRoot(document.getElementById("root")!).render(
      <StrictMode>
        <App />
-       <TWDSidebar open={false} />
      </StrictMode>
    );
    ```
@@ -140,9 +139,9 @@ pnpm add twd-js
      if (import.meta.env.DEV) {
        // Use Vite's glob import to find all test files
        const testModules = import.meta.glob("./**/*.twd.test.ts");
-       const { initViteLoadTests, twd } = await import('twd-js');
-       // Initialize the TWD sidebar and load tests
-       initViteLoadTests(testModules, { open: true, position: 'left' });
+       const { initTests, twd, TWDSidebar } = await import('twd-js');
+       // You need to pass the test modules, the sidebar component, and createRoot function
+       initTests(testModules, <TWDSidebar open={true} position="left" />, createRoot);
        // Optionally initialize request mocking
        twd.initRequestMocking()
          .then(() => {
@@ -169,8 +168,8 @@ pnpm add twd-js
          './app.twd.test.ts': () => import('./app.twd.test'),
          './another-test-file.twd.test.ts': () => import('./another-test-file.twd.test'),
        };
-       const { initViteLoadTests } = await import('twd-js');
-       initViteLoadTests(testModules);
+       const { initTests, TWDSidebar } = await import('twd-js');
+       initTests(testModules, <TWDSidebar open={true} position="left" />, createRoot);
      }
      ```
 

package/dist/commands/mockBridge.d.ts

@@ -6,7 +6,7 @@ export type Rule = {
     executed?: boolean;
     request?: unknown;
     status?: number;
-    headers?: Record<string, string>;
+    responseHeaders?: Record<string, string>;
     urlRegex?: boolean;
 };
 export interface Options {
@@ -14,7 +14,7 @@ export interface Options {
     url: string | RegExp;
     response: unknown;
     status?: number;
-    headers?: Record<string, string>;
+    responseHeaders?: Record<string, string>;
     urlRegex?: boolean;
 }
 /**
@@ -31,7 +31,8 @@ export declare const initRequestMocking: () => Promise<void>;
  *  - `url`: URL string or RegExp to match
  *  - `response`: Body of the mocked response
  *  - `status`: (optional) HTTP status code (default: 200)
- *  - `headers`: (optional) Response headers
+ *  - `responseHeaders`: (optional) Response headers
+ *  - `urlRegex`: (optional) Whether the URL is a regex (default: false)
  *
  * @example
  * ```ts

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './twd';
-export { initViteLoadTests } from './initializers/viteLoadTests';
+export { TWDSidebar } from './ui/TWDSidebar';
+export { initTests } from './initializers/initTests';
 export { expect } from 'chai';
 export { userEvent } from './proxies/userEvent';

package/dist/initializers/initSidebar.d.ts

@@ -1,6 +1,8 @@
 interface Options {
-    open: boolean;
-    position?: 'left' | 'right';
+    Component: React.ReactNode;
+    createRoot: (el: HTMLElement) => {
+        render: (el: React.ReactNode) => void;
+    };
 }
 /**
  * Initialize the TWD sidebar.
@@ -10,8 +12,11 @@ interface Options {
  * import { initSidebar } from 'twd-js';
  *
  * // Initialize the sidebar (e.g., in your main app file)
- * initSidebar({ open: false, position: 'left' });
+ * initSidebar({
+ *   Component: <TWDSidebar open={true} position="left" />,
+ *   createRoot,
+ * });
  * ```
  */
-export declare const initSidebar: (options: Options) => Promise<void>;
+export declare const initSidebar: (options: Options) => void;
 export {};

package/dist/initializers/{viteLoadTests.d.ts → initTests.d.ts}

@@ -1,7 +1,3 @@
-interface Options {
-    open: boolean;
-    position?: 'left' | 'right';
-}
 /**
  * A record of test module paths to their loader functions.
  * Each function returns a promise that resolves when the module is loaded.
@@ -18,15 +14,18 @@ type TestModule = Record<string, () => Promise<unknown>>;
 /**
  * Initialize Vite test loading.
  * @param testModules - The test modules to load.
- * @param options - Options for initializing the test loader.
+ * @param component - The React component to render the sidebar.
+ * @param createRoot - Function to create a React root.
  * @example
  * ```ts
  * if (import.meta.env.DEV) {
  *   const testModules = import.meta.glob("./example.twd.test.ts");
- *   const { initViteLoadTests } = await import('twd-js');
- *   await initViteLoadTests(testModules, { open: false, position: 'left' });
+ *   const { initTests, TWDSidebar } = await import('twd-js');
+ *   await initTests(testModules, <TWDSidebar open={true} position="left" />, createRoot);
  * }
  * ```
  */
-export declare const initViteLoadTests: (testModules: TestModule, options: Options) => Promise<void>;
+export declare const initTests: (testModules: TestModule, Component: React.ReactNode, createRoot: (el: HTMLElement) => {
+    render: (el: React.ReactNode) => void;
+}) => Promise<void>;
 export {};

package/dist/mock-sw.js

@@ -1 +1 @@
-function c(t,s,n){return n.find(e=>{const l=e.method.toLowerCase()===t.toLowerCase();if(e.urlRegex){const r=new RegExp(e.url);return l&&r.test(s)}const a=e.url===s||s.includes(e.url);return l&&a})}function i(t,s,n){t.forEach(e=>e.postMessage({type:"EXECUTED",alias:s.alias,request:n}))}let o=[];const u=async t=>{const{method:s}=t.request,n=t.request.url,e=c(s,n,o);e&&(console.log("Mock hit:",e.alias,s,n),t.respondWith((async()=>{let l=null;try{l=await t.request.clone().text()}catch{}return self.clients.matchAll().then(a=>{i(a,e,l)}),new Response(JSON.stringify(e.response),{status:e.status||200,headers:e.headers||{"Content-Type":"application/json"}})})()))},d=t=>{const{type:s,rule:n}=t.data||{};s==="ADD_RULE"&&(o=o.filter(e=>e.alias!==n.alias),o.push(n),console.log("Rule added:",n)),s==="CLEAR_RULES"&&(o=[],console.log("All rules cleared"))};self.addEventListener("fetch",u);self.addEventListener("message",d);
+function u(e,s,o){return o.find(t=>{const a=t.method.toLowerCase()===e.toLowerCase();if(t.urlRegex){const n=new RegExp(t.url);return a&&n.test(s)}const l=t.url===s||s.includes(t.url);return a&&l})}function d(e,s,o){e.forEach(t=>t.postMessage({type:"EXECUTED",alias:s.alias,request:o}))}let c=[];const f=async e=>{const{method:s}=e.request,o=e.request.url,t=u(s,o,c);t&&(console.log("[TWD] Mock hit:",t.alias,s,o),e.respondWith((async()=>{let a=null;const l=e.request.headers.get("content-type")||"application/json";if(l.includes("application/json"))try{a=await e.request.clone().json()}catch{}else if(l.includes("form"))try{const n=await e.request.clone().formData();a={},n.forEach((r,i)=>{a[i]=r})}catch{}else if(l.includes("text"))try{a=await e.request.clone().text()}catch{}else if(l.includes("octet-stream"))try{a=await e.request.clone().arrayBuffer()}catch{}else if(l.includes("image"))try{a=await e.request.clone().blob()}catch{}else try{a=await e.request.clone().text()}catch{}return self.clients.matchAll().then(n=>{d(n,t,a)}),new Response(JSON.stringify(t.response),{status:t.status||200,headers:t.responseHeaders||{"Content-Type":"application/json"}})})()))},h=e=>{const{type:s,rule:o}=e.data||{};s==="ADD_RULE"&&(c=c.filter(t=>t.alias!==o.alias),c.push(o),console.log("[TWD] Rule added:",o)),s==="CLEAR_RULES"&&(c=[],console.log("[TWD] All rules cleared"))};console.log("[TWD] Mock Service Worker loaded - version 0.5.2");self.addEventListener("fetch",f);self.addEventListener("message",h);