Release v5.1.1

.vscode/settings.json

@@ -4,6 +4,7 @@
     "consts",
     "delog",
     "filesize",
+    "logcapture",
     "Loggable",
     "sarif",
     "sonarjs"

example/child/frame.animate.html

@@ -97,15 +97,15 @@ <h4>Data returned by parentIFrame.getParentProps()</h4>
       </p>
     </div>
 
-    <!-- script>
+    <script>
       // Add some content to to show the effect of using data-iframe-size above
-      for (var i = 0; i < 10000; i++) {
+      for (let i = 0; i < 10_000; i++) {
         document.write(
-          '<div style="position: absolute">This is a test to see if the page will grow to accommodate the content.</div>'
-        );
+          '<div style="position: absolute">This is a test to see if the page will grow to accommodate the content.</div>',
+  );
       }
 
-    </script -->
+    </script>
 
     <script>
       const dataTable = document.getElementById('data')
@@ -126,12 +126,9 @@ <h4>Data returned by parentIFrame.getParentProps()</h4>
         // You should not need to do this with same domain iframes.
         // offsetHeight: -1,
 
-        sizeSelector: "#abs",
+        // sizeSelector: "#abs",
 
         onReady: () => {
-          //   parentIFrame.getPageInfo((pageInfo) => {
-          //     dataTable.innerHTML = Object.entries(pageInfo).map(row).join('\n')
-          //   })
           parentIFrame.getParentProps((pageInfo) => {
             dataTable.innerHTML = Object.entries(pageInfo).map(rowParent).join('\n')
           })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "iframe-resizer",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "private": true,
   "type": "module",
   "license": "GPL-3.0",

packages/child/index.js

@@ -115,14 +115,14 @@ function getElementName(el) {
   }
 }
 
-function elementSnippet(el) {
+function elementSnippet(el, maxChars = 30) {
   const outer = el?.outerHTML?.toString()
 
   if (!outer) return el
 
-  return outer.length < 30
+  return outer.length < maxChars
     ? outer
-    : `${outer.slice(0, 30).replaceAll('\n', ' ')}...`
+    : `${outer.slice(0, maxChars).replaceAll('\n', ' ')}...`
 }
 
 // TODO: remove .join(' '), requires major test updates
@@ -847,14 +847,20 @@ function setupMutationObserver() {
 }
 
 const usedTags = new WeakSet()
+usedTags.add(document.documentElement)
+usedTags.add(document.body)
 
 function usedEl(el) {
   if (usedTags.has(el)) return true
   usedTags.add(el)
-  info(`\nHeight calculated from: ${getElementName(el)}`)
+  info(
+    `\nHeight calculated from: ${getElementName(el)} (${elementSnippet(el)})`,
+  )
   return false
 }
 
+let perfWarned = 0
+
 function getMaxElement(side) {
   const Side = capitalizeFirstLetter(side)
 
@@ -892,15 +898,19 @@ function getMaxElement(side) {
   const logMsg = `
 Parsed ${len} element${(len = SINGLE ? '' : 's')} in ${timer.toPrecision(3)}ms
 ${Side} ${hasTags ? 'tagged ' : ''}element found at: ${maxVal}px
-Position calculated from HTML element: ${elementSnippet(maxEl)}`
+Position calculated from HTML element: ${getElementName(maxEl)} (${elementSnippet(maxEl, 100)})`
 
   if (timer < 1.1 || isInit || hasTags) {
     log(logMsg)
   } else {
+    if (perfWarned > timer) return maxVal
+    perfWarned = timer
     advise(
       `<rb>Performance Warning</>
 
 Calculating the page size took an excessive amount of time. To improve performance add the <b>data-iframe-size</> attribute to the ${side} most element on the page.
+
+More info: https://iframe-resizer.com/performance.
 ${logMsg}`,
     )
   }