Test(Language Service): getClassPosition support for Vue and Svelte f…

…iles
master-co · Mar 30, 2024 · 5ed2f64 · 5ed2f64
1 parent b43049e
commit 5ed2f64
Show file tree

Hide file tree

Showing 2 changed files with 96 additions and 1 deletion.
diff --git a/packages/language-service/src/utils/create-doc.ts b/packages/language-service/src/utils/create-doc.ts
@@ -9,7 +9,9 @@ const languageIdOfExt = {
     scss: 'scss',
     less: 'less',
     html: 'html',
-    json: 'json'
+    json: 'json',
+    vue: 'vue',
+    svelte: 'svelte',
 }
 
 export default function createDoc(ext: keyof typeof languageIdOfExt, content: string) {

diff --git a/packages/language-service/tests/get-class-position.test.ts b/packages/language-service/tests/get-class-position.test.ts
@@ -56,4 +56,97 @@ describe('react', () => {
             token: target
         })
     })
+})
+
+
+describe('vue', () => {
+
+})
+
+describe('vue', () => {
+    test('class in class array', () => {
+        const target = 'class-a'
+        const contents = ['<div class="[ isActive && `', target, '` ]"></div>']
+        const doc = createDoc('vue', contents.join(''))
+        const languageService = new CSSLanguageService()
+        expect(languageService.getClassPosition(doc, { line: 0, character: contents[0].length })).toEqual({
+            range: {
+                start: contents[0].length,
+                end: contents[0].length + target.length
+            },
+            token: target
+        })
+    })
+
+    test('class in object syntax', () => {
+        const target = 'class-a'
+        const contents = ['<div class="{ \'', target, '\': isActive }"></div>']
+        const doc = createDoc('vue', contents.join(''))
+        const languageService = new CSSLanguageService()
+        expect(languageService.getClassPosition(doc, { line: 0, character: contents[0].length })).toEqual({
+            range: {
+                start: contents[0].length,
+                end: contents[0].length + target.length
+            },
+            token: target
+        })
+    })
+
+    test('class in ternary operator', () => {
+        const target = 'class-a'
+        const contents = ['<div class="isActive ? \'', target, '\' : inactiveClass"></div>']
+        const doc = createDoc('vue', contents.join(''))
+        const languageService = new CSSLanguageService()
+        expect(languageService.getClassPosition(doc, { line: 0, character: contents[0].length })).toEqual({
+            range: {
+                start: contents[0].length,
+                end: contents[0].length + target.length
+            },
+            token: target
+        })
+    })
+
+    test('class in v-bind', () => {
+        const target = 'class-a'
+        const contents = ['<div v-bind:class="', target, '"></div>']
+        const doc = createDoc('vue', contents.join(''))
+        const languageService = new CSSLanguageService()
+        expect(languageService.getClassPosition(doc, { line: 0, character: contents[0].length })).toEqual({
+            range: {
+                start: contents[0].length,
+                end: contents[0].length + target.length
+            },
+            token: target
+        })
+    })
+})
+
+describe('svelte', () => {
+    test('class in ternary operator', () => {
+        const target = 'class-a'
+        const contents = ['<div class="{ isActive ? \'', target , '\' : inactiveClass }"></div>']
+        const doc = createDoc('svelte', contents.join(''))
+        const languageService = new CSSLanguageService()
+        expect(languageService.getClassPosition(doc, { line: 0, character: contents[0].length })).toEqual({
+            range: {
+                start: contents[0].length,
+                end: contents[0].length + target.length
+            },
+            token: target
+        })
+    })
+
+    test('class in object syntax', () => {
+        const target = 'class-b'
+        const contents = ['<div class:', target, '={isActive}"></div>']
+        const doc = createDoc('svelte', contents.join(''))
+        const languageService = new CSSLanguageService()
+        expect(languageService.getClassPosition(doc, { line: 0, character: contents[0].length })).toEqual({
+            range: {
+                start: contents[0].length,
+                end: contents[0].length + target.length
+            },
+            token: target
+        })
+    })
 })