dlvandenberg / tree-sitter-angular

Tree Sitter Grammar for Angular
MIT License
38 stars 9 forks source link

Flickering while navigation in inline template and autocomplete not working inside nested template #38

Closed bphkns closed 2 months ago

bphkns commented 4 months ago

I am facing two issues in my setup.

Whenever I am navigating editing inside inline template there is a flickering.

https://github.com/user-attachments/assets/6f2e81e5-a0c0-47f9-b8c1-52cbf5e6bc69

Not getting autocomplete inside new control flow in component template files(separate HTML file). But in inline template it works a s intended.

image

Here are my configs. I am using lazyvim distro

return {
  {
    "neovim/nvim-lspconfig",
    opts = {
      ensure_installed = {
        "nxls",
        "angularls",
        "prettier",
        "emmet_ls",
      },
      servers = {
        angularls = {
          root_dir = function(fname)
            local util = require("lspconfig.util")
            -- Look for nx.json in parent directories
            return util.root_pattern("angular.json", "nx.json")(fname)
          end,
          filetypes = { "typescript", "html", "typescriptreact", "typescript.tsx", "htmlangular" },
        },
        vtsls = {
          settings = {
            complete_function_calls = false,
            typescript = {
              suggest = {
                completeFunctionCalls = false,
              },
            },
          },
        },
        emmet_ls = {
          filetypes = {
            "astro",
            "css",
            "eruby",
            "html",
            "htmldjango",
            "javascriptreact",
            "less",
            "pug",
            "sass",
            "scss",
            "svelte",
            "typescriptreact",
            "vue",
            "htmlangular",
          },
        },
      },
      inlay_hints = {
        enabled = false,
      },
      setup = {
        angularls = function()
          LazyVim.lsp.on_attach(function(client)
            --HACK: disable angular renaming capability due to duplicate rename popping up
            client.server_capabilities.renameProvider = false
          end, "angularls")
        end,
      },
    },
  },
  {
    "neovim/nvim-lspconfig",
    opts = function(_, opts)
      LazyVim.extend(opts.servers.vtsls, "settings.vtsls.tsserver.globalPlugins", {
        {
          name = "@angular/language-server",
          location = LazyVim.get_pkg_path("angular-language-server", "/node_modules/@angular/language-server"),
          enableForWorkspaceTypeScriptVersions = false,
        },
      })
    end,
  },
}
return {
  { "nvim-treesitter/playground" },
  {
    "nvim-treesitter",
    opts = function(_, opts)
      if type(opts.ensure_installed) == "table" then
        vim.list_extend(opts.ensure_installed, {
          "angular",
          "tsx",
          "typescript",
          "html",
          "yaml",
          "json",
          "css",
          "scss",
          "sql",
          "dockerfile",
          "prisma",
        })
      end
      vim.filetype.add({
        pattern = {
          [".*%.component%.html"] = "htmlangular", -- Sets the filetype to `htmlangular` if it matches the pattern
        },
      })
    end,
  },
}
dlvandenberg commented 3 months ago

I am using inline templates myself, but do not have such issues. I have autocomplete in inline-templates and in separate template files. What does :LspInfo give you? Is the LSP attached?

For the flickering, it might be some other plugin that's causing this. You have something that's highlighting the complete template code block. That's not something this parser does.

bphkns commented 3 months ago
Language client log: /Users/bikash/.local/state/nvim/lsp.log
 Detected filetype:   typescript

 5 client(s) attached to this buffer: 

 Client: angularls (id: 1, bufnr: [15])
    filetypes:       angular, html, typescript, typescriptreact, htmlangular
    autostart:       true
    root directory:  /Users/bikash/work/angular-frontend
    cmd:             ngserver --stdio --tsProbeLocations /Users/bikash/.local/share/nvim/mason/packages/angular-language-server/node_modules,/Users/bikash/work/angular-frontend/node_modules --ngProbeLocations /Users/bikash/.local/share/nvim/mason/packages/angular-language-server/node_modules/@angular/language-server/node_modules,/Users/bikash/work/angular-frontend/node_modules

 Client: eslint (id: 2, bufnr: [15])
    filetypes:       javascript, javascriptreact, javascript.jsx, typescript, typescriptreact, typescript.tsx, vue, svelte, astro
    autostart:       true
    root directory:  /Users/bikash/work/angular-frontend/libs/reports/search-reports/ui
    cmd:             /Users/bikash/.local/share/nvim/mason/bin/vscode-eslint-language-server --stdio

 Client: emmet_ls (id: 3, bufnr: [15])
    filetypes:       astro, html, typescript, typescriptreact, typescript.jsx, htmlangular, css, javascript, javascriptreact, scss, sass
    autostart:       true
    root directory:  /Users/bikash/work/angular-frontend
    cmd:             /Users/bikash/.local/share/nvim/mason/bin/emmet-ls --stdio

 Client: vtsls (id: 4, bufnr: [15])
    filetypes:       javascript, javascriptreact, javascript.jsx, typescript, typescriptreact, typescript.tsx
    autostart:       true
    root directory:  /Users/bikash/work/angular-frontend/libs/reports/search-reports/ui
    cmd:             /Users/bikash/.local/share/nvim/mason/bin/vtsls --stdio

 Client: tailwindcss (id: 5, bufnr: [15])
    filetypes:       aspnetcorerazor, astro, astro-markdown, blade, clojure, django-html, htmldjango, edge, eelixir, elixir, ejs, erb, eruby, gohtml, gohtmltmpl, haml, handlebars, hbs, html, htmlangular, html-eex, heex, jade, leaf, liquid, markdown, mdx, mustache, njk, nunjucks, php, razor, slim, twig, css, less, postcss, sass, scss, stylus, sugarss, javascript, javascriptreact, reason, rescript, typescript, typescriptreact, vue, svelte, templ
    autostart:       true
    root directory:  /Users/bikash/work/angular-frontend/libs/reports/search-reports/ui
    cmd:             /Users/bikash/.local/share/nvim/mason/bin/tailwindcss-language-server --stdio

 Configured servers list: vtsls, bashls, marksman, angularls, docker_compose_language_service, tailwindcss, lua_ls, eslint, dockerls, jsonls, emmet_ls
bphkns commented 3 months ago

setting

LspReferenceText = { bg = "none" } solved the issue. Doesn't know the side effects though.

:Inspect

Is giving the following output

msg_show.echo   Inspect Treesitter
  - @string.typescript links to String typescript
  - @tag.angular links to Tag angular

Extmarks
  - LspReferenceText vim_lsp_references