adaptar-vite-plugin 1.0.2 → 1.0.4

package/dist/hmr-interceptor.js

@@ -46,6 +46,18 @@ export function interceptHmrErrors(server) {
                 suppressReloadUntil = 0; // reset — only suppress once
                 return;
             }
+            // A Vite update has been compiled and sent to the preview client. The
+            // injected bridge associates this with the server-owned preview operation
+            // ID carried in the iframe URL.
+            if (payload.type === "update") {
+                originalSend(payload);
+                originalSend({
+                    type: "custom",
+                    event: "adaptar:compile-success",
+                    data: { compiledAt: Date.now() },
+                });
+                return;
+            }
         }
         originalSend(payload);
     };

package/dist/html-tags.js

@@ -4,14 +4,29 @@ import { SELECTION_BRIDGE_SCRIPT } from "./scripts/selection-bridge.js";
  * The inline module that subscribes to the `adaptar:error` custom HMR event
  * and forwards it to the parent window via postMessage.
  */
-const HMR_LISTENER_SCRIPT = /* js */ `
-  if (import.meta.hot) {
-    import.meta.hot.on('adaptar:error', (data) => {
-      try {
-        window.parent.postMessage({ source: 'adaptar-preview', type: 'error', error: data }, '*');
-      } catch (_) {}
-    });
-  }
+const HMR_LISTENER_SCRIPT = /* js */ `
+  const adaptarOperationId = new URL(window.location.href).searchParams.get('__adaptarOperation') || undefined;
+  const postToHost = (type, data) => {
+    try {
+      window.parent.postMessage({
+        source: 'adaptar-preview',
+        type,
+        operationId: adaptarOperationId,
+        ...data,
+      }, '*');
+    } catch (_) {}
+  };
+
+  if (import.meta.hot) {
+    import.meta.hot.on('adaptar:error', (data) => {
+      postToHost('error', { error: data });
+    });
+    import.meta.hot.on('adaptar:compile-success', (data) => {
+      postToHost('compile-success', data || {});
+    });
+  }
+
+  postToHost('compile-success', { compiledAt: Date.now(), initial: true });
 `.trim();
 export function buildHtmlTags() {
     return [

package/dist/index.d.ts

@@ -1,4 +1,3 @@
-import type { Plugin } from "vite";
 /**
  * Adaptar Vite Plugin
  *
@@ -11,4 +10,4 @@ import type { Plugin } from "vite";
  * 3. `hmr-interceptor`  — intercepts Vite's internal WebSocket to surface
  *                          build/HMR errors as structured `adaptar:error` events.
  */
-export declare function adaptar(): Plugin;
+export declare function adaptar(): any;

package/dist/scripts/error-bridge.d.ts

@@ -1 +1 @@
-export declare const ERROR_BRIDGE_SCRIPT = "(function(){\n  if (window.__ADAPTAR_ERROR_BRIDGE__) return;\n  window.__ADAPTAR_ERROR_BRIDGE__ = true;\n\n  function send(message, stack, filename, lineno, colno, source, plugin) {\n    try {\n      window.parent.postMessage({\n        source: 'adaptar-preview',\n        type: 'error',\n        error: {\n          message: message || 'Unknown error',\n          stack: stack || '',\n          filename: filename,\n          lineno: lineno,\n          colno: colno,\n          source: source,\n          plugin: plugin\n        }\n      }, '*');\n    } catch (_) {}\n  }\n\n  // Resource load errors (scripts, stylesheets)\n  window.addEventListener('error', function(e) {\n    var target = e.target || e.srcElement;\n    if (target && target !== window && target.tagName) {\n      var tag = String(target.tagName).toLowerCase();\n      var url = target.src || target.href;\n      if (url && (tag === 'script' || tag === 'link')) {\n        send(\n          (tag === 'link' ? 'Failed to load stylesheet: ' : 'Failed to load module: ') + url,\n          '', url, undefined, undefined, 'resource-load'\n        );\n        return;\n      }\n    }\n    send(\n      e.message || (e.error && e.error.message) || 'Runtime error occurred',\n      e.error ? e.error.stack : '',\n      e.filename, e.lineno, e.colno, 'runtime'\n    );\n  });\n\n  // Unhandled promise rejections\n  window.addEventListener('unhandledrejection', function(e) {\n    var r = e.reason;\n    send(\n      r && r.message ? r.message : String(r || 'Unhandled Promise Rejection'),\n      r && r.stack,\n      r && r.fileName,\n      r && r.lineNumber,\n      r && r.columnNumber,\n      'unhandledrejection'\n    );\n  });\n\n  // Console error interception for silent Vite/Syntax errors\n  var nativeConsoleError = console.error;\n  console.error = function() {\n    var args = Array.prototype.slice.call(arguments);\n    var msg = args.map(function(a) {\n      return typeof a === 'string' ? a : (a && a.message ? a.message : String(a));\n    }).join(' ');\n    if (/Failed to load module|Internal Server Error|Syntax Error/i.test(msg)) {\n      send(msg, '', undefined, undefined, undefined, 'console.error');\n    }\n    return nativeConsoleError.apply(console, args);\n  };\n\n  // Blank screen detector\n  window.addEventListener('load', function() {\n    setTimeout(function() {\n      var root = document.getElementById('root');\n      if (root && root.children.length === 0 && !(root.textContent || '').trim()) {\n        send(\n          'Runtime error: Preview failed to render; a component or import may have failed silently.',\n          '', location.href, undefined, undefined, 'blank-screen'\n        );\n      }\n    }, 3000);\n  });\n})();";
+export declare const ERROR_BRIDGE_SCRIPT = "(function(){\n  if (window.__ADAPTAR_ERROR_BRIDGE__) return;\n  window.__ADAPTAR_ERROR_BRIDGE__ = true;\n\n  var operationId = new URL(window.location.href).searchParams.get('__adaptarOperation') || undefined;\n\n  function sendRendered(heartbeat) {\n    try {\n      var root = document.getElementById('root');\n      window.parent.postMessage({\n        source: 'adaptar-preview',\n        type: heartbeat ? 'render-heartbeat' : 'preview-rendered',\n        operationId: operationId,\n        renderedAt: Date.now(),\n        hasRootContent: Boolean(root && (root.children.length || (root.textContent || '').trim()))\n      }, '*');\n    } catch (_) {}\n  }\n\n  function send(message, stack, filename, lineno, colno, source, plugin) {\n    try {\n      window.parent.postMessage({\n        source: 'adaptar-preview',\n        type: 'error',\n        operationId: operationId,\n        error: {\n          message: message || 'Unknown error',\n          stack: stack || '',\n          filename: filename,\n          lineno: lineno,\n          colno: colno,\n          source: source,\n          plugin: plugin\n        }\n      }, '*');\n    } catch (_) {}\n  }\n\n  // Resource load errors (scripts, stylesheets)\n  window.addEventListener('error', function(e) {\n    var target = e.target || e.srcElement;\n    if (target && target !== window && target.tagName) {\n      var tag = String(target.tagName).toLowerCase();\n      var url = target.src || target.href;\n      if (url && (tag === 'script' || tag === 'link' || tag === 'img')) {\n        send(\n          (tag === 'link'\n            ? 'Failed to load stylesheet: '\n            : tag === 'img'\n              ? 'Failed to load image: '\n              : 'Failed to load module: ') + url,\n          '', url, undefined, undefined, 'resource-load'\n        );\n        return;\n      }\n    }\n    send(\n      e.message || (e.error && e.error.message) || 'Runtime error occurred',\n      e.error ? e.error.stack : '',\n      e.filename, e.lineno, e.colno, 'runtime'\n    );\n  });\n\n  // Unhandled promise rejections\n  window.addEventListener('unhandledrejection', function(e) {\n    var r = e.reason;\n    send(\n      r && r.message ? r.message : String(r || 'Unhandled Promise Rejection'),\n      r && r.stack,\n      r && r.fileName,\n      r && r.lineNumber,\n      r && r.columnNumber,\n      'unhandledrejection'\n    );\n  });\n\n  // Console error interception for silent Vite/Syntax errors\n  var nativeConsoleError = console.error;\n  console.error = function() {\n    var args = Array.prototype.slice.call(arguments);\n    var msg = args.map(function(a) {\n      return typeof a === 'string' ? a : (a && a.message ? a.message : String(a));\n    }).join(' ');\n    if (/Failed to load module|Internal Server Error|Syntax Error/i.test(msg)) {\n      send(msg, '', undefined, undefined, undefined, 'console.error');\n    }\n    return nativeConsoleError.apply(console, args);\n  };\n\n  // Blank screen detector\n  window.addEventListener('load', function() {\n    requestAnimationFrame(function() {\n      requestAnimationFrame(function() {\n        sendRendered(false);\n      });\n    });\n\n    setTimeout(function() {\n      var root = document.getElementById('root');\n      if (root && root.children.length === 0 && !(root.textContent || '').trim()) {\n        send(\n          'Runtime error: Preview failed to render; a component or import may have failed silently.',\n          '', location.href, undefined, undefined, 'blank-screen'\n        );\n      } else {\n        var images = Array.prototype.slice.call(document.querySelectorAll('img'));\n        var controls = Array.prototype.slice.call(\n          document.querySelectorAll('button, a[href], input, select, textarea')\n        );\n        var checks = {\n          viewportWidth: document.documentElement.clientWidth || window.innerWidth || 0,\n          horizontalOverflow:\n            document.documentElement.scrollWidth >\n            (document.documentElement.clientWidth || window.innerWidth || 0) + 2,\n          brokenImages: images.filter(function(img) {\n            return img.complete && img.naturalWidth === 0;\n          }).length,\n          missingImageAlt: images.filter(function(img) {\n            return !img.hasAttribute('alt');\n          }).length,\n          unlabeledControls: controls.filter(function(control) {\n            var label = (\n              control.getAttribute('aria-label') ||\n              control.getAttribute('title') ||\n              control.textContent ||\n              control.value ||\n              ''\n            ).trim();\n            return !label;\n          }).length\n        };\n        window.parent.postMessage({\n          source: 'adaptar-preview',\n          type: 'preview-stable',\n          operationId: operationId,\n          stableAt: Date.now(),\n          hasRootContent: Boolean(root && (root.children.length || (root.textContent || '').trim())),\n          checks: checks\n        }, '*');\n      }\n    }, 3000);\n  });\n\n  window.setInterval(function() { sendRendered(true); }, 20000);\n})();";

package/dist/scripts/error-bridge.js

@@ -1,13 +1,29 @@
 export const ERROR_BRIDGE_SCRIPT = /* js */ `(function(){
-  if (window.__ADAPTAR_ERROR_BRIDGE__) return;
-  window.__ADAPTAR_ERROR_BRIDGE__ = true;
+  if (window.__ADAPTAR_ERROR_BRIDGE__) return;
+  window.__ADAPTAR_ERROR_BRIDGE__ = true;
+
+  var operationId = new URL(window.location.href).searchParams.get('__adaptarOperation') || undefined;
+
+  function sendRendered(heartbeat) {
+    try {
+      var root = document.getElementById('root');
+      window.parent.postMessage({
+        source: 'adaptar-preview',
+        type: heartbeat ? 'render-heartbeat' : 'preview-rendered',
+        operationId: operationId,
+        renderedAt: Date.now(),
+        hasRootContent: Boolean(root && (root.children.length || (root.textContent || '').trim()))
+      }, '*');
+    } catch (_) {}
+  }
 
   function send(message, stack, filename, lineno, colno, source, plugin) {
     try {
-      window.parent.postMessage({
-        source: 'adaptar-preview',
-        type: 'error',
-        error: {
+      window.parent.postMessage({
+        source: 'adaptar-preview',
+        type: 'error',
+        operationId: operationId,
+        error: {
           message: message || 'Unknown error',
           stack: stack || '',
           filename: filename,
@@ -26,11 +42,15 @@ export const ERROR_BRIDGE_SCRIPT = /* js */ `(function(){
     if (target && target !== window && target.tagName) {
       var tag = String(target.tagName).toLowerCase();
       var url = target.src || target.href;
-      if (url && (tag === 'script' || tag === 'link')) {
-        send(
-          (tag === 'link' ? 'Failed to load stylesheet: ' : 'Failed to load module: ') + url,
-          '', url, undefined, undefined, 'resource-load'
-        );
+      if (url && (tag === 'script' || tag === 'link' || tag === 'img')) {
+        send(
+          (tag === 'link'
+            ? 'Failed to load stylesheet: '
+            : tag === 'img'
+              ? 'Failed to load image: '
+              : 'Failed to load module: ') + url,
+          '', url, undefined, undefined, 'resource-load'
+        );
         return;
       }
     }
@@ -68,15 +88,58 @@ export const ERROR_BRIDGE_SCRIPT = /* js */ `(function(){
   };
 
   // Blank screen detector
-  window.addEventListener('load', function() {
-    setTimeout(function() {
+  window.addEventListener('load', function() {
+    requestAnimationFrame(function() {
+      requestAnimationFrame(function() {
+        sendRendered(false);
+      });
+    });
+
+    setTimeout(function() {
       var root = document.getElementById('root');
-      if (root && root.children.length === 0 && !(root.textContent || '').trim()) {
-        send(
-          'Runtime error: Preview failed to render; a component or import may have failed silently.',
-          '', location.href, undefined, undefined, 'blank-screen'
-        );
-      }
-    }, 3000);
-  });
+      if (root && root.children.length === 0 && !(root.textContent || '').trim()) {
+        send(
+          'Runtime error: Preview failed to render; a component or import may have failed silently.',
+          '', location.href, undefined, undefined, 'blank-screen'
+        );
+      } else {
+        var images = Array.prototype.slice.call(document.querySelectorAll('img'));
+        var controls = Array.prototype.slice.call(
+          document.querySelectorAll('button, a[href], input, select, textarea')
+        );
+        var checks = {
+          viewportWidth: document.documentElement.clientWidth || window.innerWidth || 0,
+          horizontalOverflow:
+            document.documentElement.scrollWidth >
+            (document.documentElement.clientWidth || window.innerWidth || 0) + 2,
+          brokenImages: images.filter(function(img) {
+            return img.complete && img.naturalWidth === 0;
+          }).length,
+          missingImageAlt: images.filter(function(img) {
+            return !img.hasAttribute('alt');
+          }).length,
+          unlabeledControls: controls.filter(function(control) {
+            var label = (
+              control.getAttribute('aria-label') ||
+              control.getAttribute('title') ||
+              control.textContent ||
+              control.value ||
+              ''
+            ).trim();
+            return !label;
+          }).length
+        };
+        window.parent.postMessage({
+          source: 'adaptar-preview',
+          type: 'preview-stable',
+          operationId: operationId,
+          stableAt: Date.now(),
+          hasRootContent: Boolean(root && (root.children.length || (root.textContent || '').trim())),
+          checks: checks
+        }, '*');
+      }
+    }, 3000);
+  });
+
+  window.setInterval(function() { sendRendered(true); }, 20000);
 })();`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "adaptar-vite-plugin",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "Vite plugin for Adaptar preview error and selection bridging",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/hmr-interceptor.ts

@@ -61,11 +61,24 @@ export function interceptHmrErrors(server: ViteDevServer): void {
       }
 
       // ── Suppress full-reload that follows a fatal error ──────────────────
-      if (payload.type === "full-reload" && Date.now() < suppressReloadUntil) {
+      if (payload.type === "full-reload" && Date.now() < suppressReloadUntil) {
         suppressReloadUntil = 0; // reset — only suppress once
         return;
-      }
-    }
+      }
+
+      // A Vite update has been compiled and sent to the preview client. The
+      // injected bridge associates this with the server-owned preview operation
+      // ID carried in the iframe URL.
+      if (payload.type === "update") {
+        originalSend(payload);
+        originalSend({
+          type: "custom",
+          event: "adaptar:compile-success",
+          data: { compiledAt: Date.now() },
+        });
+        return;
+      }
+    }
 
     originalSend(payload);
   };

package/src/html-tags.ts

@@ -6,15 +6,30 @@ import { SELECTION_BRIDGE_SCRIPT } from "./scripts/selection-bridge.js";
  * The inline module that subscribes to the `adaptar:error` custom HMR event
  * and forwards it to the parent window via postMessage.
  */
-const HMR_LISTENER_SCRIPT = /* js */ `
-  if (import.meta.hot) {
-    import.meta.hot.on('adaptar:error', (data) => {
-      try {
-        window.parent.postMessage({ source: 'adaptar-preview', type: 'error', error: data }, '*');
-      } catch (_) {}
-    });
-  }
-`.trim();
+const HMR_LISTENER_SCRIPT = /* js */ `
+  const adaptarOperationId = new URL(window.location.href).searchParams.get('__adaptarOperation') || undefined;
+  const postToHost = (type, data) => {
+    try {
+      window.parent.postMessage({
+        source: 'adaptar-preview',
+        type,
+        operationId: adaptarOperationId,
+        ...data,
+      }, '*');
+    } catch (_) {}
+  };
+
+  if (import.meta.hot) {
+    import.meta.hot.on('adaptar:error', (data) => {
+      postToHost('error', { error: data });
+    });
+    import.meta.hot.on('adaptar:compile-success', (data) => {
+      postToHost('compile-success', data || {});
+    });
+  }
+
+  postToHost('compile-success', { compiledAt: Date.now(), initial: true });
+`.trim();
 
 export function buildHtmlTags(): HtmlTagDescriptor[] {
   return [

package/src/index.ts

@@ -1,4 +1,3 @@
-import type { Plugin } from "vite";
 import { interceptHmrErrors } from "./hmr-interceptor.js";
 import { buildHtmlTags } from "./html-tags.js";
 
@@ -14,7 +13,7 @@ import { buildHtmlTags } from "./html-tags.js";
  * 3. `hmr-interceptor`  — intercepts Vite's internal WebSocket to surface
  *                          build/HMR errors as structured `adaptar:error` events.
  */
-export function adaptar(): Plugin {
+export function adaptar(): any {
   return {
     name: "adaptar-vite-bridge",
     enforce: "pre",
@@ -34,7 +33,7 @@ export function adaptar(): Plugin {
       return buildHtmlTags();
     },
 
-    configureServer(server) {
+    configureServer(server: any) {
       interceptHmrErrors(server);
     },
   };

package/src/scripts/error-bridge.ts

@@ -1,13 +1,29 @@
 export const ERROR_BRIDGE_SCRIPT = /* js */ `(function(){
-  if (window.__ADAPTAR_ERROR_BRIDGE__) return;
-  window.__ADAPTAR_ERROR_BRIDGE__ = true;
+  if (window.__ADAPTAR_ERROR_BRIDGE__) return;
+  window.__ADAPTAR_ERROR_BRIDGE__ = true;
+
+  var operationId = new URL(window.location.href).searchParams.get('__adaptarOperation') || undefined;
+
+  function sendRendered(heartbeat) {
+    try {
+      var root = document.getElementById('root');
+      window.parent.postMessage({
+        source: 'adaptar-preview',
+        type: heartbeat ? 'render-heartbeat' : 'preview-rendered',
+        operationId: operationId,
+        renderedAt: Date.now(),
+        hasRootContent: Boolean(root && (root.children.length || (root.textContent || '').trim()))
+      }, '*');
+    } catch (_) {}
+  }
 
   function send(message, stack, filename, lineno, colno, source, plugin) {
     try {
-      window.parent.postMessage({
-        source: 'adaptar-preview',
-        type: 'error',
-        error: {
+      window.parent.postMessage({
+        source: 'adaptar-preview',
+        type: 'error',
+        operationId: operationId,
+        error: {
           message: message || 'Unknown error',
           stack: stack || '',
           filename: filename,
@@ -26,11 +42,15 @@ export const ERROR_BRIDGE_SCRIPT = /* js */ `(function(){
     if (target && target !== window && target.tagName) {
       var tag = String(target.tagName).toLowerCase();
       var url = target.src || target.href;
-      if (url && (tag === 'script' || tag === 'link')) {
-        send(
-          (tag === 'link' ? 'Failed to load stylesheet: ' : 'Failed to load module: ') + url,
-          '', url, undefined, undefined, 'resource-load'
-        );
+      if (url && (tag === 'script' || tag === 'link' || tag === 'img')) {
+        send(
+          (tag === 'link'
+            ? 'Failed to load stylesheet: '
+            : tag === 'img'
+              ? 'Failed to load image: '
+              : 'Failed to load module: ') + url,
+          '', url, undefined, undefined, 'resource-load'
+        );
         return;
       }
     }
@@ -68,15 +88,58 @@ export const ERROR_BRIDGE_SCRIPT = /* js */ `(function(){
   };
 
   // Blank screen detector
-  window.addEventListener('load', function() {
-    setTimeout(function() {
+  window.addEventListener('load', function() {
+    requestAnimationFrame(function() {
+      requestAnimationFrame(function() {
+        sendRendered(false);
+      });
+    });
+
+    setTimeout(function() {
       var root = document.getElementById('root');
-      if (root && root.children.length === 0 && !(root.textContent || '').trim()) {
-        send(
-          'Runtime error: Preview failed to render; a component or import may have failed silently.',
-          '', location.href, undefined, undefined, 'blank-screen'
-        );
-      }
-    }, 3000);
-  });
-})();`;
+      if (root && root.children.length === 0 && !(root.textContent || '').trim()) {
+        send(
+          'Runtime error: Preview failed to render; a component or import may have failed silently.',
+          '', location.href, undefined, undefined, 'blank-screen'
+        );
+      } else {
+        var images = Array.prototype.slice.call(document.querySelectorAll('img'));
+        var controls = Array.prototype.slice.call(
+          document.querySelectorAll('button, a[href], input, select, textarea')
+        );
+        var checks = {
+          viewportWidth: document.documentElement.clientWidth || window.innerWidth || 0,
+          horizontalOverflow:
+            document.documentElement.scrollWidth >
+            (document.documentElement.clientWidth || window.innerWidth || 0) + 2,
+          brokenImages: images.filter(function(img) {
+            return img.complete && img.naturalWidth === 0;
+          }).length,
+          missingImageAlt: images.filter(function(img) {
+            return !img.hasAttribute('alt');
+          }).length,
+          unlabeledControls: controls.filter(function(control) {
+            var label = (
+              control.getAttribute('aria-label') ||
+              control.getAttribute('title') ||
+              control.textContent ||
+              control.value ||
+              ''
+            ).trim();
+            return !label;
+          }).length
+        };
+        window.parent.postMessage({
+          source: 'adaptar-preview',
+          type: 'preview-stable',
+          operationId: operationId,
+          stableAt: Date.now(),
+          hasRootContent: Boolean(root && (root.children.length || (root.textContent || '').trim())),
+          checks: checks
+        }, '*');
+      }
+    }, 3000);
+  });
+
+  window.setInterval(function() { sendRendered(true); }, 20000);
+})();`;