@trebired/frontend 29.5.1 → 29.5.2

package/CHANGELOG.md

@@ -4,6 +4,10 @@ All notable changes to `@trebired/frontend` will be documented here.
 
 This project follows semantic versioning once published.
 
+## 29.5.2
+
+- Changed the unverified frame warning to a short line logged under `trebired.frontend.frames`, such as `Removed tbf-unverified iframe#chat "Support" https://chat.example/widget`, which names the frame by its tag, id, title and address instead of printing the whole element. It goes through the page's logger when one is installed, the way the bundler's attribution does, and to the console otherwise.
+
 ## 29.5.1
 
 - Fixed an unverified frame staying in the page, hidden, when a script appended it to `body` before the page had finished parsing. A frame placed straight into `body`, `html` or `head` belongs to no island, so it is removed whenever it arrives; only a frame inside the markup, which React may hydrate, stays hidden in place.

package/README.md

@@ -127,7 +127,7 @@ It returns `{ bootScripts, bodyScripts }`: the head scripts that restore the scr
 
 ### Unverified frames
 
-A page shows only the frames it declares. Every `iframe`, `frame`, `object` and `embed` must carry `data-tbf-frame`; one without it is unverified. `frontendBoot()` adds a head script that hides every unverified frame with a stylesheet before the first paint, so none is ever seen, and watches the document for the rest of the page's life. An unverified frame that anything other than React inserts after the page has parsed, or places straight into `body`, such as a frame a script appends to the page, is removed. One inside the server markup or rendered by React stays in place, hidden, because React owns it and would fail to hydrate or update a node taken from under it. Either way the console gets a warning naming the frame and whether it was removed or hidden, so an app frame that lacks the attribute is found in the browser's console.
+A page shows only the frames it declares. Every `iframe`, `frame`, `object` and `embed` must carry `data-tbf-frame`; one without it is unverified. `frontendBoot()` adds a head script that hides every unverified frame with a stylesheet before the first paint, so none is ever seen, and watches the document for the rest of the page's life. An unverified frame that anything other than React inserts after the page has parsed, or places straight into `body`, such as a frame a script appends to the page, is removed. One inside the server markup or rendered by React stays in place, hidden, because React owns it and would fail to hydrate or update a node taken from under it. Either way a warning is logged under `trebired.frontend.frames`, such as `Removed tbf-unverified iframe#chat "Support" https://chat.example/widget` or `Hid tbf-unverified iframe`, through the page's logger when one is installed on the global the bundler's attribution uses, and to the console otherwise, so an app frame that lacks the attribute is found there.
 
 `EmbedFrame`, `MapEmbed` and the editor surface carry the attribute already. A frame an app renders itself spreads `frontendFrameAttrs()` onto the element, and `FRAME_ATTRIBUTE` names the attribute for code that builds frames by hand:
 

