lighthouse 11.7.0 → 12.0.0-dev.20240422

package/core/gather/gatherers/seo/tap-targets.js

@@ -1,389 +0,0 @@
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/* global document, window, getComputedStyle, getElementsInDocument, Node, getNodeDetails, getRectCenterPoint */
-
-import BaseGatherer from '../../base-gatherer.js';
-import {pageFunctions} from '../../../lib/page-functions.js';
-import * as RectHelpers from '../../../lib/rect-helpers.js';
-
-const TARGET_SELECTORS = [
-  'button',
-  'a',
-  'input',
-  'textarea',
-  'select',
-  'option',
-  '[role=button]',
-  '[role=checkbox]',
-  '[role=link]',
-  '[role=menuitem]',
-  '[role=menuitemcheckbox]',
-  '[role=menuitemradio]',
-  '[role=option]',
-  '[role=scrollbar]',
-  '[role=slider]',
-  '[role=spinbutton]',
-];
-const tapTargetsSelector = TARGET_SELECTORS.join(',');
-
-/**
- * @param {HTMLElement} element
- * @return {boolean}
- */
-/* c8 ignore start */
-function elementIsVisible(element) {
-  return !!(element.offsetWidth || element.offsetHeight || element.getClientRects().length);
-}
-/* c8 ignore stop */
-
-/**
- * @param {Element} element
- * @return {LH.Artifacts.Rect[]}
- */
-/* c8 ignore start */
-function getClientRects(element) {
-  const clientRects = Array.from(
-    element.getClientRects()
-  ).map(clientRect => {
-    // Contents of DOMRect get lost when returned from Runtime.evaluate call,
-    // so we convert them to plain objects.
-    const {width, height, left, top, right, bottom} = clientRect;
-    return {width, height, left, top, right, bottom};
-  });
-
-  for (const child of element.children) {
-    clientRects.push(...getClientRects(child));
-  }
-
-  return clientRects;
-}
-/* c8 ignore stop */
-
-/**
- * @param {Element} element
- * @param {string} tapTargetsSelector
- * @return {boolean}
- */
-/* c8 ignore start */
-function elementHasAncestorTapTarget(element, tapTargetsSelector) {
-  if (!element.parentElement) {
-    return false;
-  }
-  if (element.parentElement.matches(tapTargetsSelector)) {
-    return true;
-  }
-  return elementHasAncestorTapTarget(element.parentElement, tapTargetsSelector);
-}
-/* c8 ignore stop */
-
-/**
- * @param {Element} element
- */
-/* c8 ignore start */
-function hasTextNodeSiblingsFormingTextBlock(element) {
-  if (!element.parentElement) {
-    return false;
-  }
-
-  const parentElement = element.parentElement;
-
-  const nodeText = element.textContent || '';
-  const parentText = parentElement.textContent || '';
-  if (parentText.length - nodeText.length < 5) {
-    // Parent text mostly consists of this node, so the parent
-    // is not a text block container
-    return false;
-  }
-
-  for (const sibling of element.parentElement.childNodes) {
-    if (sibling === element) {
-      continue;
-    }
-    const siblingTextContent = (sibling.textContent || '').trim();
-    // Only count text in text nodes so that a series of e.g. buttons isn't counted
-    // as a text block.
-    // This works reasonably well, but means we miss text blocks where all text is e.g.
-    // wrapped in spans
-    if (sibling.nodeType === Node.TEXT_NODE && siblingTextContent.length > 0) {
-      return true;
-    }
-  }
-
-  return false;
-}
-/* c8 ignore stop */
-
-/**
- * Check if element is in a block of text, such as paragraph with a bunch of links in it.
- * Makes a reasonable guess, but for example gets it wrong if the element is surrounded by other
- * HTML elements instead of direct text nodes.
- * @param {Element} element
- * @return {boolean}
- */
-/* c8 ignore start */
-function elementIsInTextBlock(element) {
-  const {display} = getComputedStyle(element);
-  if (display !== 'inline' && display !== 'inline-block') {
-    return false;
-  }
-
-  if (hasTextNodeSiblingsFormingTextBlock(element)) {
-    return true;
-  } else if (element.parentElement) {
-    return elementIsInTextBlock(element.parentElement);
-  } else {
-    return false;
-  }
-}
-/* c8 ignore stop */
-
-/**
- * @param {Element} el
- * @param {{x: number, y: number}} elCenterPoint
- */
-/* c8 ignore start */
-function elementCenterIsAtZAxisTop(el, elCenterPoint) {
-  const viewportHeight = window.innerHeight;
-  const targetScrollY = Math.floor(elCenterPoint.y / viewportHeight) * viewportHeight;
-  if (window.scrollY !== targetScrollY) {
-    window.scrollTo(0, targetScrollY);
-  }
-
-  const topEl = document.elementFromPoint(
-    elCenterPoint.x,
-    elCenterPoint.y - window.scrollY
-  );
-
-  return topEl === el || el.contains(topEl);
-}
-/* c8 ignore stop */
-
-/**
- * Finds all position sticky/absolute elements on the page and adds a class
- * that disables pointer events on them.
- * @param {string} className
- * @return {() => void} - undo function to re-enable pointer events
- */
-/* c8 ignore start */
-function disableFixedAndStickyElementPointerEvents(className) {
-  document.querySelectorAll('*').forEach(el => {
-    const position = getComputedStyle(el).position;
-    if (position === 'fixed' || position === 'sticky') {
-      el.classList.add(className);
-    }
-  });
-
-  return function undo() {
-    Array.from(document.getElementsByClassName(className)).forEach(el => {
-      el.classList.remove(className);
-    });
-  };
-}
-/* c8 ignore stop */
-
-/**
- * @param {string} tapTargetsSelector
- * @param {string} className
- * @return {LH.Artifacts.TapTarget[]}
- */
-/* c8 ignore start */
-function gatherTapTargets(tapTargetsSelector, className) {
-  /** @type {LH.Artifacts.TapTarget[]} */
-  const targets = [];
-
-  // Capture element positions relative to the top of the page
-  window.scrollTo(0, 0);
-
-  /** @type {HTMLElement[]} */
-  // @ts-expect-error - getElementsInDocument put into scope via stringification
-  const tapTargetElements = getElementsInDocument(tapTargetsSelector);
-
-  /** @type {{
-    tapTargetElement: Element,
-    clientRects: LH.Artifacts.Rect[]
-  }[]} */
-  const tapTargetsWithClientRects = [];
-  tapTargetElements.forEach(tapTargetElement => {
-    // Filter out tap targets that are likely to cause false failures:
-    if (elementHasAncestorTapTarget(tapTargetElement, tapTargetsSelector)) {
-      // This is usually intentional, either the tap targets trigger the same action
-      // or there's a child with a related action (like a delete button for an item)
-      return;
-    }
-    if (elementIsInTextBlock(tapTargetElement)) {
-      // Links inside text blocks cause a lot of failures, and there's also an exception for them
-      // in the Web Content Accessibility Guidelines https://www.w3.org/TR/WCAG21/#target-size
-      return;
-    }
-    if (!elementIsVisible(tapTargetElement)) {
-      return;
-    }
-
-    tapTargetsWithClientRects.push({
-      tapTargetElement,
-      clientRects: getClientRects(tapTargetElement),
-    });
-  });
-
-  // Disable pointer events so that tap targets below them don't get
-  // detected as non-tappable (they are tappable, just not while the viewport
-  // is at the current scroll position)
-  const reenableFixedAndStickyElementPointerEvents =
-    disableFixedAndStickyElementPointerEvents(className);
-
-  /** @type {{
-    tapTargetElement: Element,
-    visibleClientRects: LH.Artifacts.Rect[]
-  }[]} */
-  const tapTargetsWithVisibleClientRects = [];
-  // We use separate loop here to get visible client rects because that involves
-  // scrolling around the page for elementCenterIsAtZAxisTop, which would affect the
-  // client rect positions.
-  tapTargetsWithClientRects.forEach(({tapTargetElement, clientRects}) => {
-    // Filter out empty client rects
-    let visibleClientRects = clientRects.filter(cr => cr.width !== 0 && cr.height !== 0);
-
-    // Filter out client rects that are invisible, e.g because they are in a position absolute element
-    // with a lower z-index than the main content.
-    // This will also filter out all position fixed or sticky tap targets elements because we disable pointer
-    // events on them before running this. That's the correct behavior because whether a position fixed/stick
-    // element overlaps with another tap target depends on the scroll position.
-    visibleClientRects = visibleClientRects.filter(rect => {
-      // Just checking the center can cause false failures for large partially hidden tap targets,
-      // but that should be a rare edge case
-      // @ts-expect-error - put into scope via stringification
-      const rectCenterPoint = getRectCenterPoint(rect);
-      return elementCenterIsAtZAxisTop(tapTargetElement, rectCenterPoint);
-    });
-
-    if (visibleClientRects.length > 0) {
-      tapTargetsWithVisibleClientRects.push({
-        tapTargetElement,
-        visibleClientRects,
-      });
-    }
-  });
-
-  for (const {tapTargetElement, visibleClientRects} of tapTargetsWithVisibleClientRects) {
-    targets.push({
-      clientRects: visibleClientRects,
-      href: /** @type {HTMLAnchorElement} */(tapTargetElement)['href'] || '',
-      // @ts-expect-error - getNodeDetails put into scope via stringification
-      node: getNodeDetails(tapTargetElement),
-    });
-  }
-
-  reenableFixedAndStickyElementPointerEvents();
-
-  return targets;
-}
-
-/**
- * @param {string} tapTargetsSelector
- * @param {string} className
- * @return {LH.Artifacts.TapTarget[]}
- */
-function gatherTapTargetsAndResetScroll(tapTargetsSelector, className) {
-  const originalScrollPosition = {
-    x: window.scrollX,
-    y: window.scrollY,
-  };
-
-  try {
-    return gatherTapTargets(tapTargetsSelector, className);
-  } finally {
-    window.scrollTo(originalScrollPosition.x, originalScrollPosition.y);
-  }
-}
-/* c8 ignore stop */
-
-class TapTargets extends BaseGatherer {
-  constructor() {
-    super();
-    /**
-     * This needs to be in the constructor.
-     * https://github.com/GoogleChrome/lighthouse/issues/12134
-     * @type {LH.Gatherer.GathererMeta}
-     */
-    this.meta = {
-      supportedModes: ['snapshot', 'navigation'],
-    };
-  }
-
-  /**
-   * @param {LH.Gatherer.ProtocolSession} session
-   * @param {string} className
-   * @return {Promise<string>}
-   */
-  async addStyleRule(session, className) {
-    const frameTreeResponse = await session.sendCommand('Page.getFrameTree');
-    const {styleSheetId} = await session.sendCommand('CSS.createStyleSheet', {
-      frameId: frameTreeResponse.frameTree.frame.id,
-    });
-    const ruleText = `.${className} { pointer-events: none !important }`;
-    await session.sendCommand('CSS.setStyleSheetText', {
-      styleSheetId,
-      text: ruleText,
-    });
-    return styleSheetId;
-  }
-
-  /**
-   * @param {LH.Gatherer.ProtocolSession} session
-   * @param {string} styleSheetId
-   */
-  async removeStyleRule(session, styleSheetId) {
-    await session.sendCommand('CSS.setStyleSheetText', {
-      styleSheetId,
-      text: '',
-    });
-  }
-
-  /**
-   * @param {LH.Gatherer.Context} passContext
-   * @return {Promise<LH.Artifacts.TapTarget[]>} All visible tap targets with their positions and sizes
-   */
-  async getArtifact(passContext) {
-    const session = passContext.driver.defaultSession;
-    await session.sendCommand('DOM.enable');
-    await session.sendCommand('CSS.enable');
-
-    const className = 'lighthouse-disable-pointer-events';
-    const styleSheetId = await this.addStyleRule(session, className);
-
-    const tapTargets =
-      await passContext.driver.executionContext.evaluate(gatherTapTargetsAndResetScroll, {
-        args: [tapTargetsSelector, className],
-        useIsolation: true,
-        deps: [
-          pageFunctions.getNodeDetails,
-          pageFunctions.getElementsInDocument,
-          disableFixedAndStickyElementPointerEvents,
-          elementIsVisible,
-          elementHasAncestorTapTarget,
-          elementCenterIsAtZAxisTop,
-          getClientRects,
-          hasTextNodeSiblingsFormingTextBlock,
-          elementIsInTextBlock,
-          RectHelpers.getRectCenterPoint,
-          pageFunctions.getNodePath,
-          pageFunctions.getNodeSelector,
-          pageFunctions.getNodeLabel,
-          gatherTapTargets,
-        ],
-      });
-
-    await this.removeStyleRule(session, styleSheetId);
-
-    await session.sendCommand('CSS.disable');
-    await session.sendCommand('DOM.disable');
-
-    return tapTargets;
-  }
-}
-
-export default TapTargets;

