All files / cwv/_collections inp-interaction-script.const.ts

100% Statements 73/73
100% Branches 0/0
100% Functions 0/0
100% Lines 73/73

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 741x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x  
/**
 * Wave-3 — INP (Interaction to Next Paint) page-side instrumentation.
 *
 * Az INP a `web-vitals/attribution` v4 lib egyik kulcs-metrikája — a
 * felhasználói interakciók (click, keypress, pointerup) és a következő
 * paint közötti latency. P75-asszertelhető.
 *
 * **PURE JavaScript** — a browser direkt futtatja. Az eredményeket a
 * `window.__dye2e_cwv_events__` tömbbe rakja (összhangban a
 * `DYE2E_WEB_VITALS_PAGE_SCRIPT`-tel).
 *
 * Lefedi: INP via `event` PerformanceObserver-rel (Chrome 96+).
 */
export const DYE2E_INP_PAGE_SCRIPT: string = `
(function () {
  var w = window;
  if (!w.__dye2e_cwv_events__) { w.__dye2e_cwv_events__ = []; }
  if (w.__dye2e_inp_setup__) { return; }
  w.__dye2e_inp_setup__ = true;
  var events = w.__dye2e_cwv_events__;
  function pushEvent(metric, value, attribution) {
    events.push({ metric: metric, value: value, attribution: attribution, t: Date.now() });
  }
 
  try {
    var longestInteraction = 0;
    var lastTarget = null;
    var po = new PerformanceObserver(function (list) {
      var entries = list.getEntries();
      for (var i = 0; i < entries.length; i++) {
        var e = entries[i];
        var duration = e.duration || 0;
        // INP — az interaction-id-vel rendelkező event-ek
        if (e.interactionId && e.interactionId > 0 && duration > longestInteraction) {
          longestInteraction = duration;
          lastTarget = e.target ? (e.target.tagName + (e.target.id ? '#' + e.target.id : '')) : null;
        }
      }
    });
    po.observe({ type: 'event', buffered: true, durationThreshold: 0 });
 
    // Snapshot on pagehide / visibility-change
    var snapshot = function () {
      if (longestInteraction > 0) {
        pushEvent('inp', longestInteraction, { target: lastTarget });
      }
    };
    addEventListener('pagehide', snapshot, true);
    addEventListener('visibilitychange', function () {
      if (document.visibilityState === 'hidden') { snapshot(); }
    }, true);
    w.__dye2e_inp_snapshot__ = snapshot;
  } catch (e) { /* PerformanceObserver / event-timing nem támogatott */ }
})();
`.trim();
 
/**
 * Interaction-driver — a Node oldali Playwright-script ami INP-input-ot
 * generál (page.click / keyboard.press / mouse.move). Wave-3 entry-point.
 *
 * NEM az itt definiált — csak a typed shape; az interakció a generated
 * spec.ts-ben jön létre per consumer-projekt.
 */
export interface DyE2E_INPInteraction_Shape {
  /** 'click' | 'keyboard' | 'pointerdown' — interakció-fajta. */
  type: 'click' | 'keyboard' | 'pointerdown';
  /** Selector vagy testId a target-re. */
  selector?: string;
  /** Keyboard esetén billentyű (pl. 'Enter', 'a'). */
  key?: string;
  /** Pre-action timeout ms-ben (settle előtti vár). */
  preActionTimeout?: number;
}