Add integration tests for analyzing vue-class-component

test/interpolation/completion/class.test.ts

@@ -0,0 +1,116 @@
+import { activateLS, showFile, sleep, FILE_LOAD_SLEEP_TIME } from '../../lsp/helper';
+import { position, getDocUri } from '../util';
+import { testCompletion, testNoSuchCompletion } from './helper';
+import { CompletionItem, CompletionItemKind, MarkdownString } from 'vscode';
+
+describe('Should autocomplete interpolation for <template> in class component', () => {
+  const templateDocUri = getDocUri('completion/BasicClass.vue');
+  const parentTemplateDocUri = getDocUri('completion/ParentClass.vue');
+
+  before('activate', async () => {
+    await activateLS();
+    await showFile(templateDocUri);
+    await sleep(FILE_LOAD_SLEEP_TIME);
+    await sleep(FILE_LOAD_SLEEP_TIME);
+  });
+
+  const defaultList: CompletionItem[] = [
+    {
+      label: 'foo',
+      documentation: new MarkdownString('My foo').appendCodeblock(
+        `foo: {
+  type: Boolean,
+  default: false
+}`,
+        'js'
+      ),
+      kind: CompletionItemKind.Property
+    },
+    {
+      label: 'msg',
+      documentation: new MarkdownString('My msg').appendCodeblock(`msg = 'Vetur means "Winter" in icelandic.'`, 'js'),
+      kind: CompletionItemKind.Property
+    },
+    {
+      label: 'count',
+      documentation: new MarkdownString('My count').appendCodeblock(
+        `get count () {
+  return this.$store.state.count
+}`,
+        'js'
+      ),
+      kind: CompletionItemKind.Property
+    },
+    {
+      label: 'hello',
+      documentation: new MarkdownString('My greeting').appendCodeblock(
+        `hello () {
+  console.log(this.msg)
+}`,
+        'js'
+      ),
+
+      kind: CompletionItemKind.Method
+    }
+  ];
+
+  describe('Should complete props, data, computed and methods', () => {
+    it('completes inside {{ }}', async () => {
+      await testCompletion(templateDocUri, position(2, 7), defaultList);
+    });
+
+    it(`completes child component tag`, async () => {
+      await testCompletion(parentTemplateDocUri, position(4, 5), [
+        {
+          label: 'basic-class',
+          documentationStart: 'My basic tag\n```js\n@Component('
+        }
+      ]);
+    });
+
+    it(`completes child component's props`, async () => {
+      await testCompletion(parentTemplateDocUri, position(2, 18), [
+        {
+          label: 'foo',
+          documentation: new MarkdownString('My foo').appendCodeblock(
+            `foo: {
+  type: Boolean,
+  default: false
+}`,
+            'js'
+          )
+        }
+      ]);
+    });
+
+    it('completes inside v-if=""', async () => {
+      await testCompletion(parentTemplateDocUri, position(3, 23), defaultList);
+    });
+    it(`doesn't completes on the edge " of v-if=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 22), defaultList);
+    });
+    it(`doesn't completes on the edge " of v-if=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 24), defaultList);
+    });
+
+    it('completes inside @click=""', async () => {
+      await testCompletion(parentTemplateDocUri, position(3, 33), defaultList);
+    });
+    it(`doesn't completes on the edge " of @click=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 32), defaultList);
+    });
+    it(`doesn't completes on the edge " of @click=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 34), defaultList);
+    });
+
+    it('completes inside :foo=""', async () => {
+      await testCompletion(parentTemplateDocUri, position(3, 41), defaultList);
+    });
+    it(`doesn't completes on the edge " of :foo=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 40), defaultList);
+    });
+    it(`doesn't completes on the edge " of :foo=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 42), defaultList);
+    });
+  });
+});

test/interpolation/completion/property.test.ts