package/core/gather/gatherers/service-worker.d.ts

@@ -1,10 +0,0 @@
-export default ServiceWorker;
-declare class ServiceWorker extends BaseGatherer {
-    /**
-     * @param {LH.Gatherer.Context} context
-     * @return {Promise<LH.Artifacts['ServiceWorker']>}
-     */
-    getArtifact(context: LH.Gatherer.Context): Promise<LH.Artifacts['ServiceWorker']>;
-}
-import BaseGatherer from '../base-gatherer.js';
-//# sourceMappingURL=service-worker.d.ts.map

package/core/gather/gatherers/service-worker.js

@@ -1,32 +0,0 @@
-/**
- * @license
- * Copyright 2016 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-import BaseGatherer from '../base-gatherer.js';
-import * as serviceWorkers from '../driver/service-workers.js';
-
-class ServiceWorker extends BaseGatherer {
-  /** @type {LH.Gatherer.GathererMeta} */
-  meta = {
-    supportedModes: ['navigation'],
-  };
-
-  /**
-   * @param {LH.Gatherer.Context} context
-   * @return {Promise<LH.Artifacts['ServiceWorker']>}
-   */
-  async getArtifact(context) {
-    const session = context.driver.defaultSession;
-    const {versions} = await serviceWorkers.getServiceWorkerVersions(session);
-    const {registrations} = await serviceWorkers.getServiceWorkerRegistrations(session);
-
-    return {
-      versions,
-      registrations,
-    };
-  }
-}
-
-export default ServiceWorker;

