postcss 8.3.11 → 8.4.3

package/lib/container.d.ts

@@ -181,10 +181,10 @@ export default abstract class Container<
    */
   walkRules(
     selectorFilter: string | RegExp,
-    callback: (atRule: Rule, index: number) => false | void
+    callback: (rule: Rule, index: number) => false | void
   ): false | undefined
   walkRules(
-    callback: (atRule: Rule, index: number) => false | void
+    callback: (rule: Rule, index: number) => false | void
   ): false | undefined
 
   /**

package/lib/container.js

@@ -316,7 +316,7 @@ class Container extends Node {
     }
 
     let processed = nodes.map(i => {
-      // istanbul ignore next
+      /* c8 ignore next */
       if (!i[my]) Container.rebuild(i)
       i = i.proxyOf
       if (i.parent) i.parent.removeChild(i)
@@ -410,7 +410,7 @@ Container.registerAtRule = dependant => {
 module.exports = Container
 Container.default = Container
 
-// istanbul ignore next
+/* c8 ignore start */
 Container.rebuild = node => {
   if (node.type === 'atrule') {
     Object.setPrototypeOf(node, AtRule.prototype)
@@ -430,3 +430,4 @@ Container.rebuild = node => {
     })
   }
 }
+/* c8 ignore stop */

package/lib/css-syntax-error.d.ts

@@ -1,5 +1,20 @@
 import { FilePosition } from './input.js'
 
