test: add scoped classes renaming case (#4727)

vuejs · Aug 26, 2024 · 29b13cf · 29b13cf
1 parent 0e2db19
commit 29b13cf
Show file tree

Hide file tree

Showing 2 changed files with 90 additions and 0 deletions.
diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts
@@ -713,6 +713,9 @@ function* generateReferencesForScopedCssClasses(
 						if (ts.isIdentifier(name)) {
 							walkIdentifier(name);
 						}
+						else if (ts.isStringLiteral(name)) {
+							literals.push(name);
+						}
 						else if (ts.isComputedPropertyName(name)) {
 							const { expression } = name;
 							if (ts.isStringLiteralLike(expression)) {

diff --git a/packages/language-server/tests/renaming.spec.ts b/packages/language-server/tests/renaming.spec.ts
@@ -790,6 +790,93 @@ describe('Renaming', async () => {
 		`);
 	});
 
+	it('Scoped Classes', async () => {
+		expect(
+			await requestRename('fixture.vue', 'vue', `
+				<template>
+					<div :class="'foo|'"></div>
+					<div :class="['foo', { 'foo': true }]"></div>
+					<div :class="{ foo }"></div>
+				</template>
+				<style scoped>
+				.foo { }
+				</style>
+			`, 'bar')
+		).toMatchInlineSnapshot(`
+			{
+			  "changes": {
+			    "file://\${testWorkspacePath}/fixture.vue": [
+			      {
+			        "newText": "bar",
+			        "range": {
+			          "end": {
+			            "character": 23,
+			            "line": 4,
+			          },
+			          "start": {
+			            "character": 20,
+			            "line": 4,
+			          },
+			        },
+			      },
+			      {
+			        "newText": "bar",
+			        "range": {
+			          "end": {
+			            "character": 32,
+			            "line": 3,
+			          },
+			          "start": {
+			            "character": 29,
+			            "line": 3,
+			          },
+			        },
+			      },
+			      {
+			        "newText": "bar",
+			        "range": {
+			          "end": {
+			            "character": 23,
+			            "line": 3,
+			          },
+			          "start": {
+			            "character": 20,
+			            "line": 3,
+			          },
+			        },
+			      },
+			      {
+			        "newText": "bar",
+			        "range": {
+			          "end": {
+			            "character": 22,
+			            "line": 2,
+			          },
+			          "start": {
+			            "character": 19,
+			            "line": 2,
+			          },
+			        },
+			      },
+			      {
+			        "newText": "bar",
+			        "range": {
+			          "end": {
+			            "character": 8,
+			            "line": 7,
+			          },
+			          "start": {
+			            "character": 5,
+			            "line": 7,
+			          },
+			        },
+			      },
+			    ],
+			  },
+			}
+		`);
+	});
+
 	const openedDocuments: TextDocument[] = [];
 
 	afterEach(async () => {