npm - @aimeloic/monkey-tester - Versions diffs - 3.0.8 → 3.0.10 - Mend

@aimeloic/monkey-tester 3.0.8 → 3.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/html.backup.js CHANGED Viewed

@@ -1,8 +1,9 @@
-export function getHtmlTemplate(endpoints) {
+'use strict';
+function getHtmlTemplate(endpoints) {
   const safeJsonString = Buffer.from(JSON.stringify(endpoints)).toString('base64');
-  return `
-<!DOCTYPE html>
+  return `<!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="UTF-8">
@@ -11,172 +12,63 @@ export function getHtmlTemplate(endpoints) {
 <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=DM+Mono:wght@400;500&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet">
 <style>
   :root {
-    --bg: #0e0c09;
-    --surface: #181510;
-    --surface2: #221d14;
-    --border: #3a3020;
-    --accent: #e8a838;
-    --accent2: #c47a1e;
-    --text: #f0e8d8;
-    --text-dim: #9a8c78;
-    --red: #d45c3c;
-    --green: #6ba05a;
-    --blue: #5a86c0;
-    --radius: 8px;
+    --bg: #0e0c09; --surface: #181510; --surface2: #221d14; --border: #3a3020;
+    --accent: #e8a838; --accent2: #c47a1e; --text: #f0e8d8; --text-dim: #9a8c78;
+    --red: #d45c3c; --green: #6ba05a; --blue: #5a86c0; --radius: 8px;
   }
   * { box-sizing: border-box; margin: 0; padding: 0; }
-  body {
-    background: var(--bg);
-    color: var(--text);
-    font-family: 'DM Sans', sans-serif;
-    font-size: 14px;
-    height: 100vh;
-    overflow: hidden; /* Prevents whole-page scrolling */
-    background-image: radial-gradient(ellipse 80% 60% at 50% -20%, #3a2a0a22 0%, transparent 70%);
-  }
-  header {
-    border-bottom: 1px solid var(--border);
-    padding: 16px 32px;
-    display: flex;
-    align-items: center;
-    gap: 20px;
-    background: #0e0c09ee;
-    backdrop-filter: blur(8px);
-    height: 65px;
-  }
+  body { background: var(--bg); color: var(--text); font-family: 'DM Sans', sans-serif; font-size: 14px; height: 100vh; overflow: hidden; background-image: radial-gradient(ellipse 80% 60% at 50% -20%, #3a2a0a22 0%, transparent 70%); }
+  header { border-bottom: 1px solid var(--border); padding: 16px 32px; display: flex; align-items: center; gap: 20px; background: #0e0c09ee; backdrop-filter: blur(8px); height: 65px; }
   .logo { font-family: 'Playfair Display', serif; font-size: 20px; color: var(--accent); letter-spacing: 0.02em; }
   .logo span { color: var(--text-dim); font-size: 11px; font-family: 'DM Mono', monospace; display: inline-block; margin-left: 8px; font-weight: 400; }
   .header-right { margin-left: auto; display: flex; align-items: center; gap: 16px; }
   .jwt-wrap, .base-url-wrap { display: flex; align-items: center; gap: 8px; }
   .jwt-wrap label, .base-url-wrap label { color: var(--text-dim); font-size: 11px; font-family: 'DM Mono', monospace; letter-spacing: 0.05em; }
-  #jwt-input, #base-url {
-    background: var(--surface2); border: 1px solid var(--border); color: var(--text);
-    font-family: 'DM Mono', monospace; font-size: 12px; padding: 6px 12px; border-radius: var(--radius); width: 220px; outline: none;
-  }
-  /* Fixed view height viewport matrix layout grid rules */
-  .layout {
-    display: grid;
-    grid-template-columns: 280px 1fr 450px;
-    height: calc(100vh - 65px);
-    overflow: hidden;
-  }
-  aside {
-    border-right: 1px solid var(--border);
-    overflow-y: auto;
-    padding: 16px 0;
-    background: #0b0907;
-  }
+  #jwt-input, #base-url { background: var(--surface2); border: 1px solid var(--border); color: var(--text); font-family: 'DM Mono', monospace; font-size: 12px; padding: 6px 12px; border-radius: var(--radius); width: 220px; outline: none; }
+  .layout { display: grid; grid-template-columns: 280px 1fr 450px; height: calc(100vh - 65px); overflow: hidden; }
+  aside { border-right: 1px solid var(--border); overflow-y: auto; padding: 16px 0; background: #0b0907; }
   .section-label { font-size: 10px; font-family: 'DM Mono', monospace; color: var(--text-dim); letter-spacing: 0.12em; text-transform: uppercase; padding: 12px 18px 6px; }
   .nav-item { display: flex; align-items: center; gap: 10px; padding: 10px 18px; cursor: pointer; border-left: 2px solid transparent; color: var(--text-dim); transition: all 0.2s; }
   .nav-item:hover { background: var(--surface); color: var(--text); }
   .nav-item.active { border-left-color: var(--accent); background: var(--surface); color: var(--accent); }
   .method-badge { font-family: 'DM Mono', monospace; font-size: 9px; font-weight: 600; padding: 2px 6px; border-radius: 4px; min-width: 52px; text-align: center; text-transform: uppercase; }
-  .GET { background: #1a3a22; color: #6ba05a; }
-  .POST { background: #1a2e3a; color: #5a86c0; }
-  .PUT, .PATCH { background: #3a2e10; color: #e8a838; }
-  .DELETE { background: #3a1a14; color: #d45c3c; }
+  .GET { background: #1a3a22; color: #6ba05a; } .POST { background: #1a2e3a; color: #5a86c0; } .PUT, .PATCH { background: #3a2e10; color: #e8a838; } .DELETE { background: #3a1a14; color: #d45c3c; }
   .nav-label { font-size: 12px; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  main {
-    overflow-y: auto;
-    padding: 32px;
-    background: #0e0c09;
-  }
+  main { overflow-y: auto; padding: 32px; background: #0e0c09; }
   .endpoint-title { font-family: 'Playfair Display', serif; font-size: 24px; color: var(--accent); margin-bottom: 8px; }
   .endpoint-path { font-family: 'DM Mono', monospace; font-size: 13px; color: var(--text-dim); margin-bottom: 24px; display: flex; align-items: center; gap: 8px; }
   .endpoint-desc { color: var(--text-dim); font-size: 13px; line-height: 1.6; margin-bottom: 24px; border-left: 2px solid var(--border); padding-left: 12px; }
   .form-section { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; margin-bottom: 20px; }
   .form-section-title { font-size: 11px; font-family: 'DM Mono', monospace; color: var(--text-dim); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 16px; border-bottom: 1px solid var(--border); padding-bottom: 6px; }
   .field-row { display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: 16px; margin-bottom: 14px; }
-  .field-row:last-child { margin-bottom: 0; }
   .field-label { font-family: 'DM Mono', monospace; font-size: 12px; color: var(--text-dim); text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  input[type=text], input[type=password], input[type=number], input[type=date], input[type=tel], input[type=url], select {
-    background: var(--surface2); border: 1px solid var(--border); color: var(--text); font-family: 'DM Sans', sans-serif; font-size: 13px; padding: 8px 12px; border-radius: var(--radius); width: 100%; outline: none; transition: border-color 0.2s;
-  }
+  input[type=text], input[type=password], input[type=number], input[type=date], input[type=tel], input[type=url], input[type=email], select { background: var(--surface2); border: 1px solid var(--border); color: var(--text); font-family: 'DM Sans', sans-serif; font-size: 13px; padding: 8px 12px; border-radius: var(--radius); width: 100%; outline: none; transition: border-color 0.2s; }
   input:focus { border-color: var(--accent); }
   .btn-row { margin-top: 24px; display: flex; gap: 12px; }
   .btn { background: var(--accent); color: #0e0c09; border: none; padding: 10px 24px; border-radius: var(--radius); font-size: 13px; font-weight: 500; cursor: pointer; transition: background-color 0.2s; }
-  .btn:hover { background: #f0b850; }
-  .btn-secondary { background: var(--surface2); color: var(--text-dim); border: 1px solid var(--border); }
-  .btn-secondary:hover { color: var(--text); background: var(--surface); }
-  /* FIXED: Response block scroll logic layout rules */
-  .response-panel {
-    border-left: 1px solid var(--border);
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-    background: #110e0a;
-  }
+  .btn:hover { background: #f0b850; } .btn-secondary { background: var(--surface2); color: var(--text-dim); border: 1px solid var(--border); } .btn-secondary:hover { color: var(--text); background: var(--surface); }
+  .response-panel { border-left: 1px solid var(--border); display: flex; flex-direction: column; overflow: hidden; background: #110e0a; }
   .response-header { padding: 16px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; background: var(--surface); height: 50px; }
   .response-header-title { font-size: 11px; font-family: 'DM Mono', monospace; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.05em; }
   .status-badge { font-family: 'DM Mono', monospace; font-size: 12px; margin-left: auto; padding: 2px 8px; border-radius: 4px; font-weight: 500; }
-  .status-ok { background: #1a3a22; color: #6ba05a; }
-  .status-err { background: #3a1a14; color: #d45c3c; }
-  .status-idle { background: var(--surface2); color: var(--text-dim); }
-  /* FIXED: Body panel scrolls y natively, inner token element handles x scrolling */
-  .response-body {
-    flex: 1;
-    overflow-y: auto;
-    overflow-x: hidden;
-    padding: 0;
-    background: #0d0b08;
-  }
-  .response-body.empty {
-    color: var(--text-dim);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 20px;
-    text-align: center;
-    font-size: 13px;
-  }
-  /* FIXED: Token code output container handles micro horizontal data flows elegantly */
-  .json-render-block {
-    display: block;
-    padding: 20px;
-    margin: 0;
-    font-family: 'DM Mono', monospace;
-    font-size: 12px;
-    line-height: 1.5;
-    white-space: pre;
-    overflow-x: auto;
-    word-break: normal;
-    word-wrap: normal;
-  }
-  .json-key { color: #e8a838; }
-  .json-str { color: #9ab878; }
-  .json-num { color: #5a86c0; }
+  .status-ok { background: #1a3a22; color: #6ba05a; } .status-err { background: #3a1a14; color: #d45c3c; } .status-idle { background: var(--surface2); color: var(--text-dim); }
+  .response-body { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 0; background: #0d0b08; }
+  .response-body.empty { color: var(--text-dim); display: flex; align-items: center; justify-content: center; padding: 20px; text-align: center; font-size: 13px; }
+  .json-render-block { display: block; padding: 20px; margin: 0; font-family: 'DM Mono', monospace; font-size: 12px; line-height: 1.5; white-space: pre; overflow-x: auto; word-break: normal; word-wrap: normal; }
+  .json-key { color: #e8a838; } .json-str { color: #9ab878; } .json-num { color: #5a86c0; } .json-bool { color: #c47a1e; } .json-null { color: var(--text-dim); }
   #toast { position: fixed; bottom: 24px; right: 24px; background: var(--surface2); border: 1px solid var(--border); padding: 10px 18px; border-radius: var(--radius); opacity: 0; transition: all .25s; z-index: 1000; font-family: 'DM Mono', monospace; font-size: 12px; color: var(--accent); }
   #toast.show { opacity: 1; }
+  .empty-state { text-align: center; padding: 60px 20px; color: var(--text-dim); }
+  .empty-state .monkey { font-size: 48px; margin-bottom: 16px; }
+  .empty-state h2 { color: var(--text); font-family: 'Playfair Display', serif; margin-bottom: 8px; }
 </style>
 </head>
 <body>
-<div id="endtester-data-vault" data-payload="${safeJsonString}" style="display: none;"></div>
+<div id="__monkey_data__" data-payload="${safeJsonString}" style="display:none;"></div>
 <header>
-  <div class="logo">Endtester <span>Application Runtime Sandbox</span></div>
+  <div class="logo">🐒 Endtester <span>Application Runtime Sandbox</span></div>
   <div class="header-right">
     <div class="base-url-wrap">
       <label>TARGET HOST</label>
@@ -206,200 +98,182 @@ export function getHtmlTemplate(endpoints) {
 <div id="toast"></div>
 <script>
-const rawPayload = document.getElementById('endtester-data-vault').getAttribute('data-payload');
-const ENDPOINTS = JSON.parse(atob(rawPayload));
+  const ENDPOINTS = JSON.parse(atob(document.getElementById('__monkey_data__').getAttribute('data-payload')));
+  let currentKey = null;
-let currentEp = '';
+  document.getElementById('base-url').value = window.location.origin;
-document.getElementById('base-url').value = window.location.origin;
+  function buildSidebar() {
+    const sidebar = document.getElementById('sidebar-nav');
+    const keys = Object.keys(ENDPOINTS);
-function buildSidebar() {
-  const sidebar = document.getElementById('sidebar-nav');
-  const keys = Object.keys(ENDPOINTS);
+    if (keys.length === 0) {
+      sidebar.innerHTML += '<div style="padding:18px;color:var(--text-dim);font-size:12px">No endpoints discovered.</div>';
+      return;
+    }
+    keys.forEach((key, i) => {
+      const ep = ENDPOINTS[key];
+      const item = document.createElement('div');
+      item.className = 'nav-item' + (i === 0 ? ' active' : '');
+      item.setAttribute('data-key', key);
+      item.innerHTML =
+        '<span class="method-badge ' + ep.method + '">' + ep.method + '</span>' +
+        '<span class="nav-label">' + ep.path + '</span>';
+      item.addEventListener('click', () => {
+        document.querySelectorAll('.nav-item').forEach(n => n.classList.remove('active'));
+        item.classList.add('active');
+        clearResponse();
+        renderPanel(key);
+      });
+      sidebar.appendChild(item);
+    });
-  if (keys.length === 0) {
-    sidebar.innerHTML += '<div style="padding:15px; color:var(--text-dim)">No active application endpoints discovered.</div>';
-    return;
+    renderPanel(keys[0]);
   }
-  keys.forEach((key, index) => {
+  function renderPanel(key) {
+    currentKey = key;
     const ep = ENDPOINTS[key];
-    const div = document.createElement('div');
-    div.className = index === 0 ? 'nav-item active' : 'nav-item';
-    div.setAttribute('data-ep', key);
-    div.innerHTML = '<span class="method-badge ' + ep.method + '">' + ep.method + '</span><span class="nav-label">' + ep.path + '</span>';
-    div.addEventListener('click', () => {
-      document.querySelectorAll('.nav-item').forEach(n => n.classList.remove('active'));
-      div.classList.add('active');
-      clearResponse();
-      renderPanel(key);
-    });
-    sidebar.appendChild(div);
-  });
-  if (keys.length > 0) renderPanel(keys[0]);
-}
+    const main = document.getElementById('main-panel');
+    if (!ep) return;
+    let html =
+      '<div class="endpoint-title">' + ep.title + '</div>' +
+      '<div class="endpoint-path"><span class="method-badge ' + ep.method + '">' + ep.method + '</span>' +
+      '<span>' + ep.path + '</span></div>' +
+      '<div class="endpoint-desc">' + ep.desc + '</div>';
+    if (ep.params && ep.params.length) {
+      html += '<div class="form-section"><div class="form-section-title">Path Parameters</div>';
+      ep.params.forEach(function(p) {
+        html +=
+          '<div class="field-row">' +
+          '<label class="field-label">' + p.label + '</label>' +
+          '<input type="text" id="param-' + p.name + '" placeholder="' + p.placeholder + '" />' +
+          '</div>';
+      });
+      html += '</div>';
+    }
-function makeInputString(type, id, placeholder) {
-  const pAttr = placeholder ? ' placeholder="' + placeholder + '"' : '';
-  return '<input type="' + type + '" id="' + id + '"' + pAttr + ' />';
-}
+    if (ep.fields && ep.fields.length) {
+      html += '<div class="form-section"><div class="form-section-title">HTTP JSON Request Payload Parameters</div>';
+      ep.fields.forEach(function(f) {
+        html +=
+          '<div class="field-row">' +
+          '<label class="field-label">' + f.label + '</label>' +
+          '<input type="' + (f.type || 'text') + '" id="field-' + f.name + '" placeholder="' + (f.placeholder || '') + '" />' +
+          '</div>';
+      });
+      html += '</div>';
+    }
-function renderPanel(epKey) {
-  currentEp = epKey;
-  const ep = ENDPOINTS[epKey];
-  const main = document.getElementById('main-panel');
-  if (!ep) return;
-  let html = \`
-    <div class="endpoint-title">\${ep.title}</div>
-    <div class="endpoint-path">
-      <span class="method-badge \${ep.method}">\${ep.method}</span>
-      <span>\${ep.path}</span>
-    </div>
-    <div class="endpoint-desc">\${ep.desc}</div>
-  \`;
-  if (ep.params && ep.params.length) {
-    html += \`<div class="form-section"><div class="form-section-title">Path Parameters</div>\`;
-    ep.params.forEach(function(p) {
-      const inputHtml = makeInputString('text', 'param-' + p.name, p.placeholder);
-      html += \`
-        <div class="field-row">
-          <label class="field-label">\${p.label}</label>
-          \${inputHtml}
-        </div>
-      \`;
-    });
-    html += \`</div>\`;
-  }
+    html +=
+      '<div class="btn-row">' +
+      '<button class="btn" onclick="sendRequest()">Execute Route</button>' +
+      '<button class="btn btn-secondary" onclick="clearResponse()">Clear Context</button>' +
+      '</div>';
-  if (ep.fields && ep.fields.length) {
-    html += \`<div class="form-section"><div class="form-section-title">HTTP JSON Request Payload Parameters</div>\`;
-    ep.fields.forEach(function(f) {
-      const inputHtml = makeInputString(f.type || 'text', 'field-' + f.name, f.placeholder || '');
-      html += \`
-        <div class="field-row">
-          <label class="field-label">\${f.label}</label>
-          \${inputHtml}
-        </div>
-      \`;
-    });
-    html += \`</div>\`;
+    main.innerHTML = html;
   }
-  html += \`
-    <div class="btn-row">
-      <button class="btn" onclick="sendRequest()">Execute Route</button>
-      <button class="btn btn-secondary" onclick="clearResponse()">Clear Context</button>
-    </div>
-  \`;
+  async function sendRequest() {
+    const ep = ENDPOINTS[currentKey];
+    let path = ep.path;
-  main.innerHTML = html;
-}
+    if (ep.params && ep.params.length) {
+      for (const p of ep.params) {
+        const val = (document.getElementById('param-' + p.name) || {}).value || '';
+        if (!val.trim()) { showToast('⚠ Path param "' + p.label + '" is required'); return; }
+        path = path.replace(':' + p.name, encodeURIComponent(val.trim()));
+      }
+    }
-async function sendRequest() {
-  const ep = ENDPOINTS[currentEp];
-  let path = ep.path;
+    const baseUrl = document.getElementById('base-url').value.replace(/\/+$/, '');
+    const url = baseUrl + path;
+    const headers = { 'Content-Type': 'application/json' };
+    const jwt = document.getElementById('jwt-input').value.trim();
+    if (jwt) headers['Authorization'] = 'Bearer ' + jwt;
+    let body = undefined;
+    if (['POST', 'PUT', 'PATCH'].includes(ep.method) && ep.fields && ep.fields.length) {
+      const payload = {};
+      ep.fields.forEach(function(f) {
+        const el = document.getElementById('field-' + f.name);
+        if (!el) return;
+        let v = el.value.trim();
+        if (f.type === 'number' && v !== '') v = Number(v);
+        payload[f.name] = v;
+      });
+      body = JSON.stringify(payload);
+    }
-  if (ep.params) {
-    for (const p of ep.params) {
-      const val = document.getElementById('param-' + p.name)?.value.trim();
-      if (!val) { showToast('Warning: Parameter ' + p.label + ' is required'); return; }
-      path = path.replace(':' + p.name, encodeURIComponent(val));
+    setResponse(null, 'loading');
+    const t0 = Date.now();
+    try {
+      const res = await fetch(url, { method: ep.method, headers, body });
+      const ms = Date.now() - t0;
+      const text = await res.text();
+      let data;
+      try { data = JSON.parse(text); } catch { data = text; }
+      setResponse(data, res.ok ? 'ok' : 'err', res.status, ms);
+    } catch (err) {
+      setResponse({ error: err.message }, 'err', 'FAIL', 0);
     }
   }
-  const baseUrl = document.getElementById('base-url').value.replace(/[/]+$/, '');
-  const url = baseUrl + path;
-  const headers = { 'Content-Type': 'application/json' };
-  const jwt = document.getElementById('jwt-input').value.trim();
-  if (jwt) headers['Authorization'] = 'Bearer ' + jwt;
-  let body = undefined;
-  if (ep.fields && ep.fields.length && ['POST', 'PUT', 'PATCH'].includes(ep.method)) {
-    const jsonPayload = {};
-    for (const f of ep.fields) {
-      const targetEl = document.getElementById('field-' + f.name);
-      if (targetEl) {
-        let entryVal = targetEl.value.trim();
-        if (f.type === 'number' && entryVal !== '') {
-          entryVal = Number(entryVal);
-        }
-        jsonPayload[f.name] = entryVal;
-      }
+  function setResponse(data, state, status, ms) {
+    const badge = document.getElementById('status-badge');
+    const body  = document.getElementById('response-body');
+    if (state === 'loading') {
+      badge.className = 'status-badge status-idle';
+      badge.textContent = '…';
+      body.className = 'response-body empty';
+      body.textContent = 'Executing transmission…';
+      return;
     }
-    body = JSON.stringify(jsonPayload);
-  }
-  setResponse(null, 'loading');
-  const start = Date.now();
-  try {
-    const res = await fetch(url, { method: ep.method, headers, body });
-    const ms = Date.now() - start;
-    const text = await res.text();
-    let json;
-    try { json = JSON.parse(text); } catch { json = text; }
-    setResponse(json, res.ok ? 'ok' : 'err', res.status, ms);
-  } catch (err) {
-    setResponse({ error: err.message }, 'err', 'FAIL', 0);
+    badge.className = 'status-badge ' + (state === 'ok' ? 'status-ok' : 'status-err');
+    badge.textContent = status + ' · ' + ms + 'ms';
+    body.className = 'response-body';
+    const str = typeof data === 'string' ? data : JSON.stringify(data, null, 2);
+    body.innerHTML = '<pre class="json-render-block">' + highlight(str) + '</pre>';
   }
-}
-function setResponse(data, state, status, ms) {
-  const badge = document.getElementById('status-badge');
-  const body  = document.getElementById('response-body');
-  if (state === 'loading') {
-    badge.className = 'status-badge status-idle';
-    badge.textContent = '...';
+  function clearResponse() {
+    document.getElementById('status-badge').className = 'status-badge status-idle';
+    document.getElementById('status-badge').textContent = '—';
+    const body = document.getElementById('response-body');
     body.className = 'response-body empty';
-    body.innerHTML = 'Executing transmission...';
-    return;
+    body.textContent = 'Execute a request row to generate feedback data';
   }
-  badge.className = 'status-badge ' + (state === 'ok' ? 'status-ok' : 'status-err');
-  badge.textContent = status + ' · ' + ms + 'ms';
-  body.className = 'response-body';
-  // FIXED: Nested rendering inside dedicated horizontal scrolling code tag block wrapper elements
-  const outputString = typeof data === 'string' ? data : JSON.stringify(data, null, 2);
-  body.innerHTML = '<pre class="json-render-block">' + highlightJson(outputString) + '</pre>';
-}
-function clearResponse() {
-  const badge = document.getElementById('status-badge');
-  const body  = document.getElementById('response-body');
-  badge.className = 'status-badge status-idle';
-  badge.textContent = '—';
-  body.className = 'response-body empty';
-  body.textContent = 'Execute a request row to generate feedback data';
-}
-function highlightJson(str) {
-  return str
-    .replace(/&/g, '&amp;').replace(/[<]/g, '&lt;').replace(/[>]/g, '&gt;')
-    .replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function(match) {
-      if (/^"/.test(match)) {
-        if (/:$/.test(match)) return '<span class="json-key">' + match + '</span>';
-        return '<span class="json-str">' + match + '</span>';
-      }
-      return '<span class="json-num">' + match + '</span>';
-    });
-}
+  function highlight(str) {
+    return str
+      .replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;')
+      .replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false)\b|\bnull\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function(m) {
+        if (/^"/.test(m)) return /:$/.test(m)
+          ? '<span class="json-key">' + m + '</span>'
+          : '<span class="json-str">' + m + '</span>';
+        if (/true|false/.test(m)) return '<span class="json-bool">' + m + '</span>';
+        if (/null/.test(m))       return '<span class="json-null">' + m + '</span>';
+        return '<span class="json-num">' + m + '</span>';
+      });
+  }
-function showToast(msg) {
-  const t = document.getElementById('toast');
-  t.textContent = msg;
-  t.classList.add('show');
-  setTimeout(() => t.classList.remove('show'), 2500);
-}
+  function showToast(msg) {
+    const t = document.getElementById('toast');
+    t.textContent = msg;
+    t.classList.add('show');
+    setTimeout(() => t.classList.remove('show'), 2500);
+  }
-buildSidebar();
+  buildSidebar();
 </script>
 </body>
-</html>
-`;
+</html>`;
 }
+module.exports = { getHtmlTemplate };

package/monkey.backup.js ADDED Viewed

@@ -0,0 +1,213 @@
+'use strict';
+import { getHtmlTemplate } from './htmlTemplate.js';
+// ─── Field type inference ─────────────────────────────────────────────────────
+function inferType(name) {
+  const n = name.toLowerCase();
+  if (n.includes('email'))                                          return 'email';
+  if (n.includes('password') || n.includes('pass'))                return 'password';
+  if (n.includes('date') || n.includes('birth'))                   return 'date';
+  if (n.includes('phone') || n.includes('tel'))                    return 'tel';
+  if (n.includes('url') || n.includes('website') || n.includes('link')) return 'url';
+  if (
+    n.includes('age')   || n.includes('price')  || n.includes('amount') ||
+    n.includes('count') || n.includes('qty')    || n.includes('quantity') ||
+    n.includes('stock') || n.includes('salary') || n.includes('total')   ||
+    (n === 'id')        || n.endsWith('_id')    || n.endsWith('Id')
+  )                                                                 return 'number';
+  return 'text';
+}
+function buildField(name) {
+  return {
+    name,
+    label: name.charAt(0).toUpperCase() + name.slice(1).replace(/([A-Z])/g, ' $1'),
+    type: inferType(name),
+    placeholder: `Enter ${name}`
+  };
+}
+// ─── Extract req.body fields from handler source ──────────────────────────────
+function extractBodyFields(handler) {
+  try {
+    const source = handler.toString();
+    if (!source || source.includes('[native code]')) return [];
+    const seen = new Map();
+    // Pattern 1 — destructuring: const { email, password } = req.body
+    const destructRe = /(?:const|let|var)\s*\{\s*([^}]+)\s*\}\s*=\s*req\.body/g;
+    let m;
+    while ((m = destructRe.exec(source)) !== null) {
+      m[1].split(',').forEach(part => {
+        const name = part.split(':')[0].split('=')[0].trim();
+        if (name && /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(name) && !seen.has(name)) {
+          seen.set(name, buildField(name));
+        }
+      });
+    }
+    // Pattern 2 — property access: req.body.email  /  req.body['email']
+    const accessRe = /req\.body\.([a-zA-Z_$][a-zA-Z0-9_$]*)|req\.body\[['"]([a-zA-Z_$][a-zA-Z0-9_$]*)['"]]/g;
+    while ((m = accessRe.exec(source)) !== null) {
+      const name = m[1] || m[2];
+      if (name && !seen.has(name)) seen.set(name, buildField(name));
+    }
+    return Array.from(seen.values());
+  } catch {
+    return [];
+  }
+}
+// ─── Path-based fallback fields ───────────────────────────────────────────────
+function fallbackFields(path) {
+  const p = path.toLowerCase();
+  if (p.includes('login') || p.includes('signin') || p.includes('auth/login')) {
+    return ['email', 'password'].map(buildField);
+  }
+  if (p.includes('register') || p.includes('signup') || p.includes('auth/register')) {
+    return ['username', 'email', 'password'].map(buildField);
+  }
+  if (p.includes('user')) {
+    return ['username', 'email', 'password'].map(buildField);
+  }
+  if (p.includes('product')) {
+    return ['name', 'price', 'stock'].map(buildField);
+  }
+  if (p.includes('order')) {
+    return ['productId', 'quantity', 'address'].map(buildField);
+  }
+  return [];
+}
+// ─── Extract router prefix safely from Express layer ─────────────────────────
+function extractRouterPrefix(layer) {
+  // Prefer explicit path if available
+  if (layer.path && typeof layer.path === 'string') {
+    return layer.path === '/' ? '' : layer.path;
+  }
+  if (!layer.regexp) return '';
+  // Convert the regexp back to a path prefix by looking at the regexp source
+  // Express generates regexps like: /^\/api\/v1\/?(?=\/|$)/i
+  const src = layer.regexp.source;
+  // Extract the literal path segment before any optional/lookahead parts
+  // Match from start: ^\/ then literal segments
+  const match = src.match(/^\^((?:\\\/[^\\(?[*+{}|$^]+)+)/);
+  if (!match) return '';
+  // Unescape the extracted path
+  const raw = match[1].replace(/\\\//g, '/');
+  // Remove trailing slash if present
+  return raw.replace(/\/$/, '') || '';
+}
+// ─── Walk the Express router stack recursively ────────────────────────────────
+function parseStack(stack, detectedEndpoints, prefix = '') {
+  if (!Array.isArray(stack)) return;
+  for (const layer of stack) {
+    // ── Named route (app.get / app.post …) ──────────────────────────────────
+    if (layer.route) {
+      const rawPath = typeof layer.route.path === 'string'
+        ? layer.route.path
+        : (layer.route.path ? String(layer.route.path) : '');
+      const fullPath = (prefix + rawPath).replace(/\/+/g, '/') || '/';
+      // Skip the tester route itself
+      if (fullPath.startsWith('/api/tester')) continue;
+      const methods = Object.keys(layer.route.methods || {});
+      for (const method of methods) {
+        const httpMethod = method.toUpperCase();
+        const key = `${httpMethod}::${fullPath}`;
+        // ── Path params (:id, :slug …) ────────────────────────────────────
+        const pathParams = [];
+        const paramRe = /:([a-zA-Z_$][a-zA-Z0-9_$]*)/g;
+        const matches = [...fullPath.matchAll(paramRe)];
+        for (const pm of matches) {
+          pathParams.push({
+            name: pm[1],
+            label: pm[1].charAt(0).toUpperCase() + pm[1].slice(1),
+            placeholder: 'value'
+          });
+        }
+        // ── Body fields ──────────────────────────────────────────────────
+        let bodyFields = [];
+        if (['POST', 'PUT', 'PATCH'].includes(httpMethod)) {
+          const handlers = (layer.route.stack || []).map(sl => sl.handle).filter(Boolean);
+          for (const handler of handlers) {
+            bodyFields.push(...extractBodyFields(handler));
+          }
+          // Deduplicate
+          const seen = new Map();
+          bodyFields = bodyFields.filter(f => {
+            if (seen.has(f.name)) return false;
+            seen.set(f.name, true);
+            return true;
+          });
+          if (bodyFields.length === 0) {
+            bodyFields = fallbackFields(fullPath);
+          }
+        }
+        detectedEndpoints[key] = {
+          method:  httpMethod,
+          path:    fullPath,
+          title:   `${httpMethod} ${fullPath}`,
+          desc:    `Auto-discovered endpoint — ${fullPath}`,
+          params:  pathParams,
+          fields:  bodyFields,
+        };
+      }
+    }
+    // ── Nested router (app.use('/prefix', router)) ───────────────────────────
+    else if (layer.handle && typeof layer.handle === 'function' && layer.handle.stack) {
+      const routerPrefix = extractRouterPrefix(layer);
+      parseStack(layer.handle.stack, detectedEndpoints, prefix + routerPrefix);
+    }
+  }
+}
+// ─── Middleware ───────────────────────────────────────────────────────────────
+function endtesterExpress() {
+  return function monkeyTesterMiddleware(req, res, next) {
+    // Normalize path: strip trailing slash, handle both req.path and req.url
+    const rawPath = (req.path || req.url || '').split('?')[0].replace(/\/+$/, '');
+    if (rawPath !== '/api/tester') {
+      return next();
+    }
+    const app = req.app;
+    // Wait a tick to ensure all routes are registered before scanning
+    // (handles edge cases where middleware is mounted before some routes)
+    const detectedEndpoints = {};
+    const rootStack =
+      (app._router && app._router.stack) ||   // Express 4
+      (app.router  && app.router.stack)  ||   // Express 5
+      [];
+    parseStack(rootStack, detectedEndpoints);
+    const html = getHtmlTemplate(detectedEndpoints);
+    res.setHeader('Content-Type', 'text/html; charset=utf-8');
+    return res.send(html);
+  };
+}
+export { endtesterExpress };

package/monkey.js CHANGED Viewed

@@ -1,8 +1,7 @@
 'use strict';
-import { getHtmlTemplate } from './htmlTemplate.js';
+const { getHtmlTemplate } = require('./htmlTemplate');
-// ─── Field type inference ─────────────────────────────────────────────────────
 function inferType(name) {
   const n = name.toLowerCase();
   if (n.includes('email'))                                          return 'email';
@@ -28,15 +27,12 @@ function buildField(name) {
   };
 }
-// ─── Extract req.body fields from handler source ──────────────────────────────
 function extractBodyFields(handler) {
   try {
     const source = handler.toString();
     if (!source || source.includes('[native code]')) return [];
     const seen = new Map();
-    // Pattern 1 — destructuring: const { email, password } = req.body
     const destructRe = /(?:const|let|var)\s*\{\s*([^}]+)\s*\}\s*=\s*req\.body/g;
     let m;
     while ((m = destructRe.exec(source)) !== null) {
@@ -48,7 +44,6 @@ function extractBodyFields(handler) {
       });
     }
-    // Pattern 2 — property access: req.body.email  /  req.body['email']
     const accessRe = /req\.body\.([a-zA-Z_$][a-zA-Z0-9_$]*)|req\.body\[['"]([a-zA-Z_$][a-zA-Z0-9_$]*)['"]]/g;
     while ((m = accessRe.exec(source)) !== null) {
       const name = m[1] || m[2];
@@ -61,67 +56,35 @@ function extractBodyFields(handler) {
   }
 }
-// ─── Path-based fallback fields ───────────────────────────────────────────────
 function fallbackFields(path) {
   const p = path.toLowerCase();
-  if (p.includes('login') || p.includes('signin') || p.includes('auth/login')) {
-    return ['email', 'password'].map(buildField);
-  }
-  if (p.includes('register') || p.includes('signup') || p.includes('auth/register')) {
-    return ['username', 'email', 'password'].map(buildField);
-  }
-  if (p.includes('user')) {
-    return ['username', 'email', 'password'].map(buildField);
-  }
-  if (p.includes('product')) {
-    return ['name', 'price', 'stock'].map(buildField);
-  }
-  if (p.includes('order')) {
-    return ['productId', 'quantity', 'address'].map(buildField);
-  }
+  if (p.includes('login') || p.includes('signin') || p.includes('auth/login')) return ['email', 'password'].map(buildField);
+  if (p.includes('register') || p.includes('signup') || p.includes('auth/register')) return ['username', 'email', 'password'].map(buildField);
+  if (p.includes('user')) return ['username', 'email', 'password'].map(buildField);
+  if (p.includes('product')) return ['name', 'price', 'stock'].map(buildField);
+  if (p.includes('order')) return ['productId', 'quantity', 'address'].map(buildField);
   return [];
 }
-// ─── Extract router prefix safely from Express layer ─────────────────────────
 function extractRouterPrefix(layer) {
-  // Prefer explicit path if available
-  if (layer.path && typeof layer.path === 'string') {
-    return layer.path === '/' ? '' : layer.path;
-  }
   if (!layer.regexp) return '';
-  // Convert the regexp back to a path prefix by looking at the regexp source
-  // Express generates regexps like: /^\/api\/v1\/?(?=\/|$)/i
   const src = layer.regexp.source;
-  // Extract the literal path segment before any optional/lookahead parts
-  // Match from start: ^\/ then literal segments
-  const match = src.match(/^\^((?:\\\/[^\\(?[*+{}|$^]+)+)/);
-  if (!match) return '';
-  // Unescape the extracted path
-  const raw = match[1].replace(/\\\//g, '/');
-  // Remove trailing slash if present
-  return raw.replace(/\/$/, '') || '';
+  const patterns = [/^\^\\\/([^\\?$]+)/, /^\^\\\/([a-zA-Z0-9_/-]+)/];
+  for (const re of patterns) {
+    const m = re.exec(src);
+    if (m && m[1]) return '/' + m[1].replace(/\\\//g, '/').replace(/\\/g, '');
+  }
+  return '';
 }
-// ─── Walk the Express router stack recursively ────────────────────────────────
 function parseStack(stack, detectedEndpoints, prefix = '') {
   if (!Array.isArray(stack)) return;
   for (const layer of stack) {
-    // ── Named route (app.get / app.post …) ──────────────────────────────────
     if (layer.route) {
-      const rawPath = typeof layer.route.path === 'string'
-        ? layer.route.path
-        : (layer.route.path ? String(layer.route.path) : '');
+      const rawPath = typeof layer.route.path === 'string' ? layer.route.path : (layer.route.path ? String(layer.route.path) : '');
       const fullPath = (prefix + rawPath).replace(/\/+/g, '/') || '/';
-      // Skip the tester route itself
       if (fullPath.startsWith('/api/tester')) continue;
       const methods = Object.keys(layer.route.methods || {});
@@ -130,27 +93,19 @@ function parseStack(stack, detectedEndpoints, prefix = '') {
         const httpMethod = method.toUpperCase();
         const key = `${httpMethod}::${fullPath}`;
-        // ── Path params (:id, :slug …) ────────────────────────────────────
         const pathParams = [];
         const paramRe = /:([a-zA-Z_$][a-zA-Z0-9_$]*)/g;
-        const matches = [...fullPath.matchAll(paramRe)];
-        for (const pm of matches) {
-          pathParams.push({
-            name: pm[1],
-            label: pm[1].charAt(0).toUpperCase() + pm[1].slice(1),
-            placeholder: 'value'
-          });
+        let pm;
+        while ((pm = paramRe.exec(fullPath)) !== null) {
+          pathParams.push({ name: pm[1], label: pm[1].charAt(0).toUpperCase() + pm[1].slice(1), placeholder: 'value' });
         }
-        // ── Body fields ──────────────────────────────────────────────────
         let bodyFields = [];
         if (['POST', 'PUT', 'PATCH'].includes(httpMethod)) {
           const handlers = (layer.route.stack || []).map(sl => sl.handle).filter(Boolean);
           for (const handler of handlers) {
             bodyFields.push(...extractBodyFields(handler));
           }
-          // Deduplicate
           const seen = new Map();
           bodyFields = bodyFields.filter(f => {
             if (seen.has(f.name)) return false;
@@ -163,51 +118,37 @@ function parseStack(stack, detectedEndpoints, prefix = '') {
         }
         detectedEndpoints[key] = {
-          method:  httpMethod,
-          path:    fullPath,
-          title:   `${httpMethod} ${fullPath}`,
-          desc:    `Auto-discovered endpoint — ${fullPath}`,
-          params:  pathParams,
-          fields:  bodyFields,
+          method: httpMethod,
+          path: fullPath,
+          title: `${httpMethod} ${fullPath}`,
+          desc: `Auto-discovered endpoint - ${fullPath}`, // Safe ASCII character
+          params: pathParams,
+          fields: bodyFields,
         };
       }
-    }
-    // ── Nested router (app.use('/prefix', router)) ───────────────────────────
-    else if (layer.handle && typeof layer.handle === 'function' && layer.handle.stack) {
+    } else if (layer.name === 'router' && layer.handle && layer.handle.stack) {
       const routerPrefix = extractRouterPrefix(layer);
       parseStack(layer.handle.stack, detectedEndpoints, prefix + routerPrefix);
     }
   }
 }
-// ─── Middleware ───────────────────────────────────────────────────────────────
 function endtesterExpress() {
   return function monkeyTesterMiddleware(req, res, next) {
-    // Normalize path: strip trailing slash, handle both req.path and req.url
-    const rawPath = (req.path || req.url || '').split('?')[0].replace(/\/+$/, '');
-    if (rawPath !== '/api/tester') {
+    if (req.path !== '/api/tester' && req.path !== '/api/tester/') {
       return next();
     }
     const app = req.app;
-    // Wait a tick to ensure all routes are registered before scanning
-    // (handles edge cases where middleware is mounted before some routes)
     const detectedEndpoints = {};
-    const rootStack =
-      (app._router && app._router.stack) ||   // Express 4
-      (app.router  && app.router.stack)  ||   // Express 5
-      [];
+    const rootStack = (app._router && app._router.stack) || (app.router && app.router.stack) || [];
     parseStack(rootStack, detectedEndpoints);
     const html = getHtmlTemplate(detectedEndpoints);
-    res.setHeader('Content-Type', 'text/html; charset=utf-8');
+    res.setHeader('Content-Type', 'text/html; charset=utf-8'); // Forces browser to parse UTF-8 encoding safely
     return res.send(html);
   };
 }
-export { endtesterExpress };
+module.exports = { endtesterExpress };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@aimeloic/monkey-tester",
-  "version": "3.0.8",
+  "version": "3.0.10",
   "description": "Auto route scanning visual runner dashboard.",
   "main": "index.js",
   "type": "module",