From 8760159c523deb022b2da42a0f14ee0972f8cadd Mon Sep 17 00:00:00 2001 From: Barry Pollard Date: Fri, 27 Sep 2024 00:31:44 +0100 Subject: [PATCH] Remove onFID (#519) --- README.md | 72 +----- package.json | 9 - src/attribution/deprecated.ts | 26 --- src/attribution/index.ts | 1 - src/attribution/onFID.ts | 62 ----- src/deprecated.ts | 23 -- src/index.ts | 1 - src/lib/polyfills/firstInputPolyfill.ts | 2 +- src/onFID.ts | 105 --------- src/types.ts | 1 - src/types/base.ts | 5 +- src/types/fid.ts | 65 ------ test/e2e/onFID-test.js | 289 ------------------------ test/unit/attribution-test.js | 5 +- test/unit/index-test.js | 5 +- test/views/fid.njk | 37 --- 16 files changed, 7 insertions(+), 701 deletions(-) delete mode 100644 src/attribution/deprecated.ts delete mode 100644 src/attribution/onFID.ts delete mode 100644 src/deprecated.ts delete mode 100644 src/onFID.ts delete mode 100644 src/types/fid.ts delete mode 100644 test/e2e/onFID-test.js delete mode 100644 test/views/fid.njk diff --git a/README.md b/README.md index 639684f5..fa49edde 100644 --- a/README.md +++ b/README.md @@ -42,10 +42,6 @@ The library supports all of the [Core Web Vitals](https://web.dev/articles/vital - [First Contentful Paint (FCP)](https://web.dev/articles/fcp) - [Time to First Byte (TTFB)](https://web.dev/articles/ttfb) -- [First Input Delay (FID)](https://web.dev/articles/fid) - -> [!CAUTION] -> FID is deprecated and will be removed in the next major release. @@ -210,8 +206,8 @@ Note that some of these metrics will not report until the user has interacted wi Also, in some cases a metric callback may never be called: -- FID and INP are not reported if the user never interacts with the page. -- CLS, FCP, FID, and LCP are not reported if the page was loaded in the background. +- INP is not reported if the user never interacts with the page. +- CLS, FCP, and LCP are not reported if the page was loaded in the background. In other cases, a metric callback may be called more than once: @@ -504,7 +500,7 @@ interface Metric { /** * The name of the metric (in acronym form). */ - name: 'CLS' | 'FCP' | 'FID' | 'INP' | 'LCP' | 'TTFB'; + name: 'CLS' | 'FCP' | 'INP' | 'LCP' | 'TTFB'; /** * The current value of the metric. @@ -583,18 +579,6 @@ interface FCPMetric extends Metric { } ``` -##### `FIDMetric` - -> [!CAUTION] -> This interface is deprecated and will be removed in the next major release. - -```ts -interface FIDMetric extends Metric { - name: 'FID'; - entries: PerformanceEventTiming[]; -} -``` - ##### `INPMetric` ```ts @@ -701,20 +685,6 @@ function onFCP(callback: (metric: FCPMetric) => void, opts?: ReportOpts): void; Calculates the [FCP](https://web.dev/articles/fcp) value for the current page and calls the `callback` function once the value is ready, along with the relevant `paint` performance entry used to determine the value. The reported value is a [`DOMHighResTimeStamp`](https://developer.mozilla.org/docs/Web/API/DOMHighResTimeStamp). -#### `onFID()` - -> [!CAUTION] -> This function is deprecated and will be removed in the next major release. - -```ts -function onFID(callback: (metric: FIDMetric) => void, opts?: ReportOpts): void; -``` - -Calculates the [FID](https://web.dev/articles/fid) value for the current page and calls the `callback` function once the value is ready, along with the relevant `first-input` performance entry used to determine the value. The reported value is a [`DOMHighResTimeStamp`](https://developer.mozilla.org/docs/Web/API/DOMHighResTimeStamp). - -> [!IMPORTANT] -> Since FID is only reported after the user interacts with the page, it's possible that it will not be reported for some page loads. - #### `onINP()` ```ts @@ -867,41 +837,6 @@ interface FCPAttribution { } ``` -#### `FIDAttribution` - -> [!CAUTION] -> This interface is deprecated and will be removed in the next major release. - -```ts -interface FIDAttribution { - /** - * A selector identifying the element that the user interacted with. This - * element will be the `target` of the `event` dispatched. - */ - eventTarget: string; - /** - * The time when the user interacted. This time will match the `timeStamp` - * value of the `event` dispatched. - */ - eventTime: number; - /** - * The `type` of the `event` dispatched from the user interaction. - */ - eventType: string; - /** - * The `PerformanceEventTiming` entry corresponding to FID. - */ - eventEntry: PerformanceEventTiming; - /** - * The loading state of the document at the time when the first interaction - * occurred (see `LoadState` for details). If the first interaction occurred - * while the document was loading and executing script (e.g. usually in the - * `dom-interactive` phase) it can result in long input delays. - */ - loadState: LoadState; -} -``` - #### `INPAttribution` ```ts @@ -1095,7 +1030,6 @@ Browser support for each function is as follows: - `onCLS()`: Chromium - `onFCP()`: Chromium, Firefox, Safari -- `onFID()`: Chromium, Firefox _(Deprecated)_ - `onINP()`: Chromium - `onLCP()`: Chromium, Firefox - `onTTFB()`: Chromium, Firefox, Safari diff --git a/package.json b/package.json index ca57344a..fc09f413 100644 --- a/package.json +++ b/package.json @@ -31,10 +31,6 @@ "types": "./dist/modules/onFCP.d.ts", "default": "./dist/modules/onFCP.js" }, - "./onFID.js": { - "types": "./dist/modules/onFID.d.ts", - "default": "./dist/modules/onFID.js" - }, "./onINP.js": { "types": "./dist/modules/onINP.d.ts", "default": "./dist/modules/onINP.js" @@ -55,10 +51,6 @@ "types": "./dist/modules/attribution/onFCP.d.ts", "default": "./dist/modules/attribution/onFCP.js" }, - "./attribution/onFID.js": { - "types": "./dist/modules/attribution/onFID.d.ts", - "default": "./dist/modules/attribution/onFID.js" - }, "./attribution/onINP.js": { "types": "./dist/modules/attribution/onINP.d.ts", "default": "./dist/modules/attribution/onINP.js" @@ -110,7 +102,6 @@ "Core Web Vitals", "CLS", "FCP", - "FID", "INP", "LCP", "TTFB" diff --git a/src/attribution/deprecated.ts b/src/attribution/deprecated.ts deleted file mode 100644 index 826ebfc9..00000000 --- a/src/attribution/deprecated.ts +++ /dev/null @@ -1,26 +0,0 @@ -/* - * Copyright 2024 Google LLC - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export { - /** - * @deprecated Use `onINP()` instead. - */ - onFID, -} from './onFID.js'; - -export {FIDThresholds} from '../onFID.js'; - -export * from '../types.js'; diff --git a/src/attribution/index.ts b/src/attribution/index.ts index c0362821..24b60aae 100644 --- a/src/attribution/index.ts +++ b/src/attribution/index.ts @@ -26,5 +26,4 @@ export {INPThresholds} from '../onINP.js'; export {LCPThresholds} from '../onLCP.js'; export {TTFBThresholds} from '../onTTFB.js'; -export * from './deprecated.js'; export * from '../types.js'; diff --git a/src/attribution/onFID.ts b/src/attribution/onFID.ts deleted file mode 100644 index ed561429..00000000 --- a/src/attribution/onFID.ts +++ /dev/null @@ -1,62 +0,0 @@ -/* - * Copyright 2022 Google LLC - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import {getLoadState} from '../lib/getLoadState.js'; -import {getSelector} from '../lib/getSelector.js'; -import {onFID as unattributedOnFID} from '../onFID.js'; -import { - FIDAttribution, - FIDMetric, - FIDMetricWithAttribution, - ReportOpts, -} from '../types.js'; - -const attributeFID = (metric: FIDMetric): FIDMetricWithAttribution => { - const fidEntry = metric.entries[0]; - const attribution: FIDAttribution = { - eventTarget: getSelector(fidEntry.target), - eventType: fidEntry.name, - eventTime: fidEntry.startTime, - eventEntry: fidEntry, - loadState: getLoadState(fidEntry.startTime), - }; - - // Use Object.assign to set property to keep tsc happy. - const metricWithAttribution: FIDMetricWithAttribution = Object.assign( - metric, - {attribution}, - ); - return metricWithAttribution; -}; - -/** - * Calculates the [FID](https://web.dev/articles/fid) value for the current page and - * calls the `callback` function once the value is ready, along with the - * relevant `first-input` performance entry used to determine the value. The - * reported value is a `DOMHighResTimeStamp`. - * - * _**Important:** since FID is only reported after the user interacts with the - * page, it's possible that it will not be reported for some page loads._ - */ -export const onFID = ( - onReport: (metric: FIDMetricWithAttribution) => void, - opts?: ReportOpts, -) => { - unattributedOnFID((metric: FIDMetric) => { - const metricWithAttribution = attributeFID(metric); - onReport(metricWithAttribution); - }, opts); -}; diff --git a/src/deprecated.ts b/src/deprecated.ts deleted file mode 100644 index 1acc67e3..00000000 --- a/src/deprecated.ts +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Copyright 2022 Google LLC - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -export { - /** - * @deprecated Use `onINP()` instead. - */ - onFID, - FIDThresholds, -} from './onFID.js'; diff --git a/src/index.ts b/src/index.ts index 6c5dc45d..0fe32bb0 100644 --- a/src/index.ts +++ b/src/index.ts @@ -20,5 +20,4 @@ export {onINP, INPThresholds} from './onINP.js'; export {onLCP, LCPThresholds} from './onLCP.js'; export {onTTFB, TTFBThresholds} from './onTTFB.js'; -export * from './deprecated.js'; export * from './types.js'; diff --git a/src/lib/polyfills/firstInputPolyfill.ts b/src/lib/polyfills/firstInputPolyfill.ts index 804c4238..a18972e0 100644 --- a/src/lib/polyfills/firstInputPolyfill.ts +++ b/src/lib/polyfills/firstInputPolyfill.ts @@ -99,7 +99,7 @@ const reportFirstInputDelayIfRecordedAndValid = () => { * Pointer events can trigger main or compositor thread behavior. * We differentiate these cases based on whether or not we see a * 'pointercancel' event, which are fired when we scroll. If we're scrolling - * we don't need to report input delay since FID excludes scrolling and + * we don't need to report input delay since INP excludes scrolling and * pinch/zooming. */ const onPointerDown = (delay: number, event: Event) => { diff --git a/src/onFID.ts b/src/onFID.ts deleted file mode 100644 index cde84b9d..00000000 --- a/src/onFID.ts +++ /dev/null @@ -1,105 +0,0 @@ -/* - * Copyright 2020 Google LLC - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import {onBFCacheRestore} from './lib/bfcache.js'; -import {bindReporter} from './lib/bindReporter.js'; -import {getVisibilityWatcher} from './lib/getVisibilityWatcher.js'; -import {initMetric} from './lib/initMetric.js'; -import {observe} from './lib/observe.js'; -import {onHidden} from './lib/onHidden.js'; -import { - firstInputPolyfill, - resetFirstInputPolyfill, -} from './lib/polyfills/firstInputPolyfill.js'; -import {runOnce} from './lib/runOnce.js'; -import {whenActivated} from './lib/whenActivated.js'; -import { - FIDMetric, - FirstInputPolyfillCallback, - MetricRatingThresholds, - ReportOpts, -} from './types.js'; - -/** Thresholds for FID. See https://web.dev/articles/fid#what_is_a_good_fid_score */ -export const FIDThresholds: MetricRatingThresholds = [100, 300]; - -/** - * Calculates the [FID](https://web.dev/articles/fid) value for the current page and - * calls the `callback` function once the value is ready, along with the - * relevant `first-input` performance entry used to determine the value. The - * reported value is a `DOMHighResTimeStamp`. - * - * _**Important:** since FID is only reported after the user interacts with the - * page, it's possible that it will not be reported for some page loads._ - */ -export const onFID = ( - onReport: (metric: FIDMetric) => void, - opts?: ReportOpts, -) => { - // Set defaults - opts = opts || {}; - - whenActivated(() => { - const visibilityWatcher = getVisibilityWatcher(); - let metric = initMetric('FID'); - let report: ReturnType; - - const handleEntry = (entry: PerformanceEventTiming) => { - // Only report if the page wasn't hidden prior to the first input. - if (entry.startTime < visibilityWatcher.firstHiddenTime) { - metric.value = entry.processingStart - entry.startTime; - metric.entries.push(entry); - report(true); - } - }; - - const handleEntries = (entries: FIDMetric['entries']) => { - entries.forEach(handleEntry); - }; - - const po = observe('first-input', handleEntries); - - report = bindReporter( - onReport, - metric, - FIDThresholds, - opts!.reportAllChanges, - ); - - if (po) { - onHidden( - runOnce(() => { - handleEntries(po.takeRecords() as FIDMetric['entries']); - po.disconnect(); - }), - ); - - onBFCacheRestore(() => { - metric = initMetric('FID'); - report = bindReporter( - onReport, - metric, - FIDThresholds, - opts!.reportAllChanges, - ); - - // Browsers don't re-emit FID on bfcache restore so fake it until you make it - resetFirstInputPolyfill(); - firstInputPolyfill(handleEntry as FirstInputPolyfillCallback); - }); - } - }); -}; diff --git a/src/types.ts b/src/types.ts index 92c44c63..2f1e2214 100644 --- a/src/types.ts +++ b/src/types.ts @@ -19,7 +19,6 @@ export * from './types/polyfills.js'; export * from './types/cls.js'; export * from './types/fcp.js'; -export * from './types/fid.js'; export * from './types/inp.js'; export * from './types/lcp.js'; export * from './types/ttfb.js'; diff --git a/src/types/base.ts b/src/types/base.ts index f883affc..fce16f2b 100644 --- a/src/types/base.ts +++ b/src/types/base.ts @@ -16,7 +16,6 @@ import type {CLSMetric, CLSMetricWithAttribution} from './cls.js'; import type {FCPMetric, FCPMetricWithAttribution} from './fcp.js'; -import type {FIDMetric, FIDMetricWithAttribution} from './fid.js'; import type {INPMetric, INPMetricWithAttribution} from './inp.js'; import type {LCPMetric, LCPMetricWithAttribution} from './lcp.js'; import type {TTFBMetric, TTFBMetricWithAttribution} from './ttfb.js'; @@ -25,7 +24,7 @@ export interface Metric { /** * The name of the metric (in acronym form). */ - name: 'CLS' | 'FCP' | 'FID' | 'INP' | 'LCP' | 'TTFB'; + name: 'CLS' | 'FCP' | 'INP' | 'LCP' | 'TTFB'; /** * The current value of the metric. @@ -87,7 +86,6 @@ export interface Metric { export type MetricType = | CLSMetric | FCPMetric - | FIDMetric | INPMetric | LCPMetric | TTFBMetric; @@ -96,7 +94,6 @@ export type MetricType = export type MetricWithAttribution = | CLSMetricWithAttribution | FCPMetricWithAttribution - | FIDMetricWithAttribution | INPMetricWithAttribution | LCPMetricWithAttribution | TTFBMetricWithAttribution; diff --git a/src/types/fid.ts b/src/types/fid.ts deleted file mode 100644 index 5b2dcba3..00000000 --- a/src/types/fid.ts +++ /dev/null @@ -1,65 +0,0 @@ -/* - * Copyright 2022 Google LLC - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import type {LoadState, Metric} from './base.js'; - -/** - * An FID-specific version of the Metric object. - */ -export interface FIDMetric extends Metric { - name: 'FID'; - entries: PerformanceEventTiming[]; -} - -/** - * An object containing potentially-helpful debugging information that - * can be sent along with the FID value for the current page visit in order - * to help identify issues happening to real-users in the field. - */ -export interface FIDAttribution { - /** - * A selector identifying the element that the user interacted with. This - * element will be the `target` of the `event` dispatched. - */ - eventTarget: string; - /** - * The time when the user interacted. This time will match the `timeStamp` - * value of the `event` dispatched. - */ - eventTime: number; - /** - * The `type` of the `event` dispatched from the user interaction. - */ - eventType: string; - /** - * The `PerformanceEventTiming` entry corresponding to FID. - */ - eventEntry: PerformanceEventTiming; - /** - * The loading state of the document at the time when the first interaction - * occurred (see `LoadState` for details). If the first interaction occurred - * while the document was loading and executing script (e.g. usually in the - * `dom-interactive` phase) it can result in long input delays. - */ - loadState: LoadState; -} - -/** - * An FID-specific version of the Metric object with attribution. - */ -export interface FIDMetricWithAttribution extends FIDMetric { - attribution: FIDAttribution; -} diff --git a/test/e2e/onFID-test.js b/test/e2e/onFID-test.js deleted file mode 100644 index bb11e813..00000000 --- a/test/e2e/onFID-test.js +++ /dev/null @@ -1,289 +0,0 @@ -/* - * Copyright 2020 Google LLC - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import assert from 'assert'; -import {beaconCountIs, clearBeacons, getBeacons} from '../utils/beacons.js'; -import {browserSupportsEntry} from '../utils/browserSupportsEntry.js'; -import {navigateTo} from '../utils/navigateTo.js'; -import {stubForwardBack} from '../utils/stubForwardBack.js'; -import {stubVisibilityChange} from '../utils/stubVisibilityChange.js'; - -describe('onFID()', async function () { - // Retry all tests in this suite up to 2 times. - this.retries(2); - - let browserSupportsFID; - before(async function () { - browserSupportsFID = await browserSupportsEntry('first-input'); - }); - - beforeEach(async function () { - await navigateTo('about:blank'); - await clearBeacons(); - }); - - it('reports the correct value after input', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid] = await getBeacons(); - assert(fid.value >= 0); - assert(fid.id.match(/^v4-\d+-\d+$/)); - assert.strictEqual(fid.name, 'FID'); - assert.strictEqual(fid.value, fid.delta); - assert.strictEqual(fid.rating, 'good'); - assert.match(fid.navigationType, /navigate|reload/); - assert.match(fid.entries[0].name, /(mouse|pointer)down/); - }); - - it('reports the correct value after input when script is loaded late', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid?loadAfterInput=1'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid] = await getBeacons(); - assert(fid.value >= 0); - assert(fid.id.match(/^v4-\d+-\d+$/)); - assert.strictEqual(fid.name, 'FID'); - assert.strictEqual(fid.value, fid.delta); - assert.strictEqual(fid.rating, 'good'); - assert.match(fid.navigationType, /navigate|reload/); - assert.match(fid.entries[0].name, /(mouse|pointer)down/); - }); - - it('does not report if the browser does not support FID', async function () { - if (browserSupportsFID) this.skip(); - - await navigateTo('/test/fid'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - // Wait a bit to ensure no beacons were sent. - await browser.pause(1000); - - const loadBeacons = await getBeacons(); - assert.strictEqual(loadBeacons.length, 0); - - await stubForwardBack(); - - // Assert no entries after bfcache restores either. - await h1.click(); - - // Wait a bit to ensure no beacons were sent. - await browser.pause(1000); - - const bfcacheRestoreBeacons = await getBeacons(); - assert.strictEqual(bfcacheRestoreBeacons.length, 0); - }); - - it('does not report if the document was hidden at page load time', async function () { - // Ignore Safari until this bug is fixed: - // https://bugs.webkit.org/show_bug.cgi?id=211101 - if (browser.capabilities.browserName === 'Safari') this.skip(); - - await navigateTo('/test/fid?hidden=1', {readyState: 'complete'}); - - await stubVisibilityChange('visible'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - // Wait a bit to ensure no beacons were sent. - await browser.pause(1000); - - const beacons = await getBeacons(); - assert.strictEqual(beacons.length, 0); - }); - - it('does not report if the document changes to hidden before the first input', async function () { - // Ignore Safari until this bug is fixed: - // https://bugs.webkit.org/show_bug.cgi?id=211101 - if (browser.capabilities.browserName === 'Safari') this.skip(); - - await navigateTo('/test/fid', {readyState: 'complete'}); - - await stubVisibilityChange('hidden'); - - // Returning to visible will also render the . - await stubVisibilityChange('visible'); - - // Click on the h1. - const h1 = await $('h1'); - await h1.click(); - - // Wait a bit to ensure no beacons were sent. - await browser.pause(1000); - - const beacons = await getBeacons(); - assert.strictEqual(beacons.length, 0); - }); - - it('reports the first input delay after bfcache restores', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid1] = await getBeacons(); - assert(fid1.value >= 0); - assert(fid1.id.match(/^v4-\d+-\d+$/)); - assert.strictEqual(fid1.name, 'FID'); - assert.strictEqual(fid1.value, fid1.delta); - assert.strictEqual(fid1.rating, 'good'); - assert.match(fid1.navigationType, /navigate|reload/); - assert.match(fid1.entries[0].name, /(mouse|pointer)down/); - - await clearBeacons(); - await stubForwardBack(); - - // Click on the

. - await h1.click(); - - await beaconCountIs(1); - - const [fid2] = await getBeacons(); - assert(fid2.value >= 0); - assert(fid2.id.match(/^v4-\d+-\d+$/)); - assert(fid1.id !== fid2.id); - assert.strictEqual(fid2.name, 'FID'); - assert.strictEqual(fid2.rating, 'good'); - assert.strictEqual(fid2.value, fid2.delta); - assert.strictEqual(fid2.navigationType, 'back-forward-cache'); - assert.match(fid2.entries[0].name, /(mouse|pointer)down/); - }); - - it('reports prerender as nav type for prerender', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid?prerender=1'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid] = await getBeacons(); - assert(fid.value >= 0); - assert(fid.id.match(/^v4-\d+-\d+$/)); - assert.strictEqual(fid.name, 'FID'); - assert.strictEqual(fid.value, fid.delta); - assert.strictEqual(fid.rating, 'good'); - assert.strictEqual(fid.navigationType, 'prerender'); - assert.match(fid.entries[0].name, /(mouse|pointer)down/); - }); - - it('reports restore as nav type for wasDiscarded', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid?wasDiscarded=1'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid] = await getBeacons(); - assert(fid.value >= 0); - assert(fid.id.match(/^v4-\d+-\d+$/)); - assert.strictEqual(fid.name, 'FID'); - assert.strictEqual(fid.value, fid.delta); - assert.strictEqual(fid.rating, 'good'); - assert.strictEqual(fid.navigationType, 'restore'); - assert.match(fid.entries[0].name, /(mouse|pointer)down/); - }); - - describe('attribution', function () { - it('includes attribution data on the metric object', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid?attribution=1'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid] = await getBeacons(); - assert(fid.value >= 0); - assert(fid.id.match(/^v4-\d+-\d+$/)); - assert.strictEqual(fid.name, 'FID'); - assert.strictEqual(fid.value, fid.delta); - assert.strictEqual(fid.rating, 'good'); - assert.match(fid.navigationType, /navigate|reload/); - assert.match(fid.entries[0].name, /(mouse|pointer)down/); - - // This value is frequently not set in Chrome for some reason, - // so just check that it's a string. - assert(typeof fid.attribution.eventTarget === 'string'); - assert.equal(fid.attribution.eventTime, fid.entries[0].startTime); - assert.equal(fid.attribution.eventType, fid.entries[0].name); - assert.deepEqual(fid.attribution.eventEntry, fid.entries[0]); - assert.equal(fid.attribution.loadState, 'complete'); - }); - - it('reports the domReadyState when input occurred', async function () { - if (!browserSupportsFID) this.skip(); - - await navigateTo('/test/fid?attribution=1&delayDCL=1000'); - - // Click on the

. - const h1 = await $('h1'); - await h1.click(); - - await beaconCountIs(1); - - const [fid1] = await getBeacons(); - assert.equal(fid1.attribution.loadState, 'dom-interactive'); - - await clearBeacons(); - - await navigateTo('/test/fid?attribution=1&delayResponse=1000'); - - // Click on the

. - const p = await $('p'); - await p.click(); - - await beaconCountIs(1); - - const [fid2] = await getBeacons(); - assert.equal(fid2.attribution.loadState, 'loading'); - }); - }); -}); diff --git a/test/unit/attribution-test.js b/test/unit/attribution-test.js index d96c75b2..0218fd5c 100644 --- a/test/unit/attribution-test.js +++ b/test/unit/attribution-test.js @@ -3,13 +3,11 @@ import assert from 'assert'; import { onCLS, onFCP, - onFID, onINP, onLCP, onTTFB, CLSThresholds, FCPThresholds, - FIDThresholds, INPThresholds, LCPThresholds, TTFBThresholds, @@ -17,7 +15,7 @@ import { describe('index', () => { it('exports Web Vitals metrics functions', () => { - [onCLS, onFCP, onFID, onINP, onLCP, onTTFB].forEach((onFn) => + [onCLS, onFCP, onINP, onLCP, onTTFB].forEach((onFn) => assert(typeof onFn === 'function'), ); }); @@ -25,7 +23,6 @@ describe('index', () => { it('exports Web Vitals metric thresholds', () => { assert.deepEqual(CLSThresholds, [0.1, 0.25]); assert.deepEqual(FCPThresholds, [1800, 3000]); - assert.deepEqual(FIDThresholds, [100, 300]); assert.deepEqual(INPThresholds, [200, 500]); assert.deepEqual(LCPThresholds, [2500, 4000]); assert.deepEqual(TTFBThresholds, [800, 1800]); diff --git a/test/unit/index-test.js b/test/unit/index-test.js index e85289aa..cceb87e9 100644 --- a/test/unit/index-test.js +++ b/test/unit/index-test.js @@ -3,13 +3,11 @@ import assert from 'assert'; import { onCLS, onFCP, - onFID, onINP, onLCP, onTTFB, CLSThresholds, FCPThresholds, - FIDThresholds, INPThresholds, LCPThresholds, TTFBThresholds, @@ -17,7 +15,7 @@ import { describe('index', () => { it('exports Web Vitals metrics functions', () => { - [onCLS, onFCP, onFID, onINP, onLCP, onTTFB].forEach((onFn) => + [onCLS, onFCP, onINP, onLCP, onTTFB].forEach((onFn) => assert(typeof onFn === 'function'), ); }); @@ -25,7 +23,6 @@ describe('index', () => { it('exports Web Vitals metric thresholds', () => { assert.deepEqual(CLSThresholds, [0.1, 0.25]); assert.deepEqual(FCPThresholds, [1800, 3000]); - assert.deepEqual(FIDThresholds, [100, 300]); assert.deepEqual(INPThresholds, [200, 500]); assert.deepEqual(LCPThresholds, [2500, 4000]); assert.deepEqual(TTFBThresholds, [800, 1800]); diff --git a/test/views/fid.njk b/test/views/fid.njk deleted file mode 100644 index 560a5228..00000000 --- a/test/views/fid.njk +++ /dev/null @@ -1,37 +0,0 @@ - - -{% extends 'layout.njk' %} - -{% block content %} -

FID Test

-

- -

- -

Navigate away

- - -{% endblock %}