Skip to content

Lighthouse 'Avoids old CSS flexbox' audit fails #1658

Closed
@ryansully

Description

@ryansully

Can you reproduce the problem with latest npm?

Yes.

Description

The current autoprefixer options prefixes flexbox with old CSS rules, which fails the following Lighthouse audit:
https://developers.google.com/web/tools/lighthouse/audits/old-flexbox

Expected behavior

Lighthouse audit 'Avoids old CSS flexbox' should pass.

Actual behavior

Lighthouse 'Avoids old CSS flexbox' audit fails.
Expanding 'More information' in the audit reveals that autoprefixer has added display: -webkit-box; and display: -ms-flexbox; to the compiled CSS.

Reproducible Demo

  1. create-react-app my-app && cd my-app
  2. Add display: flex; to body selector in src/index.css.
  3. npm start or npm run build and open local page in browser.
  4. Run Lighthouse audit.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions