no-parsing-error improve (#4)

* refactor * no-parsing-error improve

Author: ota-meshi

lib/styles/parser/css-parser.ts

@@ -1,4 +1,5 @@
 import postcss from "postcss"
+import postcssSafeParser from "postcss-safe-parser"
 import { CSSSelectorParser } from "./selector/css-selector-parser"
 import {
  VCSSStyleSheet,
@@ -36,6 +37,7 @@ export class CSSParser {
  protected commentContainer: VCSSCommentNode[]
  private _selectorParser: CSSSelectorParser | null = null
  private readonly lang: string
+ private anyErrors: any[] = []
  /**
  * constructor.
  * @param {SourceCode} sourceCode the SourceCode object that you can use to work with the source that was passed to ESLint.
@@ -57,6 +59,7 @@ export class CSSParser {
 
  this.commentContainer = []
  this._selectorParser = this.createSelectorParser()
+ this.anyErrors = []
 
  try {
  const postcssRoot = this.parseInternal(css) as PostCSSRoot
@@ -66,28 +69,12 @@ export class CSSParser {
  postcssRoot,
  )
  rootNode.comments = this.commentContainer
- return rootNode
- } catch (e) {
- const errorLoc = getESLintLineAndColumnFromPostCSSPosition(
- offsetLocation,
- e,
- )
- const errorIndex = this.sourceCode.getIndexFromLoc(errorLoc)
- const message = e.reason || e.message
- const errorNode = new VCSSParsingError(
- null as any,
- {
- start: errorLoc,
- end: errorLoc,
- },
- errorIndex,
- errorIndex,
- {
- lang: this.lang,
- message,
- },
+ rootNode.errors.push(
+ ...this.collectErrors(this.anyErrors, offsetLocation),
  )
 
+ return rootNode
+ } catch (e) {
  const startIndex = sourceCode.getIndexFromLoc(offsetLocation)
  const endIndex = startIndex + css.length
  const styleLoc = {
@@ -100,13 +87,59 @@ export class CSSParser {
  startIndex,
  endIndex,
  {
- errors: [errorNode],
+ errors: this.collectErrors(
+ [...this.anyErrors, e],
+ offsetLocation,
+ ),
  lang: this.lang,
  },
  )
  }
  }
 
+ private addError(error: any) {
+ this.anyErrors.push(error)
+ }
+
+ private collectErrors(
+ errors: any[],
+ offsetLocation: LineAndColumnData,
+ ): VCSSParsingError[] {
+ const errorNodes = []
+ const duplicate = new Set<string>()
+ for (const error of errors) {
+ const errorLoc =
+ getESLintLineAndColumnFromPostCSSPosition(
+ offsetLocation,
+ error,
+ ) || offsetLocation
+ const message = error.reason || error.message
+
+ const key = `[${errorLoc.line}:${errorLoc.column}]: ${message}`
+ if (duplicate.has(key)) {
+ continue
+ }
+ duplicate.add(key)
+ const errorIndex = this.sourceCode.getIndexFromLoc(errorLoc)
+ errorNodes.push(
+ new VCSSParsingError(
+ null as any,
+ {
+ start: errorLoc,
+ end: errorLoc,
+ },
+ errorIndex,
+ errorIndex,
+ {
+ lang: this.lang,
+ message,
+ },
+ ),
+ )
+ }
+ return errorNodes
+ }
+
  protected get selectorParser(): CSSSelectorParser {
  return (
  this._selectorParser ||
@@ -150,7 +183,8 @@ export class CSSParser {
  ) ||
  // for node type: `root`
  sourceCode.getLocFromIndex(
- start + (node as PostCSSRoot).source.input.css.length,
+ sourceCode.getIndexFromLoc(offsetLocation) +
+ (node as PostCSSRoot).source.input.css.length,
  )
  const end = sourceCode.getIndexFromLoc(endLoc)
  const loc: SourceLocation = {
@@ -179,12 +213,16 @@ export class CSSParser {
  return astNode
  }
 
- /* eslint-disable class-methods-use-this */
-
  protected parseInternal(css: string): postcss.Root {
- return postcss.parse(css)
+ try {
+ return postcss.parse(css)
+ } catch (e) {
+ this.addError(e)
+ return postcssSafeParser(css)
+ }
  }
 
+ /* eslint-disable class-methods-use-this */
  protected createSelectorParser(): CSSSelectorParser {
  return new CSSSelectorParser(this.sourceCode, this.commentContainer)
  }

lib/styles/parser/selector/scss-selector-parser.ts

@@ -300,8 +300,6 @@ function restoreInterpolationAndInlineComments<T extends PostCSSSPNode>(
  } = options
 
  if (node.source) {
- let startIndex = null
- let endIndex = null
  if (node.source.start) {
  const cssLoc = node.source.start
  const index = cssSourceCode.getIndexFromLoc({
@@ -312,7 +310,6 @@ function restoreInterpolationAndInlineComments<T extends PostCSSSPNode>(
  const scssLoc = scssSourceCode.getLocFromIndex(scssIndex)
  scssLoc.column++
  node.source.start = scssLoc
- startIndex = scssIndex
  }
  if (node.source.end) {
  const cssLoc = node.source.end
@@ -322,11 +319,8 @@ function restoreInterpolationAndInlineComments<T extends PostCSSSPNode>(
  })
  const scssIndex = remapContext.remapIndex(index)
  node.source.end = scssSourceCode.getLocFromIndex(scssIndex)
- endIndex = scssIndex
  }
- while (
- restoreInterpolations(node, startIndex, endIndex, interpolations)
- ) {
+ while (restoreInterpolations(node, interpolations)) {
  // loop
  }
  while (restoreComments(node, inlineComments)) {
@@ -341,70 +335,38 @@ function restoreInterpolationAndInlineComments<T extends PostCSSSPNode>(
  return node
 }
 
-/* eslint-disable complexity */
 /**
  * Restore interpolation for given node
  */
 function restoreInterpolations(
  node: PostCSSSPNode,
- startIndex: number | null,
- endIndex: number | null,
  interpolations: ReplaceInfo[],
 ): boolean {
- /* eslint-enable complexity */
  if (!interpolations.length) {
  return false
  }
- if (
- node.type === "root" ||
- node.type === "selector" ||
- node.type === "universal" || // *
- node.type === "nesting" || // &
- node.type === "comment"
- ) {
- return false
- }
- if (node.type === "string") {
- for (let index = 0; index < interpolations.length; index++) {
- const inter = interpolations[index]
- if (restoreReplaceNodeProp(node, "value", inter)) {
- interpolations.splice(index, 1)
- return true
- }
- }
- return false
- }
-
- const interpolationIndex = interpolations.findIndex(
- inter =>
- (startIndex == null || startIndex <= inter.start) &&
- (endIndex == null || inter.start < endIndex),
- )
- if (interpolationIndex < 0) {
- return false
- }
-
- const inter = interpolations[interpolationIndex]
-
+ const targetProperties = []
  if (
  node.type === "tag" ||
  node.type === "class" ||
  node.type === "id" ||
  node.type === "combinator" ||
- node.type === "pseudo"
+ node.type === "pseudo" ||
+ node.type === "string"
  ) {
- if (restoreReplaceNodeProp(node, "value", inter)) {
- interpolations.splice(interpolationIndex, 1)
- return true
- }
+ targetProperties.push("value")
  } else if (node.type === "attribute") {
- if (restoreReplaceNodeProp(node, "attribute", inter)) {
- interpolations.splice(interpolationIndex, 1)
- return true
- }
- if (restoreReplaceNodeProp(node, "value", inter)) {
- interpolations.splice(interpolationIndex, 1)
- return true
+ targetProperties.push("attribute")
+ targetProperties.push("value")
+ }
+
+ for (const prop of targetProperties) {
+ for (let index = 0; index < interpolations.length; index++) {
+ const interpolation = interpolations[index]
+ if (restoreReplaceNodeProp(node, prop, interpolation)) {
+ interpolations.splice(index, 1)
+ return true
+ }
  }
  }
 
@@ -426,23 +388,14 @@ function restoreComments(node: PostCSSSPNode, inlineComments: ReplaceInfo[]) {
  targetProperties.push("raws.spaces.after")
  targetProperties.push("raws.spaces.before")
  }
- if (!targetProperties.length) {
- return false
- }
 
  for (const prop of targetProperties) {
- const text = `${lodash.get(node, prop, "") || ""}`
- const commentIndex = inlineComments.findIndex(comment =>
- text.includes(comment.replace),
- )
- if (commentIndex < 0) {
- return false
- }
-
- const comment = inlineComments[commentIndex]
- if (restoreReplaceNodeProp(node, prop, comment)) {
- inlineComments.splice(commentIndex, 1)
- return true
+ for (let index = 0; index < inlineComments.length; index++) {
+ const comment = inlineComments[index]
+ if (restoreReplaceNodeProp(node, prop, comment)) {
+ inlineComments.splice(index, 1)
+ return true
+ }
  }
  }
  return false

lib/types.ts

@@ -1,4 +1,5 @@
-import { AST } from "vue-eslint-parser"
+// eslint-disable-next-line @mysticatea/node/no-missing-import
+import AST from "vue-eslint-parser/ast"
 import postcss from "postcss"
 import selectorParser from "postcss-selector-parser"
 // eslint-disable-next-line @mysticatea/node/no-extraneous-import

package.json

@@ -62,6 +62,7 @@
  "mocha": "^6.2.2",
  "nyc": "^14.1.1",
  "pack": "^2.2.0",
+ "postcss-safe-parser": "^4.0.1",
  "raw-loader": "^3.1.0",
  "rimraf": "^3.0.0",
  "ts-node": "^8.4.1",