package/core/gather/gatherers/web-app-manifest.d.ts

@@ -1,32 +0,0 @@
-export default WebAppManifest;
-declare class WebAppManifest extends BaseGatherer {
-    /**
-     * @param {LH.Gatherer.ProtocolSession} session
-     * @return {Promise<{url: string, data: string}|null>}
-     */
-    static fetchAppManifest(session: LH.Gatherer.ProtocolSession): Promise<{
-        url: string;
-        data: string;
-    } | null>;
-    /**
-     * Uses the debugger protocol to fetch the manifest from within the context of
-     * the target page, reusing any credentials, emulation, etc, already established
-     * there.
-     *
-     * Returns the parsed manifest or null if the page had no manifest. If the manifest
-     * was unparseable as JSON, manifest.value will be undefined and manifest.warning
-     * will have the reason. See manifest-parser.js for more information.
-     *
-     * @param {LH.Gatherer.ProtocolSession} session
-     * @param {string} pageUrl
-     * @return {Promise<LH.Artifacts.Manifest|null>}
-     */
-    static getWebAppManifest(session: LH.Gatherer.ProtocolSession, pageUrl: string): Promise<LH.Artifacts.Manifest | null>;
-    /**
-     * @param {LH.Gatherer.Context} context
-     * @return {Promise<LH.Artifacts['WebAppManifest']>}
-     */
-    getArtifact(context: LH.Gatherer.Context): Promise<LH.Artifacts['WebAppManifest']>;
-}
-import BaseGatherer from '../base-gatherer.js';
-//# sourceMappingURL=web-app-manifest.d.ts.map

