autoprefixer: Regression from 6.x -> 7.x: info() not picking up browserlist configuration

Hi,

At first this looked like a more serious issue than it turned out to be after investigation, but thought to report this anyway. Makes debugging difficult at least, spent a good while thinking my browserslist config isn’t being picked up at all.

To clarify: the actual functionality seems to work fine when used as per design via postcss.

Short version: In 7.x, autoprefixer().info() with no arguments uses the default browserslist configuration instead of picking up the config from package.json or from the configuration file.

To reproduce:

In package.json (or in a separate configuration file), have something custom defined:

  "browserslist": [
    "Edge 15"
  ]

Then, run the following code and compare the output between latest 6.x and 7.x versions.

var autoprefixer = require('autoprefixer');

console.log(autoprefixer().info());

On the last 6.x release (6.7.7), the output is as predicted:

$ node index.js
Browsers:
  Edge: 15

These browsers account for 0% of all users globally

At-Rules:
  @viewport: ms

Selectors:
  ::placeholder: ms

Properties:
  user-select: ms
  hyphens: ms
  // ....and so on

Values:
  grid: ms
  inline-grid: ms

On 7.0.1 the output shows that browserslist defaults are being used:

$ node index.js
Browsers:
  Chrome for Android: 57
  Firefox for Android: 52
  And_qq: 1.2
  UC for Android: 11.4
  Android: 56, 4.4.3-4.4.4, 4.4
  Baidu: 7.12
  Bb: 10, 7
  Chrome: 58, 57, 56, 49
  Edge: 15, 14
  Firefox: 53, 52
  IE: 11, 10
  IE Mobile: 11, 10
  iOS: 10.3, 10.0-10.2
  Opera Mini: all
  Opera Mobile: 37, 12.1
  Opera: 44, 43
  Safari: 10.1, 10
  Samsung: 4

These browsers account for 90.92% of all users globally

At-Rules:
  @keyframes: webkit
  @viewport: ms, o
  @resolution: webkit

Selectors:
  ::selection: moz
  ::placeholder: webkit, ms
  :fullscreen: webkit, moz, ms
  ::backdrop: webkit
  :read-only: moz
  :read-write: moz
  :any-link: webkit, moz

Properties:
  box-shadow: webkit
  animation: webkit
  animation-name: webkit
  animation-duration: webkit
  animation-delay: webkit
  animation-direction: webkit
  // ...and so on

If calling the .info() with explicit from option (autoprefixer().info({ from: '.' })), things work in 7.x as well.

As far as I figured out, the issue seems to come from the fact that path option given to browserslist is undefined, but browserslist falls back to the default path (.) only if the path prop is missing completely.

Another thing I noticed with .info() is that, even if called for an autoprefixer plugin instance, it doesn’t use the options of that instance, but rather always the given opts (ref). I feel this is a bit unintuitive as the function is meant for debugging purposes - I’d assume it to show me the exact same configuration as used by the created instance.

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 1
  • Comments: 17 (10 by maintainers)

Commits related to this issue

Most upvoted comments

Released in 7.1