Change parser to allow parsing two script tags on <script setup>

Author: ota-meshi

Diff for: src/index.ts

@@ -7,7 +7,7 @@ import * as path from "path"
 import * as AST from "./ast"
 import { LocationCalculator } from "./common/location-calculator"
 import { HTMLParser, HTMLTokenizer } from "./html"
-import { parseScript, parseScriptElement } from "./script"
+import { parseScript, parseScriptElement, parseScriptElements } from "./script"
 import * as services from "./parser-services"
 import type { ParserOptions } from "./common/parser-options"
 
@@ -68,6 +68,15 @@ function getLang(
     return lang || defaultLang
 }
 
+/**
+ * Checks whether the given script element is `<script setup>`.
+ */
+function isScriptSetup(script: AST.VElement): boolean {
+    return script.startTag.attributes.some(
+        (attr) => !attr.directive && attr.key.name === "setup",
+    )
+}
+
 /**
  * Parse the given source code.
  * @param code The source code to parse.
@@ -101,11 +110,12 @@ export function parseForESLint(
         const skipParsingScript = options.parser === false
         const tokenizer = new HTMLTokenizer(code, options)
         const rootAST = new HTMLParser(tokenizer, options).parse()
+
         locationCalculator = new LocationCalculator(
             tokenizer.gaps,
             tokenizer.lineTerminators,
         )
-        const script = rootAST.children.find(isScriptElement)
+        const scripts = rootAST.children.filter(isScriptElement)
         const template = rootAST.children.find(isTemplateElement)
         const templateLang = getLang(template, "html")
         const concreteInfo: AST.HasConcreteInfo = {
@@ -118,10 +128,21 @@ export function parseForESLint(
                 ? Object.assign(template, concreteInfo)
                 : undefined
 
-        if (skipParsingScript || script == null) {
+        if (skipParsingScript || !scripts.length) {
             result = parseScript("", options)
+        } else if (
+            scripts.length === 2 &&
+            scripts.some(isScriptSetup) &&
+            scripts.some((e) => !isScriptSetup(e))
+        ) {
+            result = parseScriptElements(
+                scripts,
+                code,
+                new LocationCalculator([], tokenizer.lineTerminators),
+                options,
+            )
         } else {
-            result = parseScriptElement(script, locationCalculator, options)
+            result = parseScriptElement(scripts[0], locationCalculator, options)
         }
 
         result.ast.templateBody = templateBody

Diff for: src/script/index.ts

@@ -550,11 +550,10 @@ export function parseScriptElement(
     parserOptions: ParserOptions,
 ): ESLintExtendedProgram {
     const text = node.children[0]
-    const offset =
+    const { code, offset } =
         text != null && text.type === "VText"
-            ? text.range[0]
-            : node.startTag.range[1]
-    const code = text != null && text.type === "VText" ? text.value : ""
+            ? { code: text.value, offset: text.range[0] }
+            : { code: "", offset: node.startTag.range[1] }
     const locationCalculator = globalLocationCalculator.getSubCalculatorAfter(
         offset,
     )
@@ -566,14 +565,12 @@ export function parseScriptElement(
         const startTag = node.startTag
         const endTag = node.endTag
 
-        if (startTag != null) {
-            result.ast.tokens.unshift({
-                type: "Punctuator",
-                range: startTag.range,
-                loc: startTag.loc,
-                value: "<script>",
-            })
-        }
+        result.ast.tokens.unshift({
+            type: "Punctuator",
+            range: startTag.range,
+            loc: startTag.loc,
+            value: "<script>",
+        })
         if (endTag != null) {
             result.ast.tokens.push({
                 type: "Punctuator",
@@ -587,6 +584,126 @@ export function parseScriptElement(
     return result
 }
 
+/**
+ * Parse the source code of the given `<script>` elements.
+ * @param nodes The `<script>` elements to parse.
+ * @param code The source code of SFC.
+ * @param globalLocationCalculatorWithoutGapOffsets The location calculator for fixLocations.
+ * @param parserOptions The parser options.
+ * @returns The result of parsing.
+ */
+export function parseScriptElements(
+    nodes: VElement[],
+    code: string,
+    globalLocationCalculatorWithoutGapOffsets: LocationCalculator,
+    parserOptions: ParserOptions,
+): ESLintExtendedProgram {
+    let scriptCode = ""
+    let startOffset = 0
+    const tagTokens: Token[] = []
+
+    let firstScriptTextNode: Token | null = null
+    for (const node of nodes) {
+        const scriptTextNode = node.children[0]
+        if (scriptTextNode.type === "VText") {
+            const scriptText = code.slice(...scriptTextNode.range)
+            if (!scriptCode) {
+                firstScriptTextNode = scriptTextNode
+                scriptCode += scriptText
+            } else {
+                const spaces = code
+                    .slice(startOffset, scriptTextNode.range[0])
+                    // eslint-disable-next-line require-unicode-regexp -- ignore u flag
+                    .replace(/[^\n\r\u2028\u2029 ]/g, " ")
+                scriptCode += spaces + scriptText
+            }
+            startOffset = scriptTextNode.range[1]
+
+            const startTag = node.startTag
+            const endTag = node.endTag
+            tagTokens.push({
+                type: "Punctuator",
+                range: startTag.range,
+                loc: startTag.loc,
+                value: "<script>",
+            })
+            if (endTag != null) {
+                tagTokens.push({
+                    type: "Punctuator",
+                    range: endTag.range,
+                    loc: endTag.loc,
+                    value: "</script>",
+                })
+            }
+        }
+    }
+    const offset =
+        firstScriptTextNode != null
+            ? firstScriptTextNode.range[0]
+            : nodes[0].startTag.range[1]
+
+    const locationCalculator = globalLocationCalculatorWithoutGapOffsets.getSubCalculatorAfter(
+        offset,
+    )
+    const result = parseScriptFragment(
+        scriptCode,
+        locationCalculator,
+        parserOptions,
+    )
+
+    if (result.ast.comments != null) {
+        for (const comment of result.ast.comments) {
+            for (const tagToken of tagTokens) {
+                checkIntersect(tagToken, comment)
+            }
+        }
+    }
+    if (result.ast.tokens != null) {
+        const newTokens: Token[] = []
+        let tagToken = tagTokens.shift()
+        for (const token of result.ast.tokens) {
+            while (tagToken && tagToken.range[0] < token.range[0]) {
+                newTokens.push(tagToken)
+                tagToken = tagTokens.shift()
+            }
+            checkIntersect(tagToken, token)
+            newTokens.push(token)
+        }
+        if (tagToken) {
+            newTokens.push(tagToken, ...tagTokens)
+        }
+        result.ast.tokens = newTokens
+    }
+
+    return result
+
+    /**
+     * Check if the tokens intersect.
+     */
+    function checkIntersect(tagToken: Token | undefined, token: Token) {
+        if (tagToken) {
+            if (
+                token.range[0] < tagToken.range[0] &&
+                tagToken.range[0] < token.range[1]
+            ) {
+                throw new ParseError(
+                    token.type === "Template"
+                        ? "Unterminated template literal"
+                        : token.type === "Block"
+                        ? "Unterminated comment"
+                        : token.type === "String"
+                        ? "Unterminated string constant"
+                        : `Unterminated '${token.type}'`,
+                    undefined,
+                    tagToken.range[0],
+                    tagToken.loc.start.line,
+                    tagToken.loc.start.column,
+                )
+            }
+        }
+    }
+}
+
 /**
  * Parse the source code of inline scripts.
  * @param code The source code of inline scripts.