package/core/gather/gatherers/web-app-manifest.js

@@ -1,106 +0,0 @@
-/**
- * @license
- * Copyright 2021 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-import log from 'lighthouse-logger';
-
-import {parseManifest} from '../../lib/manifest-parser.js';
-import BaseGatherer from '../base-gatherer.js';
-
-class WebAppManifest extends BaseGatherer {
-  /** @type {LH.Gatherer.GathererMeta} */
-  meta = {
-    supportedModes: ['snapshot', 'navigation'],
-  };
-
-  /**
-   * @param {LH.Gatherer.ProtocolSession} session
-   * @return {Promise<{url: string, data: string}|null>}
-   */
-  static async fetchAppManifest(session) {
-    // In all environments but LR, Page.getAppManifest finishes very quickly.
-    // In LR, there is a bug that causes this command to hang until outgoing
-    // requests finish. This has been seen in long polling (where it will never
-    // return) and when other requests take a long time to finish. We allow 10 seconds
-    // for outgoing requests to finish. Anything more, and we continue the run without
-    // a manifest.
-    // Googlers, see: http://b/124008171
-    session.setNextProtocolTimeout(10000);
-    let response;
-    try {
-      response = await session.sendCommand('Page.getAppManifest');
-    } catch (err) {
-      if (err.code === 'PROTOCOL_TIMEOUT') {
-        // LR will timeout fetching the app manifest in some cases, move on without one.
-        // https://github.com/GoogleChrome/lighthouse/issues/7147#issuecomment-461210921
-        log.error('WebAppManifest', 'Failed fetching manifest', err);
-        return null;
-      }
-
-      throw err;
-    }
-
-    let data = response.data;
-
-    // We're not reading `response.errors` however it may contain critical and noncritical
-    // errors from Blink's manifest parser:
-    //   https://chromedevtools.github.io/debugger-protocol-viewer/tot/Page/#type-AppManifestError
-    if (!data) {
-      // If the data is empty, the page had no manifest.
-      return null;
-    }
-
-    const BOM_LENGTH = 3;
-    const BOM_FIRSTCHAR = 65279;
-    const isBomEncoded = data.charCodeAt(0) === BOM_FIRSTCHAR;
-
-    if (isBomEncoded) {
-      data = Buffer.from(data)
-        .slice(BOM_LENGTH)
-        .toString();
-    }
-
-    return {...response, data};
-  }
-
-  /**
-   * Uses the debugger protocol to fetch the manifest from within the context of
-   * the target page, reusing any credentials, emulation, etc, already established
-   * there.
-   *
-   * Returns the parsed manifest or null if the page had no manifest. If the manifest
-   * was unparseable as JSON, manifest.value will be undefined and manifest.warning
-   * will have the reason. See manifest-parser.js for more information.
-   *
-   * @param {LH.Gatherer.ProtocolSession} session
-   * @param {string} pageUrl
-   * @return {Promise<LH.Artifacts.Manifest|null>}
-   */
-  static async getWebAppManifest(session, pageUrl) {
-    const status = {msg: 'Get webapp manifest', id: 'lh:gather:getWebAppManifest'};
-    log.time(status);
-    const response = await WebAppManifest.fetchAppManifest(session);
-    if (!response) return null;
-    const manifest = parseManifest(response.data, response.url, pageUrl);
-    log.timeEnd(status);
-    return manifest;
-  }
-
-  /**
-   * @param {LH.Gatherer.Context} context
-   * @return {Promise<LH.Artifacts['WebAppManifest']>}
-   */
-  async getArtifact(context) {
-    const driver = context.driver;
-    const {finalDisplayedUrl} = context.baseArtifacts.URL;
-    try {
-      return await WebAppManifest.getWebAppManifest(driver.defaultSession, finalDisplayedUrl);
-    } catch {
-      return null;
-    }
-  }
-}
-
-export default WebAppManifest;

