Check ignore next warning comments in a warn() helper

lib/hacks/gradient.js

@@ -370,9 +370,10 @@ class Gradient extends Value {
             /^(calc|min|max|clamp)$/i.test(tokens[0].value)))
       ) {
         if (decl && result) {
-          decl.warn(
+          utils.warn(
             result,
-            'Gradient color hints are not supported by old WebKit'
+            'Gradient color hints are not supported by old WebKit',
+            { node: decl }
           )
         }
         return false

lib/hacks/grid-end.js

@@ -1,5 +1,5 @@
 let Declaration = require('../declaration')
-let { isPureNumber } = require('../utils')
+let { isPureNumber, warn } = require('../utils')
 
 class GridEnd extends Declaration {
   /**
@@ -34,9 +34,10 @@ class GridEnd extends Declaration {
           return undefined
         }
       } else {
-        decl.warn(
+        warn(
           result,
-          `Can not prefix ${decl.prop} (${startProp} is not found)`
+          `Can not prefix ${decl.prop} (${startProp} is not found)`,
+          { node: decl }
         )
       }
     }

lib/hacks/grid-rows-columns.js

@@ -1,5 +1,6 @@
 let Declaration = require('../declaration')
 let Processor = require('../processor')
+let { warn } = require('../utils')
 let {
   autoplaceGridItems,
   getGridGap,
@@ -66,9 +67,10 @@ class GridRowsColumns extends Declaration {
       if (!rowDecl && hasGridTemplate) {
         return undefined
       } else if (!rowDecl && !hasGridTemplate) {
-        decl.warn(
+        warn(
           result,
-          'Autoplacement does not work without grid-template-rows property'
+          'Autoplacement does not work without grid-template-rows property',
+          { node: decl }
         )
         return undefined
       }
@@ -80,9 +82,10 @@ class GridRowsColumns extends Declaration {
         return i.prop === 'grid-template-columns'
       })
       if (!columnDecl && !hasGridTemplate) {
-        decl.warn(
+        warn(
           result,
-          'Autoplacement does not work without grid-template-columns property'
+          'Autoplacement does not work without grid-template-columns property',
+          { node: decl }
         )
       }
 

lib/hacks/grid-utils.js

@@ -4,6 +4,7 @@ let list = require('postcss').list
 let uniq = require('../utils').uniq
 let escapeRegexp = require('../utils').escapeRegexp
 let splitSelector = require('../utils').splitSelector
+let warn = require('../utils').warn
 
 const GAP_PROPS = /^(grid-)?((row|column)-)?gap$/
 
@@ -758,7 +759,9 @@ function warnMissedAreas(areas, decl, result) {
   })
 
   if (missed.length > 0) {
-    decl.warn(result, 'Can not find grid areas: ' + missed.join(', '))
+    warn(result, 'Can not find grid areas: ' + missed.join(', '), {
+      node: decl
+    })
   }
 
   return undefined
@@ -828,11 +831,12 @@ function warnTemplateSelectorNotFound(decl, result) {
 
     // warn user if we didn't find template
     if (!gridTemplateFound && duplicatesFound) {
-      decl.warn(
+      warn(
         result,
         'Autoprefixer cannot find a grid-template ' +
           `containing the duplicate grid-area "${decl.value}" ` +
-          `with full selector matching: ${slicedSelectorArr.join(' ')}`
+          `with full selector matching: ${slicedSelectorArr.join(' ')}`,
+        { node: decl }
       )
     }
   }
@@ -861,10 +865,11 @@ function warnIfGridRowColumnExists(decl, result) {
   })
   if (decls.length > 0) {
     decls.forEach(d => {
-      d.warn(
+      warn(
         result,
         'You already have a grid-area declaration present in the rule. ' +
-          `You should use either grid-area or ${d.prop}, not both`
+          `You should use either grid-area or ${d.prop}, not both`,
+        { node: d }
       )
     })
   }
@@ -1058,10 +1063,9 @@ function warnGridGap({ decl, gap, hasColumns, result }) {
   let hasBothGaps = gap.row && gap.column
   if (!hasColumns && (hasBothGaps || (gap.column && !gap.row))) {
     delete gap.column
-    decl.warn(
+    warn(result, 'Can not implement grid-gap without grid-template-columns', {
-      result,
+      node: decl
-      'Can not implement grid-gap without grid-template-columns'
+    })
-    )
   }
 }
 

lib/processor.js

@@ -1,34 +1,14 @@
 let parser = require('postcss-value-parser')
 
 let Value = require('./value')
-let vendor = require('./vendor')
 let insertAreas = require('./hacks/grid-utils').insertAreas
+let { warn } = require('./utils')
 
 const OLD_LINEAR = /(^|[^-])linear-gradient\(\s*(top|left|right|bottom)/i
 const OLD_RADIAL = /(^|[^-])radial-gradient\(\s*\d+(\w*|%)\s+\d+(\w*|%)\s*,/i
 const IGNORE_NEXT = /(!\s*)?autoprefixer:\s*ignore\s+next(?!\s+warning)/i
-const IGNORE_NEXT_WARNING = /(!\s*)?autoprefixer:\s*ignore\s+next\s+warning/i
-const PREFIXED_VALUE = /(^|[\s,(])-\w+-/
 const GRID_REGEX = /(!\s*)?autoprefixer\s*grid:\s*(on|off|(no-)?autoplace)/i
 
-/**
- * Is the node right after an `ignore next warning` control comment?
- * Prefixed copies inserted before the node are skipped on the way back.
- */
-function hasIgnoreWarningComment(node) {
-  let prev = node.prev()
-  while (
-    prev &&
-    prev.type === 'decl' &&
-    (vendor.prefix(prev.prop) || PREFIXED_VALUE.test(prev.value))
-  ) {
-    prev = prev.prev()
-  }
-  return (
-    !!prev && prev.type === 'comment' && IGNORE_NEXT_WARNING.test(prev.text)
-  )
-}
-
 const SIZES = [
   'width',
   'height',
@@ -130,26 +110,30 @@ class Processor {
 
       if (prop === 'color-adjust') {
         if (parent.every(i => i.prop !== 'print-color-adjust')) {
-          result.warn(
+          warn(
+            result,
             'Replace color-adjust to print-color-adjust. ' +
               'The color-adjust shorthand is currently deprecated.',
             { node: decl }
           )
         }
       } else if (prop === 'grid-row-span') {
-        result.warn(
+        warn(
+          result,
           'grid-row-span is not part of final Grid Layout. Use grid-row.',
           { node: decl }
         )
         return undefined
       } else if (prop === 'grid-column-span') {
-        result.warn(
+        warn(
+          result,
           'grid-column-span is not part of final Grid Layout. Use grid-column.',
           { node: decl }
         )
         return undefined
       } else if (prop === 'display' && value === 'box') {
-        result.warn(
+        warn(
+          result,
           'You should write display: flex by final spec ' +
             'instead of display: box',
           { node: decl }
@@ -157,14 +141,16 @@ class Processor {
         return undefined
       } else if (prop === 'text-emphasis-position') {
         if (value === 'under' || value === 'over') {
-          result.warn(
+          warn(
+            result,
             'You should use 2 values for text-emphasis-position ' +
               'For example, `under left` instead of just `under`.',
             { node: decl }
           )
         }
       } else if (prop === 'text-decoration-skip' && value === 'ink') {
-        result.warn(
+        warn(
+          result,
           'Replace text-decoration-skip: ink to ' +
             'text-decoration-skip-ink: auto, because spec had been changed',
           { node: decl }
@@ -172,11 +158,12 @@ class Processor {
       } else {
         if (gridPrefixes && this.gridStatus(decl, result)) {
           if (decl.value === 'subgrid') {
-            result.warn('IE does not support subgrid', { node: decl })
+            warn(result, 'IE does not support subgrid', { node: decl })
           }
           if (/^(align|justify|place)-items$/.test(prop) && insideGrid(decl)) {
             let fixed = prop.replace('-items', '-self')
-            result.warn(
+            warn(
+              result,
               `IE does not support ${prop} on grid containers. ` +
                 `Try using ${fixed} on child elements instead: ` +
                 `${decl.parent.selector} > * { ${fixed}: ${decl.value} }`,
@@ -186,11 +173,16 @@ class Processor {
             /^(align|justify|place)-content$/.test(prop) &&
             insideGrid(decl)
           ) {
-            result.warn(`IE does not support ${decl.prop} on grid containers`, {
+            warn(
-              node: decl
+              result,
-            })
+              `IE does not support ${decl.prop} on grid containers`,
+              {
+                node: decl
+              }
+            )
           } else if (prop === 'display' && decl.value === 'contents') {
-            result.warn(
+            warn(
+              result,
               'Please do not use display: contents; ' +
                 'if you have grid setting enabled',
               { node: decl }
@@ -203,7 +195,8 @@ class Processor {
               !hasRowsAndColumns(decl) &&
               !hasGridTemplate(decl)
             ) {
-              result.warn(
+              warn(
+                result,
                 'grid-gap only works if grid-template(-areas) is being ' +
                   'used or both rows and columns have been declared ' +
                   'and cells have not been manually ' +
@@ -214,33 +207,37 @@ class Processor {
               (status === true || status === 'no-autoplace') &&
               !hasGridTemplate(decl)
             ) {
-              result.warn(
+              warn(
+                result,
                 'grid-gap only works if grid-template(-areas) is being used',
                 { node: decl }
               )
             }
           } else if (prop === 'grid-auto-columns') {
-            result.warn('grid-auto-columns is not supported by IE', {
+            warn(result, 'grid-auto-columns is not supported by IE', {
               node: decl
             })
             return undefined
           } else if (prop === 'grid-auto-rows') {
-            result.warn('grid-auto-rows is not supported by IE', { node: decl })
+            warn(result, 'grid-auto-rows is not supported by IE', {
+              node: decl
+            })
             return undefined
           } else if (prop === 'grid-auto-flow') {
             let hasRows = parent.some(i => i.prop === 'grid-template-rows')
             let hasCols = parent.some(i => i.prop === 'grid-template-columns')
 
             if (hasGridTemplate(decl)) {
-              result.warn('grid-auto-flow is not supported by IE', {
+              warn(result, 'grid-auto-flow is not supported by IE', {
                 node: decl
               })
             } else if (value.includes('dense')) {
-              result.warn('grid-auto-flow: dense is not supported by IE', {
+              warn(result, 'grid-auto-flow: dense is not supported by IE', {
                 node: decl
               })
             } else if (!hasRows && !hasCols) {
-              result.warn(
+              warn(
+                result,
                 'grid-auto-flow works only if grid-template-rows and ' +
                   'grid-template-columns are present in the same rule',
                 { node: decl }
@@ -248,19 +245,20 @@ class Processor {
             }
             return undefined
           } else if (value.includes('auto-fit')) {
-            result.warn('auto-fit value is not supported by IE', {
+            warn(result, 'auto-fit value is not supported by IE', {
               node: decl,
               word: 'auto-fit'
             })
             return undefined
           } else if (value.includes('auto-fill')) {
-            result.warn('auto-fill value is not supported by IE', {
+            warn(result, 'auto-fill value is not supported by IE', {
               node: decl,
               word: 'auto-fill'
             })
             return undefined
           } else if (prop.startsWith('grid-template') && value.includes('[')) {
-            result.warn(
+            warn(
+              result,
               'Autoprefixer currently does not support line names. ' +
                 'Try using grid-template-areas instead.',
               { node: decl, word: '[' }
@@ -269,7 +267,8 @@ class Processor {
         }
         if (value.includes('radial-gradient')) {
           if (OLD_RADIAL.test(decl.value)) {
-            result.warn(
+            warn(
+              result,
               'Gradient has outdated direction syntax. ' +
                 'New syntax is like `closest-side at 0 0` ' +
                 'instead of `0 0, closest-side`.',
@@ -283,13 +282,15 @@ class Processor {
                 for (let word of i.nodes) {
                   if (word.type === 'word') {
                     if (word.value === 'cover') {
-                      result.warn(
+                      warn(
+                        result,
                         'Gradient has outdated direction syntax. ' +
                           'Replace `cover` to `farthest-corner`.',
                         { node: decl }
                       )
                     } else if (word.value === 'contain') {
-                      result.warn(
+                      warn(
+                        result,
                         'Gradient has outdated direction syntax. ' +
                           'Replace `contain` to `closest-side`.',
                         { node: decl }
@@ -303,7 +304,8 @@ class Processor {
         }
         if (value.includes('linear-gradient')) {
           if (OLD_LINEAR.test(value)) {
-            result.warn(
+            warn(
+              result,
               'Gradient has outdated direction syntax. ' +
                 'New syntax is like `to left` instead of `right`.',
               { node: decl }
@@ -315,7 +317,8 @@ class Processor {
       if (SIZES.includes(decl.prop)) {
         if (!decl.value.includes('-fill-available')) {
           if (decl.value.includes('fill-available')) {
-            result.warn(
+            warn(
+              result,
               'Replace fill-available to stretch, ' +
                 'because spec had been changed',
               { node: decl }
@@ -323,7 +326,8 @@ class Processor {
           } else if (decl.value.includes('fill')) {
             let ast = parser(value)
             if (ast.nodes.some(i => i.type === 'word' && i.value === 'fill')) {
-              result.warn(
+              warn(
+                result,
                 'Replace fill to stretch, because spec had been changed',
                 { node: decl }
               )
@@ -387,7 +391,7 @@ class Processor {
     }
 
     // Values
-    css.walkDecls(decl => {
+    return css.walkDecls(decl => {
       if (this.disabledValue(decl, result)) return
 
       let unprefixed = this.prefixes.unprefixed(decl.prop)
@@ -399,16 +403,6 @@ class Processor {
       }
       Value.save(this.prefixes, decl)
     })
-
-    // Remove warnings hidden by ignore next warning control comments
-    result.messages = result.messages.filter(i => {
-      return !(
-        i.type === 'warning' &&
-        i.plugin === 'autoprefixer' &&
-        i.node &&
-        hasIgnoreWarningComment(i.node)
-      )
-    })
   }
 
   /**
@@ -437,7 +431,8 @@ class Processor {
         if (i.type !== 'comment') return
         if (/(!\s*)?autoprefixer:\s*(off|on)/i.test(i.text)) {
           if (typeof status !== 'undefined') {
-            result.warn(
+            warn(
+              result,
               'Second Autoprefixer control comment ' +
                 'was ignored. Autoprefixer applies control ' +
                 'comment to whole block, not to next rules.',
@@ -549,7 +544,8 @@ class Processor {
           let hasAutoplace = /:\s*autoplace/i.test(i.text)
           let noAutoplace = /no-autoplace/i.test(i.text)
           if (typeof status !== 'undefined') {
-            result.warn(
+            warn(
+              result,
               'Second Autoprefixer grid control comment was ' +
                 'ignored. Autoprefixer applies control comments to the whole ' +
                 'block, not to the next rules.',

lib/transition.js

@@ -2,6 +2,7 @@ let { list } = require('postcss')
 let parser = require('postcss-value-parser')
 
 let Browsers = require('./browsers')
+let { warn } = require('./utils')
 let vendor = require('./vendor')
 
 class Transition {
@@ -121,12 +122,13 @@ class Transition {
     })
 
     if (isPrefixed && hasAssociatedProp) {
-      decl.warn(
+      warn(
         result,
         'Replace transition-property to transition, ' +
           'because Autoprefixer could not support ' +
           'any cases of transition-property ' +
-          'and other transition-*'
+          'and other transition-*',
+        { node: decl }
       )
     }
   }

lib/utils.js

@@ -1,5 +1,10 @@
 let { list } = require('postcss')
 
+let vendor = require('./vendor')
+
+const IGNORE_NEXT_WARNING = /(!\s*)?autoprefixer:\s*ignore\s+next\s+warning/i
+const PREFIXED_VALUE = /(^|[\s,(])-\w+-/
+
 /**
  * Throw special error, to tell beniary,
  * that this error is from Autoprefixer.
@@ -91,3 +96,30 @@ module.exports.isPureNumber = function (value) {
   }
   return false
 }
+
+/**
+ * Is the node right after an `ignore next warning` control comment?
+ * Prefixed copies inserted before the node are skipped on the way back.
+ */
+function hasIgnoreWarningComment(node) {
+  let prev = node.prev()
+  while (
+    prev &&
+    prev.type === 'decl' &&
+    (vendor.prefix(prev.prop) || PREFIXED_VALUE.test(prev.value))
+  ) {
+    prev = prev.prev()
+  }
+  return (
+    !!prev && prev.type === 'comment' && IGNORE_NEXT_WARNING.test(prev.text)
+  )
+}
+
+/**
+ * Add a warning, unless the node is hidden
+ * by an `ignore next warning` control comment.
+ */
+module.exports.warn = function (result, text, opts = {}) {
+  if (opts.node && hasIgnoreWarningComment(opts.node)) return
+  result.warn(text, opts)
+}