@aimeloic/monkey-tester 1.0.9 → 2.0.0

package/htmlTemplate.js

@@ -1,5 +1,4 @@
 export function getHtmlTemplate(endpoints) {
-  // Safe stringification for HTML attribute encoding to prevent script engine parsing breaks
   const safeJsonString = Buffer.from(JSON.stringify(endpoints)).toString('base64');
 
   return `
@@ -65,7 +64,8 @@ export function getHtmlTemplate(endpoints) {
   .field-label { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--text-dim); text-align: right; }
   input[type=text], input[type=number], select { background: var(--surface2); border: 1px solid var(--border); color: var(--text); font-family: 'DM Mono', monospace; font-size: 12px; padding: 7px 10px; border-radius: var(--radius); width: 100%; outline: none; }
   .btn { background: var(--accent); color: #0e0c09; border: none; padding: 10px 22px; border-radius: var(--radius); font-size: 13px; font-weight: 500; cursor: pointer; }
-  .btn-secondary { background: var(--surface2); color: var(--text-dim); border: 1px solid var(--border); margin-left: 8px; }
+  .btn-row { margin-top: 20px; display: flex; gap: 10px; }
+  .btn-secondary { background: var(--surface2); color: var(--text-dim); border: 1px solid var(--border); }
   .response-panel { border-left: 1px solid var(--border); display: flex; flex-direction: column; overflow: hidden; }
   .response-header { padding: 14px 18px; border-bottom: 1px solid var(--border); display: flex; align-items: center; background: var(--surface); }
   .response-header-title { font-size: 11px; font-family: 'DM Mono', monospace; color: var(--text-dim); text-transform: uppercase; }
@@ -151,7 +151,7 @@ function buildSidebar() {
 
 function makeInputString(type, id, placeholder, defaultValue) {
   const pAttr = placeholder ? ' placeholder="' + placeholder + '"' : '';
-  const vAttr = defaultValue !== undefined ? ' value=\'' + defaultValue + '\'' : '';
+  const vAttr = defaultValue !== undefined ? ' value="' + defaultValue + '"' : '';
   return '<input type="' + type + '" id="' + id + '"' + pAttr + vAttr + ' />';
 }
 
@@ -161,7 +161,6 @@ function renderPanel(epKey) {
   const main = document.getElementById('main-panel');
   if (!ep) return;
 
-  // FIXED: Escaped template strings (\`) prevent string concatenation mismatch errors
   let html = \`
     <div class="endpoint-title">\${ep.title}</div>
     <div class="endpoint-path">
@@ -171,6 +170,7 @@ function renderPanel(epKey) {
     <div class="endpoint-desc">\${ep.desc}</div>
   \`;
 
+  // Path Parameters
   if (ep.params && ep.params.length) {
     html += \`<div class="form-section"><div class="form-section-title">Path Parameters</div>\`;
     ep.params.forEach(function(p) {
@@ -185,13 +185,14 @@ function renderPanel(epKey) {
     html += \`</div>\`;
   }
 
+  // FIXED: Renders native, individual form fields instead of a single text payload editor block
   if (ep.fields && ep.fields.length) {
-    html += \`<div class="form-section"><div class="form-section-title">JSON Request Body Raw Payload</div>\`;
+    html += \`<div class="form-section"><div class="form-section-title">HTTP JSON Request Payload Parameters</div>\`;
     ep.fields.forEach(function(f) {
-      const inputHtml = makeInputString('text', 'field-' + f.name, '', '{"key": "value"}');
+      const inputHtml = makeInputString(f.type || 'text', 'field-' + f.name, f.placeholder || '', '');
       html += \`
         <div class="field-row">
-          <label class="field-label">\${f.label}</label>
+          <label class="field-label">\--\${f.label}</label>
           \${inputHtml}
         </div>
       \`;
@@ -213,6 +214,7 @@ async function sendRequest() {
   const ep = ENDPOINTS[currentEp];
   let path = ep.path;
 
+  // Compile URL path parameter tags
   if (ep.params) {
     for (const p of ep.params) {
       const val = document.getElementById('param-' + p.name)?.value.trim();
@@ -228,16 +230,23 @@ async function sendRequest() {
   const jwt = document.getElementById('jwt-input').value.trim();
   if (jwt) headers['Authorization'] = 'Bearer ' + jwt;
 
+  // FIXED: Dynamically bundles inputs into a background payload object structure seamlessly
   let body = undefined;
   if (ep.fields && ep.fields.length && ['POST', 'PUT', 'PATCH'].includes(ep.method)) {
-    const rawVal = document.getElementById('field-' + ep.fields[0].name).value.trim();
-    try {
-      JSON.parse(rawVal);
-      body = rawVal;
-    } catch(e) {
-      showToast('Malformed JSON body structure provided.');
-      return;
+    const payloadObject = {};
+    
+    for (const f of ep.fields) {
+      const inputEl = document.getElementById('field-' + f.name);
+      if (inputEl) {
+        let value = inputEl.value.trim();
+        // Cast numerical parameters to prevent type validation parsing failures
+        if (f.type === 'number' && value !== '') {
+          value = Number(value);
+        }
+        payloadObject[f.name] = value;
+      }
     }
+    body = JSON.stringify(payloadObject);
   }
 
   setResponse(null, 'loading');

package/index.js

@@ -29,14 +29,35 @@ export function endtesterExpress() {
               placeholder: 'value'
             })) : [];
 
+            // Context-aware field mapping for common endpoints
+            let bodyFields = [];
+            if (['POST', 'PUT', 'PATCH'].includes(httpMethod)) {
+              if (path.toLowerCase().includes('login') || path.toLowerCase().includes('auth')) {
+                bodyFields = [
+                  { name: 'email', label: 'Email Address', type: 'text', placeholder: 'user@example.com' },
+                  { name: 'password', label: 'Password', type: 'text', placeholder: '••••••••' }
+                ];
+              } else if (path.toLowerCase().includes('product')) {
+                bodyFields = [
+                  { name: 'name', label: 'Product Name', type: 'text', placeholder: 'Sourdough Loaf' },
+                  { name: 'price', label: 'Unit Price', type: 'number', placeholder: '5.50' },
+                  { name: 'stock', label: 'Initial Inventory', type: 'number', placeholder: '10' }
+                ];
+              } else {
+                // Fallback default structure
+                bodyFields = [
+                  { name: 'key', label: 'Property Key', type: 'text', placeholder: 'value' }
+                ];
+              }
+            }
+
             detectedEndpoints[key] = {
               method: httpMethod,
               path: path,
-              auth: false,
               title: `${httpMethod} ${path}`,
               desc: `Auto-discovered endpoint: ${path}`,
               params: pathParams,
-              fields: ['POST', 'PUT', 'PATCH'].includes(httpMethod) ? [{ name: 'payload', label: 'JSON Body', type: 'text' }] : []
+              fields: bodyFields
             };
           });
         } else if (layer.name === 'router' && layer.handle && layer.handle.stack) {

package/package.json

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