diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md index 93eeec32..dba1153c 100644 --- a/cli/CHANGELOG.md +++ b/cli/CHANGELOG.md @@ -10,6 +10,7 @@ Format based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/). The CL ### Fixed - The markdown report escapes the message of an error in the New errors and Fixed errors lists of `--baseline`, as it does in its Errors and warnings list and in its tables. They printed the message as it came, so GitHub dropped the `` of `1 blocking script(s) in ` there, and a line break in a message could start a heading or another list item. +- The human and markdown reports say `not supported` and why for a snippet whose API the browser lacks, a result with the `unsupported` status. They printed it as a metric without a value: `undefined` as its value, and `· undefined` as its status in the markdown table. --- diff --git a/cli/src/reporters/human.js b/cli/src/reporters/human.js index de580dab..96618e3b 100644 --- a/cli/src/reporters/human.js +++ b/cli/src/reporters/human.js @@ -148,6 +148,11 @@ function renderResult(r, verbose) { return ` ${styleText("dim", "·")} ${pad(r.id, 16)} ${styleText("dim", `not measured: ${r.message ?? "nothing recorded"}`)}`; } + // The browser lacks the API the snippet reads, so there is no value to show + if (r.status === "unsupported") { + return ` ${styleText("dim", "·")} ${pad(r.id, 16)} ${styleText("dim", `not supported: ${r.error ?? "the browser lacks the API"}`)}`; + } + if (r.script === "Fonts-Preloaded-Loaded-and-used-above-the-fold") { return renderFontsResult(r); } diff --git a/cli/src/reporters/markdown.js b/cli/src/reporters/markdown.js index 5762b6d8..5c0b33bd 100644 --- a/cli/src/reporters/markdown.js +++ b/cli/src/reporters/markdown.js @@ -48,6 +48,11 @@ function renderNotMeasuredRow(r) { return `| ${r.id} | · not measured | ${cell(r.message ?? "nothing recorded")} |`; } +// The browser lacks the API the snippet reads, so there is no value to show +function renderUnsupportedRow(r) { + return `| ${r.id} | · not supported | ${cell(r.error ?? "the browser lacks the API")} |`; +} + // A result with a count and no value: its count, and its first numbers as the human report gives them function renderSummaryRow(r) { return `| ${r.id} | · ${r.count ?? ""} | ${summaryNumbers(r).join(" · ")} |`; @@ -57,6 +62,7 @@ function renderRow(r) { if (r.status === "skipped") return renderSkippedRow(r); if (r.status === "error") return renderErrorRow(r); if (r.status === "tracking") return renderNotMeasuredRow(r); + if (r.status === "unsupported") return renderUnsupportedRow(r); if (Array.isArray(r.issues)) return renderAuditRow(r); if (isSummaryResult(r)) return renderSummaryRow(r); return renderMetricRow(r); diff --git a/cli/tests/unit/reporters.test.js b/cli/tests/unit/reporters.test.js index 90c96594..7bfc869c 100644 --- a/cli/tests/unit/reporters.test.js +++ b/cli/tests/unit/reporters.test.js @@ -800,3 +800,28 @@ describe("the details of each result in the markdown report", () => { expect(output).not.toContain("
"); }); }); + +describe("a result of a browser without the API", () => { + const unsupported = { + url: "https://example.com", + navMs: 850, + results: [ + { id: "LCP", script: "LCP", status: "unsupported", error: "largest-contentful-paint entries not supported in this browser" }, + { id: "INP", script: "INP", status: "unsupported" }, + ], + }; + + it("shows in the human report as not supported with its reason, and not as a value", () => { + const output = reportHuman(unsupported); + expect(output).toMatch(/LCP\s+.*not supported: largest-contentful-paint entries not supported in this browser/); + expect(output).toMatch(/INP\s+.*not supported: the browser lacks the API/); + expect(output).not.toContain("undefined"); + }); + + it("shows in the markdown report as not supported with its reason, and not as a value", () => { + const output = reportMarkdown(unsupported); + expect(output).toContain("| LCP | · not supported | largest-contentful-paint entries not supported in this browser |"); + expect(output).toContain("| INP | · not supported | the browser lacks the API |"); + expect(output).not.toContain("undefined"); + }); +});