Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

(fix) fix event completion with createEventDispatcher or with multiple declarations of the same event #1083

Merged
merged 2 commits into from
Jul 6, 2021
Merged

(fix) fix event completion with createEventDispatcher or with multiple declarations of the same event #1083

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
def529b
(fix) fix createEventDispatcher event completion
jasonlyu123 Jul 3, 2021
f6c05a5
add test for event def with multiple declarations
jasonlyu123 Jul 6, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions packages/language-server/src/plugins/typescript/ComponentInfoProvider.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,14 +57,16 @@ export class JsOrTsComponentInfoProvider implements ComponentInfoProvider {
return type
.getProperties()
.map((prop) => {
if (!prop.valueDeclaration) {
// type would still be correct when there're multiple declarations
const declaration = prop.valueDeclaration ?? prop.declarations?.[0];
if (!declaration) {
return;
}

return {
name: prop.name,
type: this.typeChecker.typeToString(
this.typeChecker.getTypeOfSymbolAtLocation(prop, prop.valueDeclaration)
this.typeChecker.getTypeOfSymbolAtLocation(prop, declaration)
),
doc: ts.displayPartsToString(prop.getDocumentationComment(this.typeChecker))
};
Expand Down
79 changes: 71 additions & 8 deletions packages/language-server/test/plugins/typescript/features/CompletionProvider.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ describe('CompletionProviderImpl', () => {

const completions = await completionProvider.getCompletions(
document,
Position.create(4, 5),
Position.create(5, 5),
{
triggerKind: CompletionTriggerKind.Invoked
}
Expand Down Expand Up @@ -158,7 +158,7 @@ describe('CompletionProviderImpl', () => {

const completions = await completionProvider.getCompletions(
document,
Position.create(4, 10),
Position.create(5, 10),
{
triggerKind: CompletionTriggerKind.Invoked
}
Expand All @@ -183,11 +183,11 @@ describe('CompletionProviderImpl', () => {
newText: 'on:a',
range: {
start: {
line: 4,
line: 5,
character: 7
},
end: {
line: 4,
line: 5,
character: 10
}
}
Expand All @@ -205,11 +205,11 @@ describe('CompletionProviderImpl', () => {
newText: 'on:b',
range: {
start: {
line: 4,
line: 5,
character: 7
},
end: {
line: 4,
line: 5,
character: 10
}
}
Expand All @@ -224,11 +224,11 @@ describe('CompletionProviderImpl', () => {
newText: 'on:c',
range: {
start: {
line: 4,
line: 5,
character: 7
},
end: {
line: 4,
line: 5,
character: 10
}
}
Expand All @@ -237,6 +237,33 @@ describe('CompletionProviderImpl', () => {
]);
});

it('provides event completions from createEventDispatcher', async () => {
const { completionProvider, document } = setup('component-events-completion.svelte');

const completions = await completionProvider.getCompletions(
document,
Position.create(6, 5),
{
triggerKind: CompletionTriggerKind.Invoked
}
);

const eventCompletions = completions!.items.filter((item) => item.label.startsWith('on:'));

assert.deepStrictEqual(eventCompletions, <CompletionItem[]>[
{
detail: 'c: CustomEvent<boolean>',
documentation: {
kind: 'markdown',
value: 'abc'
},
label: 'on:c',
sortText: '-1',
textEdit: undefined
}
]);
});

it('provides event completion for components with type definition', async () => {
const { completionProvider, document } = setup('component-events-completion-ts-def.svelte');

Expand Down Expand Up @@ -295,6 +322,42 @@ describe('CompletionProviderImpl', () => {
]);
});

it('provides event completion for components with type definition having multiple declarations of the same event', async () => {
const { completionProvider, document } = setup('component-events-completion-ts-def.svelte');

const completions = await completionProvider.getCompletions(
document,
Position.create(6, 17),
{
triggerKind: CompletionTriggerKind.Invoked
}
);

const eventCompletions = completions!.items.filter((item) => item.label.startsWith('on:'));

assert.deepStrictEqual(eventCompletions, <CompletionItem[]>[
{
detail: 'event1: CustomEvent<string> | CustomEvent<number>',
label: 'on:event1',
sortText: '-1',
documentation: '',
textEdit: {
newText: 'on:event1',
range: {
end: {
character: 18,
line: 6
},
start: {
character: 15,
line: 6
}
}
}
}
]);
});

it('does not provide completions inside style tag', async () => {
const { completionProvider, document } = setup('completionsstyle.svelte');

Expand Down
13 changes: 12 additions & 1 deletion packages/language-server/test/plugins/typescript/testfiles/completions/ComponentDef.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,17 @@ export class ComponentDef extends SvelteComponentTyped<
* documentation for let2
*/
let2: string;
}
};
}
> {}

export class ComponentDef2 extends SvelteComponentTyped<
{},
| {
event1: CustomEvent<number>;
}
| {
event1: CustomEvent<string>;
},
{}
> {}
5 changes: 3 additions & 2 deletions ...r/test/plugins/typescript/testfiles/completions/component-events-completion-ts-def.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
<script>
import { ComponentDef } from './ComponentDef';
import { ComponentDef, ComponentDef2 } from './ComponentDef';
</script>

<ComponentDef on:></ComponentDef>
<ComponentDef let:></ComponentDef>
<ComponentDef let:></ComponentDef>
<ComponentDef2 on:></ComponentDef2>
4 changes: 3 additions & 1 deletion ...e-server/test/plugins/typescript/testfiles/completions/component-events-completion.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<script lang="ts">
import CEI from './component-events-interface.svelte';
import CED from './component-events-event-dispatcher.svelte';
</script>

<CEI on: />
<CEI on: />
<CED on: />
8 changes: 8 additions & 0 deletions ...er/test/plugins/typescript/testfiles/completions/component-events-event-dispatcher.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<script lang="ts">
import { createEventDispatcher } from 'svelte';

const dispatch = createEventDispatcher<{
/**abc*/
c: boolean
}>()
</script>