@mablhq/playwright-tools 2.49.1

package/resources/actionabilityCheck.js

@@ -0,0 +1,160 @@
+// All this code can be removed once we move to Playwright.
+mablCheckActionability = (node, point) => {
+  const autoClosingTags = new Set([
+    'AREA',
+    'BASE',
+    'BR',
+    'COL',
+    'COMMAND',
+    'EMBED',
+    'HR',
+    'IMG',
+    'INPUT',
+    'KEYGEN',
+    'LINK',
+    'MENUITEM',
+    'META',
+    'PARAM',
+    'SOURCE',
+    'TRACK',
+    'WBR',
+  ]);
+  const booleanAttributes = new Set([
+    'checked',
+    'selected',
+    'disabled',
+    'readonly',
+    'multiple',
+  ]);
+
+  const parentElementOrShadowHost = function(element) {
+    if (element.parentElement) {
+      return element.parentElement;
+    }
+    if (!element.parentNode) {
+      return;
+    }
+    if (
+      element.parentNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE &&
+      element.parentNode.host
+    ) {
+      return element.parentNode.host;
+    }
+
+    return undefined;
+  };
+
+  const deepElementFromPoint = function(document, x, y) {
+    let container = document;
+    let element;
+    while (container) {
+      // elementFromPoint works incorrectly in Chromium (http://crbug.com/1188919),
+      // so we use elementsFromPoint instead.
+      const elements = container.elementsFromPoint(x, y);
+      const innerElement = elements[0];
+      if (!innerElement || element === innerElement) {
+        break;
+      }
+      element = innerElement;
+      container = element.shadowRoot;
+    }
+    return element;
+  };
+
+  const oneLine = function(s) {
+    return s.replace(/\n/g, '↵').replace(/\t/g, '⇆');
+  };
+
+  const previewNode = function(node) {
+    if (!node) {
+      return '';
+    }
+
+    if (node.nodeType === Node.TEXT_NODE) {
+      return oneLine(`#text=${node.nodeValue || ''}`);
+    }
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+      return oneLine(`<${node.nodeName.toLowerCase()} />`);
+    }
+    const element = node;
+
+    const attrs = [];
+    // eslint-disable-next-line @typescript-eslint/prefer-for-of
+    for (let i = 0; i < element.attributes.length; i++) {
+      const {name, value} = element.attributes[i];
+      if (name === 'style') {
+        continue;
+      }
+      if (!value && booleanAttributes.has(name)) {
+        attrs.push(` ${name}`);
+      } else {
+        attrs.push(` ${name}="${value}"`);
+      }
+    }
+    attrs.sort((a, b) => a.length - b.length);
+    let attrText = attrs.join('');
+    if (attrText.length > 50) {
+      attrText = attrText.substring(0, 49) + '\u2026';
+    }
+    if (autoClosingTags.has(element.nodeName)) {
+      return oneLine(`<${element.nodeName.toLowerCase()}${attrText}/>`);
+    }
+
+    const children = element.childNodes;
+    let onlyText = false;
+    if (children.length <= 5) {
+      onlyText = true;
+      // eslint-disable-next-line @typescript-eslint/prefer-for-of
+      for (let i = 0; i < children.length; i++) {
+        onlyText = onlyText && children[i].nodeType === Node.TEXT_NODE;
+      }
+    }
+    let text = onlyText
+      ? element.textContent || ''
+      : children.length
+      ? '\u2026'
+      : '';
+    if (text.length > 50) {
+      text = text.substring(0, 49) + '\u2026';
+    }
+    return oneLine(
+      `<${element.nodeName.toLowerCase()}${attrText}>${text}</${element.nodeName.toLowerCase()}>`,
+    );
+  };
+
+  let element = node.nodeType === Node.ELEMENT_NODE ? node : node.parentElement;
+  if (!element || !element.isConnected) {
+    return 'error:notconnected';
+  }
+  element = element.closest('button, [role=button]') || element;
+  let hitElement = deepElementFromPoint(document, point.x, point.y);
+  const hitParents = [];
+  while (hitElement && hitElement !== element) {
+    hitParents.push(hitElement);
+    hitElement = parentElementOrShadowHost(hitElement);
+  }
+  if (hitElement === element) {
+    return 'done';
+  }
+  const actionabilityDescription = previewNode(hitParents[0]);
+  // Root is the topmost element in the hitTarget's chain that is not in the
+  // element's chain. For example, it might be a dialog element that overlays
+  // the target.
+  let rootActionabilityDescription;
+  while (element) {
+    const index = hitParents.indexOf(element);
+    if (index !== -1) {
+      if (index > 1) {
+        rootActionabilityDescription = previewNode(hitParents[index - 1]);
+      }
+      break;
+    }
+    element = parentElementOrShadowHost(element);
+  }
+  if (rootActionabilityDescription) {
+    return {
+      actionabilityDescription: `${actionabilityDescription} from ${rootActionabilityDescription} subtree`,
+    };
+  }
+  return {actionabilityDescription};
+};

