Quest: Template imports support

[lifeart]

In scope of this activity we have to:

• Teach uELS about .gts and .gjs files feat: basic template imports support (<template> tag and gts, gjs files) #350
• Collect .gts and .gjs into global registry (components and tests only) feat: basic template imports support (<template> tag and gts, gjs files) #350
• Be able to extract <template> tags from .gts and .gjs files feat: basic template imports support (<template> tag and gts, gjs files) #350
• Lint content inside <template> tag using ember-template-lint feat: basic template imports support (<template> tag and gts, gjs files) #350
• Suggest scoped variables for autocomplete feat: basic template imports support (<template> tag and gts, gjs files) #350
• Support legacy go-to definition mode for components inside <template> feat: legacy completion and definition modes for template imports #354
• Support legacy autocomplete mode for components inside <template> feat: legacy completion and definition modes for template imports #354
• Collect template tokens (based on scope import paths) for <templates>
• Suggest only valid scoped variables for autocomplete
• Support go-to definition based on scoped imports
• Do not emit template-lint error for scoped helpers/modifiers
• Support auto-insert import during autocomplete (default exports only) feat: template suggestion import #356

[bartocc]

Hi @lifeart

In VSCode, I lose the go-to-definition feature in .gts (Glimmer TS language) files, even on a basic import A from "path/to/file".

If I change the language from Glimmer TS to Typescript, go-to-definition works again.

Is this supposed to be already supported?

[lifeart]

Hi @bartocc, thank you for your report!
Yes, at the moment we work with gts/gjs files only inside template scope: https://github.com/lifeart/ember-language-server/blob/component-context-info-origin/src/definition-providers/glimmer-script.ts

I think it's a good suggestion to support go-to definition here!

In addition, could you check how go-to definition working with https://github.com/typed-ember/glint/ and glint vscode extension installed?

[bartocc]

It works great with Glint and its vs code extension!

What I don't really understand now is how the Glint Language Server relates to uELS…

Do we need both? Is one expected to replace the other at some point in the future?

[lifeart]

@bartocc great! Glint is primary about typings, and does not support extensions, template linting, related files discovery, and it's autocomplete works only for ts projects. I would suggest to use both to get all benifits.

[NullVoxPopuli]

I just noticed that (in both neovim and vscode), template-lint isn't running within <template> tags, despite the ember-language-server "being active" (but is working in plain hbs files) -- what can I do to debug?

[lifeart]

@NullVoxPopuli it may be a problem with template-lint version,
here we checking for v5 https://github.com/lifeart/ember-language-server/blob/component-context-info-origin/src/template-linter.ts#L102C9-L102C28 to not create custom <template> handlers. You may try to debug from this point.

Or it may be pnpm issue (may be a case LS unable to find entrypoint for template-lint) https://github.com/lifeart/ember-language-server/blob/component-context-info-origin/src/template-linter.ts#L246

[NullVoxPopuli]

well, it could be that we just can't make assumptions about where / how node_modules are kept.

My node-why script, which uses require-resolves, points at:

❯ node-why ember-template-lint

  Node resolves ember-template-lint to 
     /home/nvp/Development/NullVoxPopuli/limber/node_modules/.pnpm/ember-template-lint@5.13.0/node_modules/ember-template-lint/lib/index.js

     Which is @ 5.13.0

however, .bin directories seem to be standardized across all tools:

❯ la node_modules/.bin/
Permissions Size User Date Modified Name
...
.rwxr-xr-x  1.5k nvp  11 Dec 11:41  ember-template-lint
...

Maybe it'd be better to do:

const require = module.createRequire(import.meta.url);
const pathOfDep = require.resolve(`ember-template-lint`, {
  paths: [
    process.cwd(), // really, the project-directory of the current file (findup(package.json))
  ]
});

// ember-template-lint/lib/
const libDirectory = path.dirname(pathOfDep);

[lifeart]

@NullVoxPopuli process.cwd is not necessary root of the ember app / node_modules, we have workspaces, where root may be an monorepo and child folders - ember projects.

In addition, we still bundling & compiling to cjs for node. import.meta.url - likely won't work as expected.

But I really like idea about .bin folder! We have to figure out simple steps to check .bins around ember project for template-lint