completions.readme.md

Completion

General information

https://code.visualstudio.com/docs/editor/intellisense Aka: Completions

How to trigger in VSCode

Shortcut: Ctrl+i or Cmd+i, or by typing a trigger character (eg. <, ", Space, other) Command: Trigger Suggest

Feature list

Note: The | indicates your cursor position after the character, that should have been typed, eg. if foo.| is written, then you should type . (Dot) after foo.

• Aurelia keywords

  • <p><|</p>

  • <p |></p>

  • Examples:

    • repeat.for=""
    • <require from=""> (or import)
    • Full list (constants.ts)

• Class members (Variable and Methods)

  • <p if.bind="|"></p>

  • <p if="${|}"></p>

  • Note: Methods will be completed with arguments or just empty parenthesis

• Standard Javascript methods

  • <p if="${aStringVariables.|}"></p>

• Object completions

  • <p if="${obj.|}"></p>

• Value converters

  • <p if.bind="foo || "></p>

Limitations

• Method/Object completions don't work for imports, that are aliases, eg.
  • import 'alias/dir/files' <- Does not work
  • import '../../dir/files' <- Works
  • Why: We are using the Typescript Language Server, which does not seem to handle that
    • microsoft/TypeScript#25677
    • "Lets you set a base directory to resolve non-absolute module names." https://www.typescriptlang.org/tsconfig#baseUrl
• Typing in the middle of an Interpolation, eg. ${foo.| && bar} will not reliably trigger suggestions
  • Because we actually parse the expression and the . (Dot) after foo will throw a parser Error
• Custom Attributes not supported

Development

Backlog

• Value Converter arguments
• Binding Behavior
• Repeat for regions iterator (repeat.for="foo of fooList", then in the view, you should also get completions for foo. Ideally, the type of foo should be correct, but we could be hard to do)
  • Workaround: Define foo in your View Model, to get completions in other Aurelia regions.
• Access <let> definitions in view (Ideally, the typeshould be correct, but that could be hard to do)
• Access definitions from promise binding in view (Ideally, the typeshould be correct, but that could be hard to do). Promise attribute docs
• Contextual variables ($index or $odd)
• Support HTML-only Custom Elements
• Import from 3rd party libraries
• Account for Aurelia v1 and v2 (eg. only trigger v1 relevant suggestions)
• import| where you press Tab at | to turn it into a tag