update data for text-decoration (#1478)

Author: romainmenke

data/prefixes.js

@@ -659,12 +659,18 @@ f(prefixPointer, browsers =>
 // Text decoration
 let prefixDecoration = require('caniuse-lite/data/features/text-decoration')
 
-f(prefixDecoration, browsers =>
+f(prefixDecoration, { match: /x.*#[235]/ }, browsers =>
+  prefix(['text-decoration-skip', 'text-decoration-skip-ink'], {
+    feature: 'text-decoration',
+    browsers
+  })
+)
+
+let prefixDecorationShorthand = require('caniuse-lite/data/features/mdn-text-decoration-shorthand')
+
+f(prefixDecorationShorthand, browsers =>
   prefix(
     [
-      'text-decoration-style',
-      'text-decoration-color',
-      'text-decoration-line',
       'text-decoration'
     ],
     {
@@ -674,11 +680,46 @@ f(prefixDecoration, browsers =>
   )
 )
 
-f(prefixDecoration, { match: /x.*#[235]/ }, browsers =>
-  prefix(['text-decoration-skip', 'text-decoration-skip-ink'], {
-    feature: 'text-decoration',
-    browsers
-  })
+let prefixDecorationColor = require('caniuse-lite/data/features/mdn-text-decoration-color')
+
+f(prefixDecorationColor, browsers =>
+  prefix(
+    [
+      'text-decoration-color'
+    ],
+    {
+      feature: 'text-decoration',
+      browsers
+    }
+  )
+)
+
+let prefixDecorationLine = require('caniuse-lite/data/features/mdn-text-decoration-line')
+
+f(prefixDecorationLine, browsers =>
+  prefix(
+    [
+      'text-decoration-line'
+    ],
+    {
+      feature: 'text-decoration',
+      browsers
+    }
+  )
+)
+
+let prefixDecorationStyle = require('caniuse-lite/data/features/mdn-text-decoration-style')
+
+f(prefixDecorationStyle, browsers =>
+  prefix(
+    [
+      'text-decoration-style'
+    ],
+    {
+      feature: 'text-decoration',
+      browsers
+    }
+  )
 )
 
 // Text Size Adjust

test/autoprefixer.test.js

@@ -90,6 +90,9 @@ let example = autoprefixer({
 let autofiller = autoprefixer({
   overrideBrowserslist: ['Chrome > 90', 'Firefox >= 82']
 })
+let textDecorator = autoprefixer({
+  overrideBrowserslist: ['Chrome >= 57', 'Firefox >= 36', 'Safari >= 12.1']
+})
 let content = autoprefixer({
   overrideBrowserslist: [
     '> 2%',
@@ -137,6 +140,8 @@ function prefixer(name) {
     name === 'at-rules'
   ) {
     return intrinsicer
+  } else if (name === 'text-decoration-shorthand') {
+    return textDecorator
   } else if (name === 'selectors' || name === 'placeholder') {
     return selectorer
   } else if (name === 'selectors' || name === 'file-selector-button') {
@@ -1139,17 +1144,29 @@ test('add prefix for backface-visibility for Safari 9', () => {
 
 test('supports text-decoration', () => {
   let input = read('text-decoration')
+  let output = read('text-decoration.out')
   let instance = prefixer('text-decoration')
   let result = postcss([instance]).process(input)
+
+  equal(universalizer(result.css), universalizer(output))
   equal(
     result.warnings().map(i => i.toString()),
     [
-      'autoprefixer: <css input>:26:3: Replace text-decoration-skip: ink ' +
+      'autoprefixer: <css input>:32:3: Replace text-decoration-skip: ink ' +
         'to text-decoration-skip-ink: auto, because spec had been changed'
     ]
   )
 })
 
+test('supports text-decoration shorthand', () => {
+  let input = read('text-decoration')
+  let output = read('text-decoration.shorthand.out')
+  let instance = prefixer('text-decoration-shorthand')
+  let result = postcss([instance]).process(input)
+
+  equal(universalizer(result.css), universalizer(output))
+})
+
 test('supports -webkit-line-clamp', () => {
   let input = read('webkit-line-clamp')
   let result = postcss([cleaner]).process(input)

test/cases/text-decoration.css

@@ -2,7 +2,13 @@
   text-decoration: overline double red;
 }
 
+.shorthand-single-value {
+  text-decoration: underline;
+}
+
 .full {
+  text-decoration-color: green;
+  text-decoration-line: line-through;
   text-decoration-style: double;
 }
 

test/cases/text-decoration.out.css

@@ -1,10 +1,19 @@
 .shorthand {
   -webkit-text-decoration: overline double red;
-     -moz-text-decoration: overline double red;
           text-decoration: overline double red;
 }
 
+.shorthand-single-value {
+  text-decoration: underline;
+}
+
 .full {
+  -webkit-text-decoration-color: green;
+     -moz-text-decoration-color: green;
+          text-decoration-color: green;
+  -webkit-text-decoration-line: line-through;
+     -moz-text-decoration-line: line-through;
+          text-decoration-line: line-through;
   -webkit-text-decoration-style: double;
      -moz-text-decoration-style: double;
           text-decoration-style: double;

test/cases/text-decoration.shorthand.out.css

@@ -0,0 +1,34 @@
+.shorthand {
+  -webkit-text-decoration: overline double red;
+          text-decoration: overline double red;
+}
+
+.shorthand-single-value {
+  text-decoration: underline;
+}
+
+.full {
+  text-decoration-color: green;
+  text-decoration-line: line-through;
+  text-decoration-style: double;
+}
+
+.old {
+  text-decoration: underline;
+}
+
+.global {
+  text-decoration: unset;
+}
+
+.skip {
+  text-decoration-skip: spaces;
+}
+
+.ink {
+  text-decoration-skip-ink: auto;
+}
+
+.old-ink {
+  text-decoration-skip: ink;
+}