Skip to content

Image Element Audit: false positive 'No modern format' warning for SVG images #58

@nucliweb

Description

@nucliweb

Description

The Image Element Audit snippet reports a false positive info message for SVG images:

No modern format detected (WebP / AVIF / JXL)

SVG is a vector format and converting it to WebP/AVIF/JXL would be counterproductive — the recommendation doesn't apply.

Root cause

In the snippet, isModernFormat() only checks for raster modern formats, and there is no exclusion for SVG before pushing the issue:

function isModernFormat(format) {
  return ["avif", "webp", "jxl", "auto (cdn)", "auto (cdn?)"].includes(format);
}

// SVG is not excluded, so this fires for SVG images
if (!isModernFormat(format) && !inPicture)
  issues.push({ s: "info", msg: "No modern format detected (WebP / AVIF / JXL)" });

Suggested fix

Add a format !== "svg" guard:

if (!isModernFormat(format) && !inPicture && format !== "svg")
  issues.push({ s: "info", msg: "No modern format detected (WebP / AVIF / JXL)" });

Steps to reproduce

  1. Open a page that has <img> elements with .svg sources
  2. Run the Image Element Audit snippet in DevTools
  3. SVG images will show the "No modern format detected" info message

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions