search

phoenixframework / vscode-phoenix

Syntax highlighting support for Phoenix templates in Visual Studio Code.
https://marketplace.visualstudio.com/items?itemName=phoenixframework.phoenix
MIT License
157 stars 10 forks source link

Issues with < and > in Elixir Code #19

Open aj-foster opened 1 year ago

aj-foster commented 1 year ago

Hi there 👋🏼

Recently I reopened a project with HEEx files, and found that the syntax highlighing no longer handled some cases.

image

Specifically, it appears that any use of the < or > characters in the embedded Elixir code causes issues with the surrounding brackets and braces. While the exact cause is unclear to me, I imagine the highlighter may think of these characters as tag open or close markers despite the change in context.

Versions of things:

VS Code: 1.76.1 phoenixframework extension: v0.1.2 ElixirLS extension: v0.13.0

aj-foster commented 1 year ago

Upon further review, it appears this issue is not related to the grammar, and instead is related to VS Code's built-in bracket pair colorization. This issue has a related story for embedded TypeScript. However, the proposed solution may also require changes to the grammar.

In the meantime, users may selectively disable bracket pair colorization for HEEx using the following addition to their settings.json:

  "[phoenix-heex]": {
    "editor.bracketPairColorization.enabled": false
  },

Note that this will work for separate .heex files. There may also be a way to target this configuration for the ~H sigil.

RedCMD commented 6 months ago

you can disable symbols being used as brackets with "unbalancedBracketScopes" for example:

"unbalancedBracketScopes": [
    "invalid.illegal.characters-not-allowed-here.html",
    "entity.other.attribute-name.html"
]

image