@@ -0,0 +1,110 @@
+import { activateLS, showFile, sleep, FILE_LOAD_SLEEP_TIME } from '../../lsp/helper';
+import { position, getDocUri } from '../util';
+import { testCompletion, testNoSuchCompletion } from './helper';
+import { CompletionItem, CompletionItemKind, MarkdownString } from 'vscode';
+
+describe('Should autocomplete interpolation for <template> in property class component', () => {
+  const templateDocUri = getDocUri('completion/BasicPropertyClass.vue');
+  const parentTemplateDocUri = getDocUri('completion/ParentPropertyClass.vue');
+
+  before('activate', async () => {
+    await activateLS();
+    await showFile(templateDocUri);
+    await sleep(FILE_LOAD_SLEEP_TIME);
+    await sleep(FILE_LOAD_SLEEP_TIME);
+  });
+
+  const defaultList: CompletionItem[] = [
+    {
+      label: 'foo',
+      documentation: new MarkdownString('My foo').appendCodeblock(
+        `@Prop({ type: Boolean, default: false }) foo`,
+        'js'
+      ),
+      kind: CompletionItemKind.Property
+    },
+    {
+      label: 'msg',
+      documentation: new MarkdownString('My msg').appendCodeblock(`msg = 'Vetur means "Winter" in icelandic.'`, 'js'),
+      kind: CompletionItemKind.Property
+    },
+    {
+      label: 'count',
+      documentation: new MarkdownString('My count').appendCodeblock(
+        `get count () {
+  return this.$store.state.count
+}`,
+        'js'
+      ),
+      kind: CompletionItemKind.Property
+    },
+    {
+      label: 'hello',
+      documentation: new MarkdownString('My greeting').appendCodeblock(
+        `hello () {
+  console.log(this.msg)
+}`,
+        'js'
+      ),
+
+      kind: CompletionItemKind.Method
+    }
+  ];
+
+  describe('Should complete props, data, computed and methods', () => {
+    it('completes inside {{ }}', async () => {
+      await testCompletion(templateDocUri, position(2, 7), defaultList);
+    });
+
+    it(`completes child component tag`, async () => {
+      await testCompletion(parentTemplateDocUri, position(4, 5), [
+        {
+          label: 'basic-property-class',
+          documentationStart: 'My basic tag\n```js\n@Component('
+        }
+      ]);
+    });
+
+    it(`completes child component's props`, async () => {
+      await testCompletion(parentTemplateDocUri, position(2, 27), [
+        {
+          label: 'foo',
+          documentation: new MarkdownString('My foo').appendCodeblock(
+            `@Prop({ type: Boolean, default: false }) foo`,
+            'js'
+          )
+        }
+      ]);
+    });
+
+    it('completes inside v-if=""', async () => {
+      await testCompletion(parentTemplateDocUri, position(3, 32), defaultList);
+    });
+    it(`doesn't completes on the edge " of v-if=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 31), defaultList);
+    });
+    it(`doesn't completes on the edge " of v-if=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 33), defaultList);
+    });
+
+    it('completes inside @click=""', async () => {
+      await testCompletion(parentTemplateDocUri, position(3, 42), defaultList);
+    });
+    it(`doesn't completes on the edge " of @click=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 41), defaultList);
+    });
+    it(`doesn't completes on the edge " of @click=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 43), defaultList);
+    });
+
+    it('completes inside :foo=""', async () => {
+      await testCompletion(parentTemplateDocUri, position(3, 50), defaultList);
+    });
+    it(`doesn't completes on the edge " of :foo=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 49), defaultList);
+    });
+    it(`doesn't completes on the edge " of :foo=""`, async () => {
+      await testNoSuchCompletion(parentTemplateDocUri, position(3, 51), defaultList);
+    });
+  });
+});

test/interpolation/fixture/completion/BasicClass.vue

@@ -0,0 +1,45 @@
+<template>
+  <div>
+    {{  }}
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import Component from 'vue-class-component'
+
+/**
+ * My basic tag
+ */
+@Component({
+  props: {
+    /**
+     * My foo
+     */
+    foo: {
+      type: Boolean,
+      default: false
+    }
+  }
+})
+export default class BasicClass extends Vue {
+  /**
+   * My msg
+   */
+  msg = 'Vetur means "Winter" in icelandic.'
+
+  /**
+   * My count
+   */
+  get count () {
+    return this.$store.state.count
+  }
+
+  /**
+   * My greeting
+   */
+  hello () {
+    console.log(this.msg)
+  }
+}
+</script>

test/interpolation/fixture/completion/BasicPropertyClass.vue

@@ -0,0 +1,40 @@
+<template>
+  <div>
+    {{  }}
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import { Prop, Component } from 'vue-property-decorator'
+
+/**
+ * My basic tag
+ */
+@Component()
+export default class BasicPropertyClass extends Vue {
+  /**
+   * My foo
+   */
+  @Prop({ type: Boolean, default: false }) foo
+
+  /**
+   * My msg
+   */
+  msg = 'Vetur means "Winter" in icelandic.'
+
+  /**
+   * My count
+   */
+  get count () {
+    return this.$store.state.count
+  }
+
+  /**
+   * My greeting
+   */
+  hello () {
+    console.log(this.msg)
+  }
+}
+</script>

test/interpolation/fixture/completion/ParentClass.vue

@@ -0,0 +1,48 @@
+<template>
+  <div>
+    <basic-class :></basic-class>
+    <basic-class v-if="" @click="" :foo=""></basic-class>
+    <
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import BasicClass from './BasicClass.vue'
+import Component from 'vue-class-component'
+
+@Component({
+  components: {
+    BasicClass
+  },
+  props: {
+    /**
+     * My foo
+     */
+    foo: {
+      type: Boolean,
+      default: false
+    },
+  }
+})
+export default class ParentClass extends Vue {
+  /**
+   * My msg
+   */
+  msg = 'Vetur means "Winter" in icelandic.'
+
+  /**
+   * My count
+   */
+  get count () {
+    return this.$store.state.count
+  }
+
+  /**
+   * My greeting
+   */
+  hello () {
+    console.log(this.msg)
+  }
+}
+</script>