package/resources/coreWebVitals.js

@@ -0,0 +1 @@
+(()=>{"use strict";var e={d:(n,t)=>{for(var i in t)e.o(t,i)&&!e.o(n,i)&&Object.defineProperty(n,i,{enumerable:!0,get:t[i]})},o:(e,n)=>Object.prototype.hasOwnProperty.call(e,n),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},n={};e.r(n),e.d(n,{attachListeners:()=>F,listenersAreAttached:()=>D});var t=-1,i=function(e){addEventListener("pageshow",(function(n){n.persisted&&(t=n.timeStamp,e(n))}),!0)},r=function(){return window.performance&&performance.getEntriesByType&&performance.getEntriesByType("navigation")[0]},o=function(){var e=r();return e&&e.activationStart||0},a=function(e,n){var i=r(),a="navigate";return t>=0?a="back-forward-cache":i&&(a=document.prerendering||o()>0?"prerender":document.wasDiscarded?"restore":i.type.replace(/_/g,"-")),{name:e,value:void 0===n?-1:n,rating:"good",delta:0,entries:[],id:"v3-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12),navigationType:a}},c=function(e,n,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){var i=new PerformanceObserver((function(e){Promise.resolve().then((function(){n(e.getEntries())}))}));return i.observe(Object.assign({type:e,buffered:!0},t||{})),i}}catch(e){}},u=function(e,n,t,i){var r,o;return function(a){n.value>=0&&(a||i)&&((o=n.value-(r||0))||void 0===r)&&(r=n.value,n.delta=o,n.rating=function(e,n){return e>n[1]?"poor":e>n[0]?"needs-improvement":"good"}(n.value,t),e(n))}},d=function(e){requestAnimationFrame((function(){return requestAnimationFrame((function(){return e()}))}))},l=function(e){var n=function(n){"pagehide"!==n.type&&"hidden"!==document.visibilityState||e(n)};addEventListener("visibilitychange",n,!0),addEventListener("pagehide",n,!0)},v=function(e){var n=!1;return function(t){n||(e(t),n=!0)}},s=-1,f=function(){return"hidden"!==document.visibilityState||document.prerendering?1/0:0},m=function(e){"hidden"===document.visibilityState&&s>-1&&(s="visibilitychange"===e.type?e.timeStamp:0,g())},p=function(){addEventListener("visibilitychange",m,!0),addEventListener("prerenderingchange",m,!0)},g=function(){removeEventListener("visibilitychange",m,!0),removeEventListener("prerenderingchange",m,!0)},y=function(){return s<0&&(s=f(),p(),i((function(){setTimeout((function(){s=f(),p()}),0)}))),{get firstHiddenTime(){return s}}},h=function(e){document.prerendering?addEventListener("prerenderingchange",(function(){return e()}),!0):e()},E=[1800,3e3],T=function(e,n){n=n||{},h((function(){var t,r=y(),l=a("FCP"),v=c("paint",(function(e){e.forEach((function(e){"first-contentful-paint"===e.name&&(v.disconnect(),e.startTime<r.firstHiddenTime&&(l.value=Math.max(e.startTime-o(),0),l.entries.push(e),t(!0)))}))}));v&&(t=u(e,l,E,n.reportAllChanges),i((function(i){l=a("FCP"),t=u(e,l,E,n.reportAllChanges),d((function(){l.value=performance.now()-i.timeStamp,t(!0)}))})))}))},w=[.1,.25],b=function(e,n){n=n||{},T(v((function(){var t,r=a("CLS",0),o=0,v=[],s=function(e){e.forEach((function(e){if(!e.hadRecentInput){var n=v[0],t=v[v.length-1];o&&e.startTime-t.startTime<1e3&&e.startTime-n.startTime<5e3?(o+=e.value,v.push(e)):(o=e.value,v=[e])}})),o>r.value&&(r.value=o,r.entries=v,t())},f=c("layout-shift",s);f&&(t=u(e,r,w,n.reportAllChanges),l((function(){s(f.takeRecords()),t(!0)})),i((function(){o=0,r=a("CLS",0),t=u(e,r,w,n.reportAllChanges),d((function(){return t()}))})),setTimeout(t,0))})))},C=(new Date,[2500,4e3]),L={},S=function(e,n){n=n||{},h((function(){var t,r=y(),s=a("LCP"),f=function(e){var n=e[e.length-1];n&&n.startTime<r.firstHiddenTime&&(s.value=Math.max(n.startTime-o(),0),s.entries=[n],t())},m=c("largest-contentful-paint",f);if(m){t=u(e,s,C,n.reportAllChanges);var p=v((function(){L[s.id]||(f(m.takeRecords()),m.disconnect(),L[s.id]=!0,t(!0))}));["keydown","click"].forEach((function(e){addEventListener(e,p,!0)})),l(p),i((function(i){s=a("LCP"),t=u(e,s,C,n.reportAllChanges),d((function(){s.value=performance.now()-i.timeStamp,L[s.id]=!0,t(!0)}))}))}}))},A=[800,1800],O=function e(n){document.prerendering?h((function(){return e(n)})):"complete"!==document.readyState?addEventListener("load",(function(){return e(n)}),!0):setTimeout(n,0)},P=function(e,n){n=n||{};var t=a("TTFB"),c=u(e,t,A,n.reportAllChanges);O((function(){var d=r();if(d){var l=d.responseStart;if(l<=0||l>performance.now())return;t.value=Math.max(l-o(),0),t.entries=[d],c(!0),i((function(){t=a("TTFB",0),(c=u(e,t,A,n.reportAllChanges))(!0)}))}}))};const M=10,B=100;let D=!1;function F(){b(_),T(_),S(_),P(_),function(e){var n;const t=null===(n=performance.getEntriesByType("navigation"))||void 0===n?void 0:n[0];void 0!==t&&R("startTime",e);(null==t?void 0:t.domContentLoadedEventEnd)?R("domContentLoadedEventEnd",e):document.addEventListener("DOMContentLoaded",(function(){!function(e,n,t){var i;if(t=null!=t?t:null===(i=performance.getEntriesByType("navigation"))||void 0===i?void 0:i[0],null==t?void 0:t[e])return void R(e,n);let r=0;const o=window.setInterval((()=>{var t;r++;const i=null===(t=performance.getEntriesByType("navigation"))||void 0===t?void 0:t[0];((null==i?void 0:i[e])||r>=M)&&(R(e,n),window.clearInterval(o))}),B)}("domContentLoadedEventEnd",e)}))}(_),D=!0}function R(e,n){var t;const i=performance.getEntriesByType("navigation"),r=null==i?void 0:i[0],o=null==r?void 0:r[e];n({name:e,value:o,delta:o,rating:"none",id:`NAV:${e}:${o}:${Date.now()}`,entries:null==i?void 0:i.map((e=>null==e?void 0:e.toJSON())),navigationType:null!==(t=null==r?void 0:r.type)&&void 0!==t?t:"navigate"})}const _=e=>{var n,t,i;const r=null===(n=performance.getEntriesByType("navigation"))||void 0===n?void 0:n[0];null===(i=(t=window).dispatchMablEvent)||void 0===i||i.call(t,{createdTime:Date.now(),timeOrigin:performance.timeOrigin,type:"WEB_PERFORMANCE_METRIC_DETECTED",currentUrl:window.document.URL,navigationUrl:null==r?void 0:r.name,metric:e})};window.mablCoreWebVitals=n})();