+/**
+ * A position that is part of a range.
+ */
+export interface RangePosition {
+  /**
+   * The line number in the input.
+   */
+  line: number
+
+  /**
+   * The column number in the input.
+   */
+  column: number
+}
+
 /**
  * The CSS parser throws this error for broken CSS.
  *
@@ -31,17 +46,21 @@ import { FilePosition } from './input.js'
  */
 export default class CssSyntaxError {
   /**
-   * @param message Error message.
-   * @param line    Source line of the error.
-   * @param column  Source column of the error.
-   * @param source  Source code of the broken file.
-   * @param file    Absolute path to the broken file.
-   * @param plugin  PostCSS plugin name, if error came from plugin.
+   * Instantiates a CSS syntax error. Can be instantiated for a single position
+   * or for a range.
+   * @param message        Error message.
+   * @param lineOrStartPos If for a single position, the line number, or if for
+   *                       a range, the inclusive start position of the error.
+   * @param columnOrEndPos If for a single position, the column number, or if for
+   *                       a range, the exclusive end position of the error.
+   * @param source         Source code of the broken file.
+   * @param file           Absolute path to the broken file.
+   * @param plugin         PostCSS plugin name, if error came from plugin.
    */
   constructor(
     message: string,
-    line?: number,
-    column?: number,
+    lineOrStartPos?: number | RangePosition,
+    columnOrEndPos?: number | RangePosition,
     source?: string,
     file?: string,
     plugin?: string
@@ -121,6 +140,34 @@ export default class CssSyntaxError {
    */
   column?: number
 
+  /**
+   * Source line of the error's end, exclusive. Provided if the error pertains
+   * to a range.
+   *
+   * ```js
+   * error.endLine       //=> 3
+   * error.input.endLine //=> 4
+   * ```
+   *
+   * PostCSS will use the input source map to detect the original location.
+   * If you need the position in the PostCSS input, use `error.input.endLine`.
+   */
+  endLine?: number
+
+  /**
+   * Source column of the error's end, exclusive. Provided if the error pertains
+   * to a range.
+   *
+   * ```js
+   * error.endColumn       //=> 1
+   * error.input.endColumn //=> 4
+   * ```
+   *
+   * PostCSS will use the input source map to detect the original location.
+   * If you need the position in the PostCSS input, use `error.input.endColumn`.
+   */
+  endColumn?: number
+
   /**
    * Source code of the broken file.
    *

package/lib/css-syntax-error.js

@@ -20,8 +20,15 @@ class CssSyntaxError extends Error {
       this.plugin = plugin
     }
     if (typeof line !== 'undefined' && typeof column !== 'undefined') {
-      this.line = line
-      this.column = column
+      if (typeof line === 'number') {
+        this.line = line
+        this.column = column
+      } else {
+        this.line = line.line
+        this.column = line.column
+        this.endLine = column.line
+        this.endColumn = column.column
+      }
     }
 
     this.setMessage()

package/lib/input.d.ts

@@ -13,15 +13,25 @@ export interface FilePosition {
   file?: string
 
   /**
-   * Line in source file.
+   * Line of inclusive start position in source file.
    */
   line: number
 
   /**
-   * Column in source file.
+   * Column of inclusive start position in source file.
    */
   column: number
 
+  /**
+   * Line of exclusive end position in source file.
+   */
+  endLine?: number
+
+  /**
+   * Column of exclusive end position in source file.
+   */
+  endColumn?: number
+
   /**
    * Source code.
    */
@@ -108,18 +118,28 @@ export default class Input {
   /**
    * Reads the input source map and returns a symbol position
    * in the input source (e.g., in a Sass file that was compiled
-   * to CSS before being passed to PostCSS).
+   * to CSS before being passed to PostCSS). Optionally takes an
+   * end position, exclusive.
    *
    * ```js
    * root.source.input.origin(1, 1) //=> { file: 'a.css', line: 3, column: 1 }
+   * root.source.input.origin(1, 1, 1, 4)
+   * //=> { file: 'a.css', line: 3, column: 1, endLine: 3, endColumn: 4 }
    * ```
    *
-   * @param line   Line in input CSS.
-   * @param column Column in input CSS.
+   * @param line      Line for inclusive start position in input CSS.
+   * @param column    Column for inclusive start position in input CSS.
+   * @param endLine   Line for exclusive end position in input CSS.
+   * @param endColumn Column for exclusive end position in input CSS.
    *
    * @return Position in input source.
    */
-  origin(line: number, column: number): FilePosition | false
+  origin(
+    line: number,
+    column: number,
+    endLine?: number,
+    endColumn?: number
+  ): FilePosition | false
 
   /**
    * Converts source offset to line and column.

package/lib/input.js

@@ -103,18 +103,43 @@ class Input {
   }
 
   error(message, line, column, opts = {}) {
-    let result
-    if (!column) {
+    let result, endLine, endColumn
+
+    if (line && typeof line === 'object') {
+      let start = line
+      let end = column
+      if (typeof line.offset === 'number') {
+        let pos = this.fromOffset(start.offset)
+        line = pos.line
+        column = pos.col
+      } else {
+        line = start.line
+        column = start.column
+      }
+      if (typeof end.offset === 'number') {
+        let pos = this.fromOffset(end.offset)
+        endLine = pos.line
+        endColumn = pos.col
+      } else {
+        endLine = end.line
+        endColumn = end.column
+      }
+    } else if (!column) {
       let pos = this.fromOffset(line)
       line = pos.line
       column = pos.col
     }
-    let origin = this.origin(line, column)
+
+    let origin = this.origin(line, column, endLine, endColumn)
     if (origin) {
       result = new CssSyntaxError(
         message,
-        origin.line,
-        origin.column,
+        origin.endLine === undefined
+          ? origin.line
+          : { line: origin.line, column: origin.column },
+        origin.endLine === undefined
+          ? origin.column
+          : { line: origin.endLine, column: origin.endColumn },
         origin.source,
         origin.file,
         opts.plugin
@@ -122,15 +147,15 @@ class Input {
     } else {
       result = new CssSyntaxError(
         message,
-        line,
-        column,
+        endLine === undefined ? line : { line, column },
+        endLine === undefined ? column : { line: endLine, column: endColumn },
         this.css,
         this.file,
         opts.plugin
       )
     }
 
-    result.input = { line, column, source: this.css }
+    result.input = { line, column, endLine, endColumn, source: this.css }
     if (this.file) {
       if (pathToFileURL) {
         result.input.url = pathToFileURL(this.file).toString()
@@ -141,13 +166,18 @@ class Input {
     return result
   }
 
-  origin(line, column) {
+  origin(line, column, endLine, endColumn) {
     if (!this.map) return false
     let consumer = this.map.consumer()
 
     let from = consumer.originalPositionFor({ line, column })
     if (!from.source) return false
 
+    let to
+    if (typeof endLine === 'number') {
+      to = consumer.originalPositionFor({ line: endLine, column: endColumn })
+    }
+
     let fromUrl
 
     if (isAbsolute(from.source)) {
@@ -162,14 +192,16 @@ class Input {
     let result = {
       url: fromUrl.toString(),
       line: from.line,
-      column: from.column
+      column: from.column,
+      endLine: to && to.line,
+      endColumn: to && to.column
     }
 
     if (fromUrl.protocol === 'file:') {
       if (fileURLToPath) {
         result.file = fileURLToPath(fromUrl)
       } else {
-        // istanbul ignore next
+        /* c8 ignore next 2 */
         throw new Error(`file: protocol is not available in this PostCSS build`)
       }
     }

package/lib/lazy-result.d.ts

@@ -89,8 +89,9 @@ export default class LazyResult implements PromiseLike<Result> {
    *
    * This property will only work with synchronous plugins.
    * If the processor contains any asynchronous plugins
-   * it will throw an error. This is why this method is only
-   * for debug purpose, you should always use `LazyResult#then`.
+   * it will throw an error.
+   *
+   * PostCSS runners should always use `LazyResult#then`.
    */
   get css(): string
 
@@ -100,8 +101,9 @@ export default class LazyResult implements PromiseLike<Result> {
    *
    * This property will only work with synchronous plugins.
    * If the processor contains any asynchronous plugins
-   * it will throw an error. This is why this method is only
-   * for debug purpose, you should always use `LazyResult#then`.
+   * it will throw an error.
+   *
+   * PostCSS runners should always use `LazyResult#then`.
    */
   get content(): string
 
@@ -111,8 +113,9 @@ export default class LazyResult implements PromiseLike<Result> {
    *
    * This property will only work with synchronous plugins.
    * If the processor contains any asynchronous plugins
-   * it will throw an error. This is why this method is only
-   * for debug purpose, you should always use `LazyResult#then`.
+   * it will throw an error.
+   *
+   * PostCSS runners should always use `LazyResult#then`.
    */
   get map(): SourceMap
 
@@ -123,8 +126,7 @@ export default class LazyResult implements PromiseLike<Result> {
    * This property will only work with synchronous plugins. If the processor
    * contains any asynchronous plugins it will throw an error.
    *
-   * This is why this method is only for debug purpose,
-   * you should always use `LazyResult#then`.
+   * PostCSS runners should always use `LazyResult#then`.
    */
   get root(): Root
 
@@ -135,8 +137,7 @@ export default class LazyResult implements PromiseLike<Result> {
    * This property will only work with synchronous plugins. If the processor
    * contains any asynchronous plugins it will throw an error.
    *
-   * This is why this method is only for debug purpose,
-   * you should always use `LazyResult#then`.
+   * PostCSS runners should always use `LazyResult#then`.
    */
   get messages(): Message[]
 

package/lib/lazy-result.js

@@ -137,7 +137,7 @@ class LazyResult {
       }
 
       if (root && !root[my]) {
-        // istanbul ignore next
+        /* c8 ignore next 2 */
         Container.rebuild(root)
       }
     }
@@ -364,6 +364,7 @@ class LazyResult {
           let b = runtimeVer.split('.')
 
           if (a[0] !== b[0] || parseInt(a[1]) > parseInt(b[1])) {
+            // eslint-disable-next-line no-console
             console.error(
               'Unknown error from PostCSS plugin. Your current PostCSS ' +
                 'version is ' +
@@ -378,7 +379,8 @@ class LazyResult {
         }
       }
     } catch (err) {
-      // istanbul ignore next
+      /* c8 ignore next 3 */
+      // eslint-disable-next-line no-console
       if (console && console.error) console.error(err)
     }
     return error

package/lib/map-generator.js

@@ -4,15 +4,18 @@ let { SourceMapConsumer, SourceMapGenerator } = require('source-map-js')
 let { dirname, resolve, relative, sep } = require('path')
 let { pathToFileURL } = require('url')
 
+let Input = require('./input')
+
 let sourceMapAvailable = Boolean(SourceMapConsumer && SourceMapGenerator)
 let pathAvailable = Boolean(dirname && resolve && relative && sep)
 
 class MapGenerator {
-  constructor(stringify, root, opts) {
+  constructor(stringify, root, opts, cssString) {
     this.stringify = stringify
     this.mapOpts = opts.map || {}
     this.root = root
     this.opts = opts
+    this.css = cssString
   }
 
   isMap() {
@@ -25,14 +28,19 @@ class MapGenerator {
   previous() {
     if (!this.previousMaps) {
       this.previousMaps = []
-      this.root.walk(node => {
-        if (node.source && node.source.input.map) {
-          let map = node.source.input.map
-          if (!this.previousMaps.includes(map)) {
-            this.previousMaps.push(map)
+      if (this.root) {
+        this.root.walk(node => {
+          if (node.source && node.source.input.map) {
+            let map = node.source.input.map
+            if (!this.previousMaps.includes(map)) {
+              this.previousMaps.push(map)
+            }
           }
-        }
-      })
+        })
+      } else {
+        let input = new Input(this.css, this.opts)
+        if (input.map) this.previousMaps.push(input.map)
+      }
     }
 
     return this.previousMaps
@@ -67,30 +75,41 @@ class MapGenerator {
   clearAnnotation() {
     if (this.mapOpts.annotation === false) return
 
-    let node
-    for (let i = this.root.nodes.length - 1; i >= 0; i--) {
-      node = this.root.nodes[i]
-      if (node.type !== 'comment') continue
-      if (node.text.indexOf('# sourceMappingURL=') === 0) {
-        this.root.removeChild(i)
+    if (this.root) {
+      let node
+      for (let i = this.root.nodes.length - 1; i >= 0; i--) {
+        node = this.root.nodes[i]
+        if (node.type !== 'comment') continue
+        if (node.text.indexOf('# sourceMappingURL=') === 0) {
+          this.root.removeChild(i)
+        }
       }
+    } else if (this.css) {
+      this.css = this.css.replace(/(\n)?\/\*#[\S\s]*?\*\/$/gm, '')
     }
   }
 
   setSourcesContent() {
     let already = {}
-    this.root.walk(node => {
-      if (node.source) {
-        let from = node.source.input.from
-        if (from && !already[from]) {
-          already[from] = true
-          this.map.setSourceContent(
-            this.toUrl(this.path(from)),
-            node.source.input.css
-          )
+    if (this.root) {
+      this.root.walk(node => {
+        if (node.source) {
+          let from = node.source.input.from
+          if (from && !already[from]) {
+            already[from] = true
+            this.map.setSourceContent(
+              this.toUrl(this.path(from)),
+              node.source.input.css
+            )
+          }
         }
-      }
-    })
+      })
+    } else if (this.css) {
+      let from = this.opts.from
+        ? this.toUrl(this.path(this.opts.from))
+        : '<no source>'
+      this.map.setSourceContent(from, this.css)
+    }
   }
 
   applyPrevMaps() {
@@ -129,7 +148,6 @@ class MapGenerator {
     if (Buffer) {
       return Buffer.from(str).toString('base64')
     } else {
-      // istanbul ignore next
       return window.btoa(unescape(encodeURIComponent(str)))
     }
   }
@@ -147,7 +165,6 @@ class MapGenerator {
     } else {
       content = this.outputFile() + '.map'
     }
-
     let eol = '\n'
     if (this.css.includes('\r\n')) eol = '\r\n'
 
@@ -157,23 +174,38 @@ class MapGenerator {
   outputFile() {
     if (this.opts.to) {
       return this.path(this.opts.to)
-    }
-    if (this.opts.from) {
+    } else if (this.opts.from) {
       return this.path(this.opts.from)
+    } else {
+      return 'to.css'
     }
-    return 'to.css'
   }
 
   generateMap() {
-    this.generateString()
+    if (this.root) {
+      this.generateString()
+    } else if (this.previous().length === 1) {
+      let prev = this.previous()[0].consumer()
+      prev.file = this.outputFile()
+      this.map = SourceMapGenerator.fromSourceMap(prev)
+    } else {
+      this.map = new SourceMapGenerator({ file: this.outputFile() })
+      this.map.addMapping({
+        source: this.opts.from ? this.toUrl(this.opts.from) : '<no source>',
+        generated: { line: 1, column: 0 },
+        original: { line: 1, column: 0 }
+      })
+    }
+
     if (this.isSourcesContent()) this.setSourcesContent()
-    if (this.previous().length > 0) this.applyPrevMaps()
+    if (this.root && this.previous().length > 0) this.applyPrevMaps()
     if (this.isAnnotation()) this.addAnnotation()
 
     if (this.isInline()) {
       return [this.css]
+    } else {
+      return [this.css, this.map]
     }
-    return [this.css, this.map]
   }
 
   path(file) {
@@ -193,7 +225,6 @@ class MapGenerator {
 
   toUrl(path) {
     if (sep === '\\') {
-      // istanbul ignore next
       path = path.replace(/\\/g, '/')
     }
     return encodeURI(path).replace(/[#?]/g, encodeURIComponent)
@@ -206,7 +237,6 @@ class MapGenerator {
       if (pathToFileURL) {
         return pathToFileURL(node.source.input.from).toString()
       } else {
-        // istanbul ignore next
         throw new Error(
           '`map.absolute` option is not available in this PostCSS build'
         )
@@ -284,16 +314,15 @@ class MapGenerator {
 
   generate() {
     this.clearAnnotation()
-
     if (pathAvailable && sourceMapAvailable && this.isMap()) {
       return this.generateMap()
+    } else {
+      let result = ''
+      this.stringify(this.root, i => {
+        result += i
+      })
+      return [result]
     }
-
-    let result = ''
-    this.stringify(this.root, i => {
-      result += i
-    })
-    return [result]
   }
 }
 

package/lib/no-work-result.d.ts

@@ -0,0 +1,37 @@
+import Result, { Message, ResultOptions } from './result.js'
+import { SourceMap } from './postcss.js'
+import Processor from './processor.js'
+import Warning from './warning.js'
+import Root from './root.js'
+import LazyResult from './lazy-result.js'
+
+/**
+ * A Promise proxy for the result of PostCSS transformations.
+ * This lazy result instance doesn't parse css unless `NoWorkResult#root` or `Result#root`
+ * are accessed. See the example below for details.
+ * A `NoWork` instance is returned by `Processor#process` ONLY when no plugins defined.
+ *
+ * ```js
+ * const noWorkResult = postcss().process(css) // No plugins are defined.
+ *                                             // CSS is not parsed
+ * let root = noWorkResult.root // now css is parsed because we accessed the root
+ * ```
+ */
+export default class NoWorkResult implements LazyResult {
+  then: Promise<Result>['then']
+  catch: Promise<Result>['catch']
+  finally: Promise<Result>['finally']
+  constructor(processor: Processor, css: string, opts: ResultOptions)
+  get [Symbol.toStringTag](): string
+  get processor(): Processor
+  get opts(): ResultOptions
+  get css(): string
+  get content(): string
+  get map(): SourceMap
+  get root(): Root
+  get messages(): Message[]
+  warnings(): Warning[]
+  toString(): string
+  sync(): Result
+  async(): Promise<Result>
+}