|
1 | | -import type { ParseResult } from "@astrojs/compiler" |
2 | | -import type { TagLikeNode, ParentNode } from "@astrojs/compiler/types" |
3 | 1 | import type { Context } from "." |
4 | 2 | import type { ESLintExtendedProgram } from "../parser" |
5 | 3 | import { traverseNodes } from "../traverse" |
6 | | -import { AST_TOKEN_TYPES, AST_NODE_TYPES } from "@typescript-eslint/types" |
7 | 4 | import type { TSESTree } from "@typescript-eslint/types" |
8 | 5 | import { ParseError } from "../errors" |
9 | | -import type { |
10 | | - AstroDoctype, |
11 | | - AstroHTMLComment, |
12 | | - AstroRootFragment, |
13 | | - AstroShorthandAttribute, |
14 | | - AstroTemplateLiteralAttribute, |
15 | | -} from "../ast" |
16 | | -import { |
17 | | - getAttributeEndOffset, |
18 | | - getAttributeValueStartOffset, |
19 | | - getStartTagEndOffset, |
20 | | - isTag, |
21 | | - walkElements, |
22 | | -} from "../astro" |
23 | | - |
24 | | -/** |
25 | | - * Process the template to generate a ScriptContext. |
26 | | - */ |
27 | | -export function processTemplate( |
28 | | - ctx: Context, |
29 | | - resultTemplate: ParseResult, |
30 | | -): ScriptContext { |
31 | | - const script = new ScriptContext(ctx) |
32 | | - |
33 | | - const frontmatter = resultTemplate.ast.children.find( |
34 | | - (n) => n.type === "frontmatter", |
35 | | - ) |
36 | | - let fragmentOpened = false |
37 | | - if (!frontmatter) { |
38 | | - script.appendScript("<>") |
39 | | - fragmentOpened = true |
40 | | - } |
41 | | - |
42 | | - walkElements(resultTemplate.ast, (node, parent) => { |
43 | | - if (node.type === "frontmatter") { |
44 | | - const start = node.position!.start.offset |
45 | | - script.appendOriginal(start) |
46 | | - script.skipOriginalOffset(3) |
47 | | - const end = node.position!.end!.offset |
48 | | - script.appendOriginal(end - 3) |
49 | | - |
50 | | - script.appendScript(";<>") |
51 | | - fragmentOpened = true |
52 | | - script.skipOriginalOffset(3) |
53 | | - |
54 | | - script.addRestoreNodeProcess((_scriptNode, result) => { |
55 | | - for (let index = 0; index < result.ast.body.length; index++) { |
56 | | - const st = result.ast.body[index] as TSESTree.Node |
57 | | - if (st.type === AST_NODE_TYPES.EmptyStatement) { |
58 | | - if (st.range[0] === end - 3 && st.range[1] === end) { |
59 | | - result.ast.body.splice(index, 1) |
60 | | - break |
61 | | - } |
62 | | - } |
63 | | - } |
64 | | - return true |
65 | | - }) |
66 | | - |
67 | | - script.addToken(AST_TOKEN_TYPES.Punctuator, [ |
68 | | - node.position!.start.offset, |
69 | | - node.position!.start.offset + 3, |
70 | | - ]) |
71 | | - script.addToken(AST_TOKEN_TYPES.Punctuator, [end - 3, end]) |
72 | | - } else if (isTag(node)) { |
73 | | - for (const attr of node.attributes) { |
74 | | - if (attr.kind === "shorthand") { |
75 | | - const start = attr.position!.start.offset |
76 | | - script.appendOriginal(start) |
77 | | - script.appendScript(`${attr.name}=`) |
78 | | - |
79 | | - script.addRestoreNodeProcess((scriptNode) => { |
80 | | - if ( |
81 | | - scriptNode.type === AST_NODE_TYPES.JSXAttribute && |
82 | | - scriptNode.range[0] === start |
83 | | - ) { |
84 | | - const attrNode = |
85 | | - scriptNode as unknown as AstroShorthandAttribute |
86 | | - attrNode.type = "AstroShorthandAttribute" |
87 | | - |
88 | | - const locs = ctx.getLocations( |
89 | | - ...attrNode.value.expression.range, |
90 | | - ) |
91 | | - attrNode.name.range = locs.range |
92 | | - attrNode.name.loc = locs.loc |
93 | | - return true |
94 | | - } |
95 | | - return false |
96 | | - }) |
97 | | - } else if (attr.kind === "template-literal") { |
98 | | - const start = getAttributeValueStartOffset(attr, ctx.code) |
99 | | - const end = getAttributeEndOffset(attr, ctx.code) |
100 | | - script.appendOriginal(start) |
101 | | - script.appendScript("{") |
102 | | - script.appendOriginal(end) |
103 | | - script.appendScript("}") |
104 | | - |
105 | | - script.addRestoreNodeProcess((scriptNode) => { |
106 | | - if ( |
107 | | - scriptNode.type === AST_NODE_TYPES.JSXAttribute && |
108 | | - scriptNode.range[0] === start |
109 | | - ) { |
110 | | - const attrNode = |
111 | | - scriptNode as unknown as AstroTemplateLiteralAttribute |
112 | | - attrNode.type = "AstroTemplateLiteralAttribute" |
113 | | - return true |
114 | | - } |
115 | | - return false |
116 | | - }) |
117 | | - } |
118 | | - } |
119 | | - |
120 | | - const end = getVoidSelfClosingTag(node, parent, ctx) |
121 | | - if (end && end.end === ">") { |
122 | | - script.appendOriginal(end.offset - 1) |
123 | | - script.appendScript("/") |
124 | | - } |
125 | | - if (node.name === "script" || node.name === "style") { |
126 | | - const text = node.children[0] |
127 | | - if (text && text.type === "text") { |
128 | | - const styleNodeStart = node.position!.start.offset |
129 | | - const start = text.position!.start.offset |
130 | | - script.appendOriginal(start) |
131 | | - script.skipOriginalOffset(text.value.length) |
132 | | - |
133 | | - script.addRestoreNodeProcess((scriptNode) => { |
134 | | - if ( |
135 | | - scriptNode.type === AST_NODE_TYPES.JSXElement && |
136 | | - scriptNode.range[0] === styleNodeStart |
137 | | - ) { |
138 | | - const textNode: TSESTree.JSXText = { |
139 | | - type: AST_NODE_TYPES.JSXText, |
140 | | - value: text.value, |
141 | | - raw: text.value, |
142 | | - parent: scriptNode, |
143 | | - ...ctx.getLocations( |
144 | | - start, |
145 | | - start + text.value.length, |
146 | | - ), |
147 | | - } |
148 | | - scriptNode.children = [textNode] |
149 | | - return true |
150 | | - } |
151 | | - return false |
152 | | - }) |
153 | | - script.addToken(AST_TOKEN_TYPES.JSXText, [ |
154 | | - start, |
155 | | - start + text.value.length, |
156 | | - ]) |
157 | | - } |
158 | | - } |
159 | | - } else if (node.type === "comment") { |
160 | | - const start = node.position!.start.offset |
161 | | - const length = 4 + node.value.length + 3 |
162 | | - script.appendOriginal(start) |
163 | | - let targetType: AST_NODE_TYPES |
164 | | - if (fragmentOpened) { |
165 | | - script.appendScript(`<></>`) |
166 | | - targetType = AST_NODE_TYPES.JSXFragment |
167 | | - } else { |
168 | | - script.appendScript(`0;`) |
169 | | - targetType = AST_NODE_TYPES.ExpressionStatement |
170 | | - } |
171 | | - script.skipOriginalOffset(length) |
172 | | - |
173 | | - script.addRestoreNodeProcess((scriptNode) => { |
174 | | - if ( |
175 | | - scriptNode.range[0] === start && |
176 | | - scriptNode.type === targetType |
177 | | - ) { |
178 | | - delete (scriptNode as any).children |
179 | | - delete (scriptNode as any).openingFragment |
180 | | - delete (scriptNode as any).closingFragment |
181 | | - delete (scriptNode as any).expression |
182 | | - const commentNode = |
183 | | - scriptNode as unknown as AstroHTMLComment |
184 | | - commentNode.type = "AstroHTMLComment" |
185 | | - commentNode.value = node.value |
186 | | - return true |
187 | | - } |
188 | | - return false |
189 | | - }) |
190 | | - script.addToken("HTMLComment" as AST_TOKEN_TYPES, [ |
191 | | - start, |
192 | | - start + length, |
193 | | - ]) |
194 | | - } else if (node.type === "doctype") { |
195 | | - const start = node.position!.start.offset |
196 | | - const end = node.position!.end!.offset |
197 | | - script.appendOriginal(start) |
198 | | - let targetType: AST_NODE_TYPES |
199 | | - if (fragmentOpened) { |
200 | | - script.appendScript(`<></>`) |
201 | | - targetType = AST_NODE_TYPES.JSXFragment |
202 | | - } else { |
203 | | - script.appendScript(`0;`) |
204 | | - targetType = AST_NODE_TYPES.ExpressionStatement |
205 | | - } |
206 | | - script.skipOriginalOffset(end - start) |
207 | | - |
208 | | - script.addRestoreNodeProcess((scriptNode) => { |
209 | | - if ( |
210 | | - scriptNode.range[0] === start && |
211 | | - scriptNode.type === targetType |
212 | | - ) { |
213 | | - delete (scriptNode as any).children |
214 | | - delete (scriptNode as any).openingFragment |
215 | | - delete (scriptNode as any).closingFragment |
216 | | - delete (scriptNode as any).expression |
217 | | - const doctypeNode = scriptNode as unknown as AstroDoctype |
218 | | - doctypeNode.type = "AstroDoctype" |
219 | | - return true |
220 | | - } |
221 | | - return false |
222 | | - }) |
223 | | - script.addToken("HTMLDocType" as AST_TOKEN_TYPES, [start, end]) |
224 | | - } |
225 | | - }) |
226 | | - |
227 | | - script.appendOriginal(ctx.code.length) |
228 | | - script.appendScript("</>") |
229 | | - |
230 | | - return script |
231 | | -} |
232 | | - |
233 | | -/** |
234 | | - * If the given tag is a void tag, get the self-closing tag. |
235 | | - */ |
236 | | -function getVoidSelfClosingTag( |
237 | | - node: TagLikeNode, |
238 | | - parent: ParentNode, |
239 | | - ctx: Context, |
240 | | -) { |
241 | | - if (node.type === "fragment") { |
242 | | - return false |
243 | | - } |
244 | | - if (node.children.length > 0) { |
245 | | - return false |
246 | | - } |
247 | | - const code = ctx.code |
248 | | - let nextElementIndex = code.length |
249 | | - const childIndex = parent.children.indexOf(node) |
250 | | - if (childIndex === parent.children.length - 1) { |
251 | | - // last |
252 | | - nextElementIndex = parent.position!.end!.offset |
253 | | - nextElementIndex = code.lastIndexOf("</", nextElementIndex) |
254 | | - } else { |
255 | | - const next = parent.children[childIndex + 1] |
256 | | - nextElementIndex = next.position!.start.offset |
257 | | - } |
258 | | - const endOffset = getStartTagEndOffset(node, code) |
259 | | - if (code.slice(endOffset, nextElementIndex).trim()) { |
260 | | - // has end tag |
261 | | - return null |
262 | | - } |
263 | | - return { |
264 | | - offset: endOffset, |
265 | | - end: code.slice(endOffset - 2, endOffset) === "/>" ? "/>" : ">", |
266 | | - } |
267 | | -} |
| 6 | +import type { AstroRootFragment } from "../ast" |
268 | 7 |
|
269 | 8 | export class ScriptContext { |
270 | 9 | private readonly ctx: Context |
|
0 commit comments