refactor(language-core): share and simplify attribute value offset calculation logic

Author: KazariEX

packages/language-core/lib/codegen/template/element.ts

@@ -2,7 +2,7 @@ import * as CompilerDOM from '@vue/compiler-dom';
 import { camelize, capitalize } from '@vue/shared';
 import { toString } from 'muggle-string';
 import type { Code, VueCodeInformation } from '../../types';
-import { getElementTagOffsets, hyphenateTag, normalizeAttributeValue } from '../../utils/shared';
+import { getAttributeValueOffset, getElementTagOffsets, hyphenateTag } from '../../utils/shared';
 import { codeFeatures } from '../codeFeatures';
 import { createVBindShorthandInlayHintInfo } from '../inlayHints';
 import { endOfLine, identifierRegex, newLine } from '../utils';
@@ -451,7 +451,8 @@ function* generateElementReference(
 			&& prop.name === 'ref'
 			&& prop.value
 		) {
-			const [name, offset] = normalizeAttributeValue(prop.value);
+			const name = prop.value.content;
+			const offset = getAttributeValueOffset(prop.value);
 
 			// navigation support for `const foo = ref()`
 			yield `/** @type {typeof __VLS_ctx`;

packages/language-core/lib/codegen/template/elementProps.ts

@@ -2,7 +2,7 @@ import * as CompilerDOM from '@vue/compiler-dom';
 import { camelize } from '@vue/shared';
 import { isMatch } from 'picomatch';
 import type { Code, VueCodeInformation, VueCompilerOptions } from '../../types';
-import { hyphenateAttr, hyphenateTag } from '../../utils/shared';
+import { getAttributeValueOffset, hyphenateAttr, hyphenateTag } from '../../utils/shared';
 import { codeFeatures } from '../codeFeatures';
 import { createVBindShorthandInlayHintInfo } from '../inlayHints';
 import { identifierRegex, newLine } from '../utils';
@@ -285,21 +285,13 @@ export function* generatePropExp(
 }
 
 function* generateAttrValue(
-	attrNode: CompilerDOM.TextNode,
+	node: CompilerDOM.TextNode,
 	features: VueCodeInformation,
 ): Generator<Code> {
-	const quote = attrNode.loc.source.startsWith("'") ? "'" : '"';
+	const quote = node.loc.source.startsWith("'") ? "'" : '"';
+	const offset = getAttributeValueOffset(node);
 	yield quote;
-	let start = attrNode.loc.start.offset;
-	let content = attrNode.loc.source;
-	if (
-		(content.startsWith('"') && content.endsWith('"'))
-		|| (content.startsWith("'") && content.endsWith("'"))
-	) {
-		start++;
-		content = content.slice(1, -1);
-	}
-	yield* generateUnicode(content, start, features);
+	yield* generateUnicode(node.content, offset, features);
 	yield quote;
 }
 

packages/language-core/lib/codegen/template/slotOutlet.ts

@@ -1,6 +1,6 @@
 import * as CompilerDOM from '@vue/compiler-dom';
 import type { Code } from '../../types';
-import { getElementTagOffsets } from '../../utils/shared';
+import { getAttributeValueOffset, getElementTagOffsets } from '../../utils/shared';
 import { codeFeatures } from '../codeFeatures';
 import { createVBindShorthandInlayHintInfo } from '../inlayHints';
 import { endOfLine, newLine } from '../utils';
@@ -37,16 +37,11 @@ export function* generateSlotOutlet(
 		if (nameProp) {
 			let codes: Generator<Code> | Code[];
 			if (nameProp.type === CompilerDOM.NodeTypes.ATTRIBUTE && nameProp.value) {
-				let { source, start: { offset } } = nameProp.value.loc;
-				if (source.startsWith('"') || source.startsWith("'")) {
-					source = source.slice(1, -1);
-					offset++;
-				}
 				codes = generatePropertyAccess(
 					options,
 					ctx,
-					source,
-					offset,
+					nameProp.value.content,
+					getAttributeValueOffset(nameProp.value),
 					codeFeatures.navigationAndVerification,
 				);
 			}

packages/language-core/lib/codegen/template/styleScopedClasses.ts

@@ -1,7 +1,7 @@
 import * as CompilerDOM from '@vue/compiler-dom';
 import type * as ts from 'typescript';
 import type { Code } from '../../types';
-import { getNodeText, normalizeAttributeValue } from '../../utils/shared';
+import { getAttributeValueOffset, getNodeText } from '../../utils/shared';
 import { codeFeatures } from '../codeFeatures';
 import { endOfLine } from '../utils';
 import { generateEscaped } from '../utils/escaped';
@@ -61,26 +61,26 @@ export function collectStyleScopedClassReferences(
 				const getClassOffset = Reflect.get(prop.value.loc.start, 'getClassOffset') as (offset: number) => number;
 				const content = prop.value.loc.source.slice(1, -1);
 
-				let startOffset = 1;
+				let offset = 1;
 				for (const className of content.split(' ')) {
 					if (className) {
 						ctx.scopedClasses.push({
 							source: 'template',
 							className,
-							offset: getClassOffset(startOffset),
+							offset: getClassOffset(offset),
 						});
 					}
-					startOffset += className.length + 1;
+					offset += className.length + 1;
 				}
 			}
 			else {
-				const [content, startOffset] = normalizeAttributeValue(prop.value);
-				if (content) {
-					const classes = collectClasses(content, startOffset);
+				const offset = getAttributeValueOffset(prop.value);
+				if (prop.value.content) {
+					const classes = collectClasses(prop.value.content, offset);
 					ctx.scopedClasses.push(...classes);
 				}
 				else {
-					ctx.emptyClassOffsets.push(startOffset);
+					ctx.emptyClassOffsets.push(offset);
 				}
 			}
 		}

packages/language-core/lib/plugins/vue-template-inline-css.ts

@@ -1,7 +1,7 @@
 import * as CompilerDOM from '@vue/compiler-dom';
 import type { Code, VueLanguagePlugin } from '../types';
 import { forEachElementNode } from '../utils/forEachTemplateNode';
-import { normalizeAttributeValue } from '../utils/shared';
+import { getAttributeValueOffset } from '../utils/shared';
 import { allCodeFeatures } from './shared';
 
 const codeFeatures = {
@@ -41,12 +41,11 @@ function* generate(templateAst: NonNullable<CompilerDOM.RootNode>): Generator<Co
 				&& prop.name === 'style'
 				&& prop.value
 			) {
-				const [content, offset] = normalizeAttributeValue(prop.value);
 				yield `x { `;
 				yield [
-					content,
+					prop.value.content,
 					'template',
-					offset,
+					getAttributeValueOffset(prop.value),
 					codeFeatures,
 				];
 				yield ` }\n`;

packages/language-core/lib/utils/parseSfc.ts

@@ -9,6 +9,7 @@ import type {
 	SFCStyleBlock,
 	SFCTemplateBlock,
 } from '@vue/compiler-sfc';
+import { getAttributeValueOffset } from './shared';
 
 declare module '@vue/compiler-sfc' {
 	interface SFCDescriptor {
@@ -156,16 +157,10 @@ function parseAttr(p: CompilerDOM.AttributeNode, node: CompilerDOM.ElementNode)
 	if (!p.value) {
 		return true;
 	}
-	const text = p.value.content;
-	const source = p.value.loc.source;
-	let offset = p.value.loc.start.offset - node.loc.start.offset;
-	const quotes = source.startsWith('"') || source.startsWith("'");
-	if (quotes) {
-		offset++;
-	}
+	const offset = getAttributeValueOffset(p.value);
 	return {
-		text,
-		offset,
-		quotes,
+		text: p.value.content,
+		offset: offset - node.loc.start.offset,
+		quotes: offset > p.value.loc.start.offset,
 	};
 }

packages/language-core/lib/utils/shared.ts

@@ -14,17 +14,12 @@ export function hyphenateAttr(str: string) {
 	return hyphencase;
 }
 
-export function normalizeAttributeValue(node: CompilerDOM.TextNode) {
+export function getAttributeValueOffset(node: CompilerDOM.TextNode) {
 	let offset = node.loc.start.offset;
-	let content = node.loc.source;
-	if (
-		(content.startsWith(`'`) && content.endsWith(`'`))
-		|| (content.startsWith(`"`) && content.endsWith(`"`))
-	) {
+	if (node.loc.source.startsWith('"') || node.loc.source.startsWith("'")) {
 		offset++;
-		content = content.slice(1, -1);
 	}
-	return [content, offset] as const;
+	return offset;
 }
 
 export function getElementTagOffsets(