Thom1729 / Sublime-JS-Custom

Customizable JavaScript syntax highlighting for Sublime Text.
MIT License
137 stars 9 forks source link

React closing tags no longer autocomplete #114

Closed bcomnes closed 3 years ago

bcomnes commented 3 years ago

It seems like JSX closing tags no longer auto complete like they used to. Any way to fix that?

Thom1729 commented 3 years ago

I've confirmed the issue on v4.0.3. Is this the version you're running?

Thom1729 commented 3 years ago

I've fixed the issue in v4.0.4. The jsx_close_tag command is a bit brittle, and a change in JSX scoping (ironically to improve commenting behavior) broke tag closing. For now, I've updated the command with the correct scopes. In the future, I should probably rewrite it to be less brittle.

Please let me know if the problem persists in v4.0.4.

bcomnes commented 3 years ago

Working again in v4.0.4! Thanks!

bcomnes commented 3 years ago

Reopening this issue because I found another use case where it isn't working:

If you change the scope of the react config to source.jsx, and update the jsx_close_tag to include that, tag completion breaks again.

Example use config:

{
  "defaults": {
    "custom_template_tags": false,
    "eslint_directives": true,
    "jsx": false,
    "custom_templates": {
      "tags": {
          "css": "scope:source.css",
          "csjs": "scope:source.css",
          "(s) => ":  "scope:source.css",
          "html": "scope:text.html.basic",
          "this.html": "scope:text.html.basic",
      },
      "comments": {
        "GraphQL": "scope:source.graphql",
        "gql": "scope:source.graphql"
      }
    }
  },
  "jsx_close_tag": "source.js, source.ts, source.tsx, source.jsx",
  "configurations": {
    "Default": {},
    "React": {
        "file_extensions": [ "js", "jsx" ],
        "flow_types": true,
        "jsx": true,
        "scope": "source.jsx"
    },
    "TypeScript": {
        "scope": "source.ts",
        "file_extensions": [ "ts" ],
        "typescript": true,
    },
    "TypeScript (JSX)": {
        "scope": "source.tsx",
        "file_extensions": [ "tsx" ],
        "typescript": true,
        "jsx": true
    }
  }
}

Is this a bug or did I get the config wrong somehow?

Thom1729 commented 3 years ago

Fixed in v4.0.5.

The jsx_close_tag setting determines in which scopes the close_tag command will be replaced by the jsx_close_tag command. Previously, source.jsx was not in the default list. This could be manually changed, but it made sense to update the defaults here.

bcomnes commented 3 years ago

I got the update but when I set the React scope to JSX ("scope": "source.jsx"), the tag autocomplete doesn't work (nothing happens), even though source.jsx is in the jsx_close_tag string.

Want me to open a new issue?

Thom1729 commented 3 years ago

Fixed in v4.0.6.

The jsx_close_tag command is initiated in two ways. If anything causes close_tag to run, then JS Custom will check the jsx_close_tag setting and replace the command if appropriate. But this only applies if something is causing close_tag to run in the first place, such as the Command-period binding.

By default, close_tag runs when you type </ in XML or HTML. JS Custom provides an additional binding that runs jsx_close_tag when you type </ in source.js. Currently, that isn't hooked up to the jsx_close_tag setting at all, and since it hardcoded source.js, it wasn't working for source.jsx.

In v4.0.6, I hardcoded source.js, source.jsx, and source.tsx. A better fix for the future would be to hook up the keybinding to the scope command.

bcomnes commented 3 years ago

ok its working, even with "scope": "source.jsx" now. Thank you!