autoprefixer: [Firefox] -moz-read-only is not duplicated with all associated css selectors

Hello,

Description

This issue is refered to https://github.com/angular/angular-cli/issues/17325 Since I upgrade Angular 8 to 9, autoprefixer has updated from 9.6.1 to 9.7.1. Due to this update, behaviour of autoprefixer has changed about a piece of my code concerned Read-Only css rule.

This issue appear when read-only is in a same block of other css selector associate to the same css code. For example :

.element1:focus,
.element1:read-only {
  background-color: red;
}

Now, in 9.7.1, render :

/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */
.element1:-moz-read-only {
  background-color: red;
}
.element1:focus,
.element1:read-only {
  background-color: red;
}

But should render, like previously :

.element1:-moz-read-only,
.element1:focus {
 background-color:red
}
.element1:focus,
.element1:read-only {
 background-color:red
}

As you can seen, .element1:focus, is never associate to a code block with .element1:-moz-read-only.

Because :read-only is unknown for firefox, all the code block that include .element1:read-only is never interpreted included other rules of this same code block. ( On the example, :focus is never interpreted, because on firefox, the code blocks failed due to unkown attribute :read-only ) On previous version that work because other rules (here :focus) is duplicated in the generated code block that include :-moz-read-only.

Minimal reproduction :

I previously create 2 scratchs projects for angular, where we can see the bug Here is a repository with angular 9, (so, with autoprefixer 9.7.x) where the bug appear : https://github.com/albanlorillard/angular9-readonly-bug

Here is a repository with angular 8, (so, with autoprefixer 9.6.x) where the bug NOT appear : https://github.com/albanlorillard/angular8-readonly-bug

Browsers tested :

Firefox developer 75.0b9 (64 bits) Firefox 73.0 (64-bit)

About this issue

  • Original URL
  • State: open
  • Created 4 years ago
  • Comments: 20 (11 by maintainers)

Most upvoted comments

I will look at it, but if you don’t see anything from me in a week, assume that it might not happen

Can confirm that it works in 9.6.4 but breaks in 9.6.5

Got it.

I do not have time for this issue in the next few weeks.

You can help me by sending PR to this file: https://github.com/postcss/autoprefixer/blob/master/lib/selector.js