Glimmer grammar updates

[NullVoxPopuli]

This is stemming from an effort to move <template> support out of tree-sitter-javascript.
See this discussion: tree-sitter/tree-sitter-typescript#308

These 3 grammars are related

• https://github.com/NullVoxPopuli/tree-sitter-glimmer-javascript
  • JavaScript, no JSX, w/ one extra node for <template> parsing
• https://github.com/NullVoxPopuli/tree-sitter-glimmer-typescript
  • TypeScript, no TSX, w/ one extra node for <template> parsing
• https://github.com/ember-tooling/tree-sitter-glimmer
  • the language for between the <template> tags parsed in the above grammars

I tested this locally with packer, via

  use {
    -- 'nvim-treesitter/nvim-treesitter',
    '~/Development/OpenSource/nvim-treesitter',
    branch = "glimmer-updates",
    config = function()
      require("nvim-treesitter.install").prefer_git = true
      require 'nvim-treesitter.configs'.setup {
        autotag = {
          enable = true,
          filetypes = {
            "html",
            "javascript", "typescript",
            "typescript.glimmer", "javascript.glimmer",
            "javascriptreact", "typescriptreact",
            "markdown",
            "glimmer", "handlebars", "hbs", "svelte", "vue"
          }
        },
        ensure_installed = {
          -- Web Languages
          -- "javascript", "typescript",
          "html", "css", "regex",
          "ejs",
          -- Web Framework Languages
          "svelte",
          "glimmer", "glimmer_javascript", "glimmer_typescript",
          -- Web Transport Languages
          "graphql",
          -- Documentation Languages
          "markdown", "markdown_inline",
          -- "help", -- missing?
          -- "comment", -- slow?
          "jsdoc",
          -- Configuration Languages
          "toml", "jsonc", "yaml",
          "dockerfile",
          "lua", "vim",
          -- Scripting Languages
          "commonlisp",
          "bash",
          "jq",
          -- Systems Languages
          "c", "cmake",
          "rust",
          "go",
          -- Specifically for the treesitter AST
          "query",
          -- Utility Syntaxes
          "diff",
          "jq",
          "git_rebase", "gitcommit", "gitignore"
        },
        ignore_install = {
          "json" -- jsonc is better
        },
        highlight = {
          enable = true,
        },
        indent = {
          enable = true
        },
      }

      require('ts_context_commentstring').setup({})
      vim.g.skip_ts_context_commentstring_module = true
    end
  }

[clason]

Missing lockfile entries.

[ribru17]

Sorry for my ignorance: I am having trouble understanding glimmer and in what files it should apply, should something like the following be valid?

import { useStore } from '@builder.io/mitosis';

export default function SpecialTags() {
  const state = useStore({
    get scriptStr(): string {
      return `console.log('hello from script tag.')`;
    },
    styleStr: '.wrap { background-color: rgb(255, 0, 0); }',
  });
  return (
    <div>
      <template>
        <div>Template Tag Div</div>
      </template>
      <style data-testid="wrap-style" innerHTML={state.styleStr} />
      <div className="wrap">red content</div>
      <script data-testid="special-script" innerHTML={state.scriptStr} />
    </div>
  );
}

would this be a typescript.glimmer because of the <template> tag? Because right now the parser errors a bit for this ft. I may be misunderstanding in this PR in which case I think I don't have the expertise required to review it 😂

[NullVoxPopuli]

should something like the following be valid?

it would not, that is more JSX, and JSX is not allowed.

would this be a typescript.glimmer because of the <template> tag?

If the <template> is used in one of two ways: as a regular expressoin, and as a class body property/expression (I don't know the exact name of things that go in the class body)

• an expression
  e.g.:

  const example = 1;
  const Demo = <template>{{example}}</template>;
  const Demo2 = <template>
    <Demo />
    <div>{{example}}</div>
  </template>;

• as a class body expression

  const example = 1;
  
  class Demo {
    property = 2;
  
    <template>
       <p>{{this.property}}</p>
       <div>{{example}}</div>
    </template>       
  }

For more information,
GitHub already supports this if you want to look at the linguist grammars:

```gjs
code here
```

And the TS variant:

```glimmer-ts

// Linguist already bound gts to Gnome something, so we couldn't use the shorthand

```

Here is the community RFC where we explored several other grammars/syntaxes for having something with the benefits with both JSX and Static templates while also not having the downsides of those tools: emberjs/rfcs#779

[ribru17]

Ah, that makes sense. Thanks for clarifying!