package/dist/media/frames.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"frames.d.ts","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEpE,QAAA,MAAM,eAAe,kBAA4B,CAAC;AAIlD,iBAAS,kBAAkB,IAAI,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAElE;AAMD,iBAAS,+BAA+B,IAAI,MAAM,CAkBjD;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}
+{"version":3,"file":"frames.d.ts","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqC,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAErF,QAAA,MAAM,eAAe,kBAA4B,CAAC;AAMlD,iBAAS,kBAAkB,IAAI,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAElE;AAMD,iBAAS,+BAA+B,IAAI,MAAM,CAwBjD;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/media/frames.js

@@ -1,6 +1,7 @@
-import { frontendDataAttr, frontendDataAttrs } from "../namespace/index.js";
+import { FRONTEND_PREFIX, frontendDataAttr, frontendDataAttrs } from "../namespace/index.js";
 const FRAME_ATTRIBUTE = frontendDataAttr("frame");
 const FRAME_TAGS = ["iframe", "frame", "object", "embed"];
+const FRAME_LOG_GROUP = "trebired.frontend.frames";
 function frontendFrameAttrs() {
     return frontendDataAttrs({ frame: "" });
 }
@@ -9,16 +10,22 @@ function unverifiedFrameSelector() {
 }
 function createUnverifiedFrameBootScript() {
     const selector = JSON.stringify(unverifiedFrameSelector());
+    const group = JSON.stringify(FRAME_LOG_GROUP);
     return [
         "(function(){try{",
         `var Q=${selector},d=document,s=d.createElement('style');`,
         "s.textContent=Q+'{display:none!important}';(d.head||d.documentElement).appendChild(s);",
         "function r(f){for(var k in f)if(k.indexOf('__react')===0)return true;return false}",
+        "function lb(f){var t=f.getAttribute('title'),u=f.getAttribute('src')||f.getAttribute('data')||'';",
+        `return f.tagName.toLowerCase()+(f.id?'#'+f.id:'')+(t?' "'+t.slice(0,60)+'"':'')`,
+        "+(u?' '+u.split('?')[0].slice(0,80):f.hasAttribute('srcdoc')?' srcdoc':'')}",
+        "function o(m){var g=typeof globalThis!=='undefined'?globalThis:window,l=g.__logger_adapter_logger__||g.loggerAdapterLogger;",
+        "if(typeof l==='function'){try{l=l()}catch(e){l=null}}",
+        `if(l&&typeof l.warn==='function'){l.warn(${group},m);return}console.warn('[WARN, '+${group}+'] '+m)}`,
         "var w=new WeakSet();function v(f){if(w.has(f))return;w.add(f);",
         "var p=f.parentNode,top=p===d.body||p===d.documentElement||p===d.head;",
         "var keep=r(f)||(d.readyState==='loading'&&!top);if(!keep)f.remove();",
-        "console.warn('[tbf] Unverified '+f.tagName.toLowerCase()+' '+(keep?'hidden':'removed')",
-        `+': it has no ${FRAME_ATTRIBUTE} attribute.',f)}`,
+        `o((keep?'Hid':'Removed')+' ${FRONTEND_PREFIX}-unverified '+lb(f))}`,
         "function x(n){if(n.nodeType!==1)return;if(n.matches(Q)){v(n);return}",
         "if(n.firstElementChild)n.querySelectorAll(Q).forEach(v)}",
         "new MutationObserver(function(m){for(var i=0;i<m.length;i++)m[i].addedNodes.forEach(x)})",

package/dist/media/frames.js.map

@@ -1 +1 @@
-{"version":3,"file":"frames.js","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEpE,MAAM,eAAe,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAElD,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;AAE1D,SAAS,kBAAkB;IACzB,OAAO,iBAAiB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,uBAAuB;IAC9B,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,GAAG,SAAS,eAAe,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC/E,CAAC;AAED,SAAS,+BAA+B;IACtC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,uBAAuB,EAAE,CAAC,CAAC;IAC3D,OAAO;QACL,kBAAkB;QAClB,SAAS,QAAQ,yCAAyC;QAC1D,wFAAwF;QACxF,oFAAoF;QACpF,gEAAgE;QAChE,uEAAuE;QACvE,sEAAsE;QACtE,wFAAwF;QACxF,iBAAiB,eAAe,kBAAkB;QAClD,sEAAsE;QACtE,0DAA0D;QAC1D,0FAA0F;QAC1F,4DAA4D;QAC5D,kBAAkB;KACnB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACb,CAAC;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}
+{"version":3,"file":"frames.js","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAErF,MAAM,eAAe,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAElD,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;AAE1D,MAAM,eAAe,GAAG,0BAA0B,CAAC;AAEnD,SAAS,kBAAkB;IACzB,OAAO,iBAAiB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,uBAAuB;IAC9B,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,GAAG,SAAS,eAAe,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC/E,CAAC;AAED,SAAS,+BAA+B;IACtC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,uBAAuB,EAAE,CAAC,CAAC;IAC3D,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;IAC9C,OAAO;QACL,kBAAkB;QAClB,SAAS,QAAQ,yCAAyC;QAC1D,wFAAwF;QACxF,oFAAoF;QACpF,mGAAmG;QACnG,iFAAiF;QACjF,6EAA6E;QAC7E,6HAA6H;QAC7H,uDAAuD;QACvD,4CAA4C,KAAK,qCAAqC,KAAK,WAAW;QACtG,gEAAgE;QAChE,uEAAuE;QACvE,sEAAsE;QACtE,8BAA8B,eAAe,uBAAuB;QACpE,sEAAsE;QACtE,0DAA0D;QAC1D,0FAA0F;QAC1F,4DAA4D;QAC5D,kBAAkB;KACnB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACb,CAAC;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/src/media/frames.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"frames.d.ts","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEpE,QAAA,MAAM,eAAe,kBAA4B,CAAC;AAIlD,iBAAS,kBAAkB,IAAI,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAElE;AAMD,iBAAS,+BAA+B,IAAI,MAAM,CAkBjD;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}
+{"version":3,"file":"frames.d.ts","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqC,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAErF,QAAA,MAAM,eAAe,kBAA4B,CAAC;AAMlD,iBAAS,kBAAkB,IAAI,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAElE;AAMD,iBAAS,+BAA+B,IAAI,MAAM,CAwBjD;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/src/media/frames.js

@@ -1,6 +1,7 @@
-import { frontendDataAttr, frontendDataAttrs } from "../../namespace/index.js";
+import { FRONTEND_PREFIX, frontendDataAttr, frontendDataAttrs } from "../../namespace/index.js";
 const FRAME_ATTRIBUTE = frontendDataAttr("frame");
 const FRAME_TAGS = ["iframe", "frame", "object", "embed"];
+const FRAME_LOG_GROUP = "trebired.frontend.frames";
 function frontendFrameAttrs() {
     return frontendDataAttrs({ frame: "" });
 }
@@ -9,16 +10,22 @@ function unverifiedFrameSelector() {
 }
 function createUnverifiedFrameBootScript() {
     const selector = JSON.stringify(unverifiedFrameSelector());
+    const group = JSON.stringify(FRAME_LOG_GROUP);
     return [
         "(function(){try{",
         `var Q=${selector},d=document,s=d.createElement('style');`,
         "s.textContent=Q+'{display:none!important}';(d.head||d.documentElement).appendChild(s);",
         "function r(f){for(var k in f)if(k.indexOf('__react')===0)return true;return false}",
+        "function lb(f){var t=f.getAttribute('title'),u=f.getAttribute('src')||f.getAttribute('data')||'';",
+        `return f.tagName.toLowerCase()+(f.id?'#'+f.id:'')+(t?' "'+t.slice(0,60)+'"':'')`,
+        "+(u?' '+u.split('?')[0].slice(0,80):f.hasAttribute('srcdoc')?' srcdoc':'')}",
+        "function o(m){var g=typeof globalThis!=='undefined'?globalThis:window,l=g.__logger_adapter_logger__||g.loggerAdapterLogger;",
+        "if(typeof l==='function'){try{l=l()}catch(e){l=null}}",
+        `if(l&&typeof l.warn==='function'){l.warn(${group},m);return}console.warn('[WARN, '+${group}+'] '+m)}`,
         "var w=new WeakSet();function v(f){if(w.has(f))return;w.add(f);",
         "var p=f.parentNode,top=p===d.body||p===d.documentElement||p===d.head;",
         "var keep=r(f)||(d.readyState==='loading'&&!top);if(!keep)f.remove();",
-        "console.warn('[tbf] Unverified '+f.tagName.toLowerCase()+' '+(keep?'hidden':'removed')",
-        `+': it has no ${FRAME_ATTRIBUTE} attribute.',f)}`,
+        `o((keep?'Hid':'Removed')+' ${FRONTEND_PREFIX}-unverified '+lb(f))}`,
         "function x(n){if(n.nodeType!==1)return;if(n.matches(Q)){v(n);return}",
         "if(n.firstElementChild)n.querySelectorAll(Q).forEach(v)}",
         "new MutationObserver(function(m){for(var i=0;i<m.length;i++)m[i].addedNodes.forEach(x)})",

package/dist/src/media/frames.js.map

@@ -1 +1 @@
-{"version":3,"file":"frames.js","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEpE,MAAM,eAAe,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAElD,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;AAE1D,SAAS,kBAAkB;IACzB,OAAO,iBAAiB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,uBAAuB;IAC9B,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,GAAG,SAAS,eAAe,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC/E,CAAC;AAED,SAAS,+BAA+B;IACtC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,uBAAuB,EAAE,CAAC,CAAC;IAC3D,OAAO;QACL,kBAAkB;QAClB,SAAS,QAAQ,yCAAyC;QAC1D,wFAAwF;QACxF,oFAAoF;QACpF,gEAAgE;QAChE,uEAAuE;QACvE,sEAAsE;QACtE,wFAAwF;QACxF,iBAAiB,eAAe,kBAAkB;QAClD,sEAAsE;QACtE,0DAA0D;QAC1D,0FAA0F;QAC1F,4DAA4D;QAC5D,kBAAkB;KACnB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACb,CAAC;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}
+{"version":3,"file":"frames.js","sourceRoot":"","sources":["../../../src/media/frames.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAErF,MAAM,eAAe,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAElD,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;AAE1D,MAAM,eAAe,GAAG,0BAA0B,CAAC;AAEnD,SAAS,kBAAkB;IACzB,OAAO,iBAAiB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,uBAAuB;IAC9B,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,GAAG,SAAS,eAAe,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC/E,CAAC;AAED,SAAS,+BAA+B;IACtC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,uBAAuB,EAAE,CAAC,CAAC;IAC3D,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;IAC9C,OAAO;QACL,kBAAkB;QAClB,SAAS,QAAQ,yCAAyC;QAC1D,wFAAwF;QACxF,oFAAoF;QACpF,mGAAmG;QACnG,iFAAiF;QACjF,6EAA6E;QAC7E,6HAA6H;QAC7H,uDAAuD;QACvD,4CAA4C,KAAK,qCAAqC,KAAK,WAAW;QACtG,gEAAgE;QAChE,uEAAuE;QACvE,sEAAsE;QACtE,8BAA8B,eAAe,uBAAuB;QACpE,sEAAsE;QACtE,0DAA0D;QAC1D,0FAA0F;QAC1F,4DAA4D;QAC5D,kBAAkB;KACnB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACb,CAAC;AAED,OAAO,EAAE,eAAe,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,CAAC"}

package/package.json

@@ -8,7 +8,7 @@
     }
   },
   "name": "@trebired/frontend",
-  "version": "29.5.1",
+  "version": "29.5.2",
   "description": "Generic browser runtime systems for Trebired frontend packages and applications.",
   "type": "module",
   "sideEffects": [