package/report/renderer/pwa-category-renderer.d.ts

@@ -1,55 +0,0 @@
-export class PwaCategoryRenderer extends CategoryRenderer {
-    /**
-     * Alters SVG id references so multiple instances of an SVG element can coexist
-     * in a single page. If `svgRoot` has a `<defs>` block, gives all elements defined
-     * in it unique ids, then updates id references (`<use xlink:href="...">`,
-     * `fill="url(#...)"`) to the altered ids in all descendents of `svgRoot`.
-     * @param {SVGElement} svgRoot
-     */
-    static _makeSvgReferencesUnique(svgRoot: SVGElement): void;
-    /**
-     * @param {LH.ReportResult.Category} category
-     * @param {Object<string, LH.Result.ReportGroup>} [groupDefinitions]
-     * @return {Element}
-     */
-    render(category: LH.ReportResult.Category, groupDefinitions?: {
-        [x: string]: import("../../types/lhr/lhr.js").default.ReportGroup;
-    } | undefined): Element;
-    /**
-     * @param {LH.ReportResult.Category} category
-     * @param {Record<string, LH.Result.ReportGroup>} groupDefinitions
-     * @return {DocumentFragment}
-     */
-    renderCategoryScore(category: LH.ReportResult.Category, groupDefinitions: Record<string, LH.Result.ReportGroup>): DocumentFragment;
-    /**
-     * Returns the group IDs found in auditRefs.
-     * @param {Array<LH.ReportResult.AuditRef>} auditRefs
-     * @return {!Set<string>}
-     */
-    _getGroupIds(auditRefs: Array<LH.ReportResult.AuditRef>): Set<string>;
-    /**
-     * Returns the group IDs whose audits are all considered passing.
-     * @param {Array<LH.ReportResult.AuditRef>} auditRefs
-     * @return {Set<string>}
-     */
-    _getPassingGroupIds(auditRefs: Array<LH.ReportResult.AuditRef>): Set<string>;
-    /**
-     * Returns a tooltip string summarizing group pass rates.
-     * @param {Array<LH.ReportResult.AuditRef>} auditRefs
-     * @param {Record<string, LH.Result.ReportGroup>} groupDefinitions
-     * @return {string}
-     */
-    _getGaugeTooltip(auditRefs: Array<LH.ReportResult.AuditRef>, groupDefinitions: Record<string, LH.Result.ReportGroup>): string;
-    /**
-     * Render non-manual audits in groups, giving a badge to any group that has
-     * all passing audits.
-     * @param {Array<LH.ReportResult.AuditRef>} auditRefs
-     * @param {Object<string, LH.Result.ReportGroup>} groupDefinitions
-     * @return {Element}
-     */
-    _renderAudits(auditRefs: Array<LH.ReportResult.AuditRef>, groupDefinitions: {
-        [x: string]: LH.Result.ReportGroup;
-    }): Element;
-}
-import { CategoryRenderer } from './category-renderer.js';
-//# sourceMappingURL=pwa-category-renderer.d.ts.map