Check ignore next warning comments in a warn() helper
This commit is contained in:
1 parent
e47232149a
commit
dc4f2415a8
7 files changed
+121
-82
No files matched your search
+58
-62
@@ -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`, {
|
||||
node: decl
|
||||
})
|
||||
warn(
|
||||
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.',
|
||||
|
||||
Reference in new issue
Block a user