autoprefixer - npm Package Compare versions

Comparing version 10.4.11 to 10.4.12

lib/hacks/gradient.js

@@ -17,5 +17,6 @@ let parser = require('postcss-value-parser')
     for (let node of ast.nodes) {
-      if (node.type === 'function' && node.value === this.name) {
+      let gradientName = this.name // gradient name
+      if (node.type === 'function' && node.value === gradientName) {
         node.nodes = this.newDirection(node.nodes)
-        node.nodes = this.normalize(node.nodes)
+        node.nodes = this.normalize(node.nodes, gradientName)
         if (prefix === '-webkit- old') {
@@ -60,3 +61,3 @@ let changes = this.oldWebkit(node)
    */
-  normalize(nodes) {
+  normalize(nodes, gradientName) {
     if (!nodes[0]) return nodes
@@ -76,10 +77,19 @@
 
-    if (nodes[0].value === '0deg') {
-      nodes = this.replaceFirst(nodes, 'to', ' ', 'top')
-    } else if (nodes[0].value === '90deg') {
-      nodes = this.replaceFirst(nodes, 'to', ' ', 'right')
-    } else if (nodes[0].value === '180deg') {
-      nodes = this.replaceFirst(nodes, 'to', ' ', 'bottom')
-    } else if (nodes[0].value === '270deg') {
-      nodes = this.replaceFirst(nodes, 'to', ' ', 'left')
+    if (
+      gradientName === 'linear-gradient' ||
+      gradientName === 'repeating-linear-gradient'
+    ) {
+      let direction = nodes[0].value
+
+      // Unitless zero for `<angle>` values are allowed in CSS gradients and transforms.
+      // Spec: https://github.com/w3c/csswg-drafts/commit/602789171429b2231223ab1e5acf8f7f11652eb3
+      if (direction === '0deg' || direction === '0') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'top')
+      } else if (direction === '90deg') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'right')
+      } else if (direction === '180deg') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'bottom') // default value
+      } else if (direction === '270deg') {
+        nodes = this.replaceFirst(nodes, 'to', ' ', 'left')
+      }
     }
@@ -364,3 +374,12 @@
     if (prefix === '-webkit-') {
-      let type = this.name === 'linear-gradient' ? 'linear' : 'radial'
+      let type
+      if (this.name === 'linear-gradient') {
+        type = 'linear'
+      } else if (this.name === 'repeating-linear-gradient') {
+        type = 'repeating-linear'
+      } else if (this.name === 'repeating-radial-gradient') {
+        type = 'repeating-radial'
+      } else {
+        type = 'radial'
+      }
       let string = '-gradient'
@@ -410,3 +429,3 @@ let regexp = utils.regexp(
 Gradient.directions = {
-  top: 'bottom',
+  top: 'bottom', // default value
   left: 'right',
@@ -413,0 +432,0 @@ bottom: 'top',

package.json

 {
   "name": "autoprefixer",
-  "version": "10.4.11",
+  "version": "10.4.12",
   "description": "Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website",
@@ -38,4 +38,4 @@ "engines": {
   "dependencies": {
-    "browserslist": "^4.21.3",
-    "caniuse-lite": "^1.0.30001399",
+    "browserslist": "^4.21.4",
+    "caniuse-lite": "^1.0.30001407",
     "fraction.js": "^4.2.0",
@@ -42,0 +42,0 @@ "normalize-range": "^0.1.2",

No alert changes

Improved metrics

Total package byte prevSize

198645

increased by0.37%

Lines of code

6996

increased by0.26%

Dependency changes

• Updatedbrowserslist@^4.21.4

• Updatedcaniuse-lite@^1.0.30001407