[vim/vim] Typescript-React syntax highlighting improves only after opening a HTML buffer (Issue #12554)
Khang
Steps to reproduce
Syntax highlighting for .tsx files for JSX components improve after opening a .html file and switching buffers back to the .tsx file.
On first open, a .tsx file appears like this:
Then after opening a .html file and navigating back to the original .tsx buffer, it now looks like this:
To reproduce:
Create these files:
index.html:
<!-- index.html --> <!DOCTYPE html> <html lang="en"> <head /> <body /> </html>
typescript.tsx:
// typescript.tsx const Something = () => { return ( <div class="container"> <h1>Title</h1> <p>Lorem Ipsum</p> </div> ); };
Execute this sequence:
nvim --clean typescript.tsx(First image seen here):e index.html:e typescript.tsx(Second image with better syntax highlighting seen here)
Expected behaviour
If possible, I would like to see the better syntax highlighting on first-open.
Though an alternative would be to create a workaround and manually load the HTML syntax highlighting in the user's config.
Version of Vim
9.0.981
Environment
Operating system: macOS 13.2.1
Terminal: Alacritty 0.12.0
Value of $TERM: screen-256color
Shell: zsh
Logs and stack traces
### Debug attempts I tried analyzing the output of `:scriptnames` and manually sourcing the difference: <details> <summary><code>:scriptnames</code> upon first opening <code>typescript.tsx</code></summary> 1: /usr/local/share/nvim/runtime/ftplugin.vim 2: /usr/local/share/nvim/runtime/indent.vim 3: /usr/local/share/nvim/runtime/filetype.lua 4: /usr/local/share/nvim/runtime/syntax/syntax.vim 5: /usr/local/share/nvim/runtime/syntax/synload.vim 6: /usr/local/share/nvim/runtime/plugin/gzip.vim 7: /usr/local/share/nvim/runtime/plugin/health.vim 8: /usr/local/share/nvim/runtime/plugin/matchit.vim 9: /usr/local/share/nvim/runtime/pack/dist/opt/matchit/plugin/matchit.vim 10: /usr/local/share/nvim/runtime/plugin/matchparen.vim 11: /usr/local/share/nvim/runtime/plugin/netrwPlugin.vim 12: /usr/local/share/nvim/runtime/plugin/rplugin.vim 13: /usr/local/share/nvim/runtime/plugin/shada.vim 14: /usr/local/share/nvim/runtime/plugin/spellfile.vim 15: /usr/local/share/nvim/runtime/plugin/tarPlugin.vim 16: /usr/local/share/nvim/runtime/plugin/tohtml.vim 17: /usr/local/share/nvim/runtime/plugin/tutor.vim 18: /usr/local/share/nvim/runtime/plugin/zipPlugin.vim 19: /usr/local/share/nvim/runtime/plugin/editorconfig.lua 20: /usr/local/share/nvim/runtime/plugin/man.lua 21: /usr/local/share/nvim/runtime/plugin/nvim.lua 22: /usr/local/share/nvim/runtime/ftplugin/typescriptreact.vim 23: /usr/local/share/nvim/runtime/ftplugin/typescript.vim 24: /usr/local/share/nvim/runtime/syntax/typescriptreact.vim 25: /usr/local/share/nvim/runtime/syntax/shared/typescriptcommon.vim
:scriptnames after opening typescript.tsx, then opening index.html
1: /usr/local/share/nvim/runtime/ftplugin.vim
2: /usr/local/share/nvim/runtime/indent.vim
3: /usr/local/share/nvim/runtime/filetype.lua
4: /usr/local/share/nvim/runtime/syntax/syntax.vim
5: /usr/local/share/nvim/runtime/syntax/synload.vim
6: /usr/local/share/nvim/runtime/plugin/gzip.vim
7: /usr/local/share/nvim/runtime/plugin/health.vim
8: /usr/local/share/nvim/runtime/plugin/matchit.vim
9: /usr/local/share/nvim/runtime/pack/dist/opt/matchit/plugin/matchit.vim
10: /usr/local/share/nvim/runtime/plugin/matchparen.vim
11: /usr/local/share/nvim/runtime/plugin/netrwPlugin.vim
12: /usr/local/share/nvim/runtime/plugin/rplugin.vim
13: /usr/local/share/nvim/runtime/plugin/shada.vim
14: /usr/local/share/nvim/runtime/plugin/spellfile.vim
15: /usr/local/share/nvim/runtime/plugin/tarPlugin.vim
16: /usr/local/share/nvim/runtime/plugin/tohtml.vim
17: /usr/local/share/nvim/runtime/plugin/tutor.vim
18: /usr/local/share/nvim/runtime/plugin/zipPlugin.vim
19: /usr/local/share/nvim/runtime/plugin/editorconfig.lua
20: /usr/local/share/nvim/runtime/plugin/man.lua
21: /usr/local/share/nvim/runtime/plugin/nvim.lua
22: /usr/local/share/nvim/runtime/ftplugin/typescriptreact.vim
23: /usr/local/share/nvim/runtime/ftplugin/typescript.vim
24: /usr/local/share/nvim/runtime/syntax/typescriptreact.vim
25: /usr/local/share/nvim/runtime/syntax/shared/typescriptcommon.vim
26: /usr/local/share/nvim/runtime/ftplugin/html.vim
27: /usr/local/share/nvim/runtime/autoload/htmlcomplete.vim
28: /usr/local/share/nvim/runtime/indent/html.vim
29: /usr/local/share/nvim/runtime/indent/javascript.vim
30: /usr/local/share/nvim/runtime/syntax/html.vim
31: /usr/local/share/nvim/runtime/syntax/xml.vim
32: /usr/local/share/nvim/runtime/syntax/dtd.vim
33: /usr/local/share/nvim/runtime/syntax/javascript.vim
34: /usr/local/share/nvim/runtime/syntax/vb.vim
35: /usr/local/share/nvim/runtime/syntax/css.vim
I put the difference in a diff.vim in the same directory and sourced it with :so diff.vim after opening typescript.tsx, but the syntax highlighting doesn't change.
" diff.vim
so /usr/local/share/nvim/runtime/ftplugin/html.vim
so /usr/local/share/nvim/runtime/autoload/htmlcomplete.vim
so /usr/local/share/nvim/runtime/indent/html.vim
so /usr/local/share/nvim/runtime/indent/javascript.vim
so /usr/local/share/nvim/runtime/syntax/html.vim
so /usr/local/share/nvim/runtime/syntax/xml.vim
so /usr/local/share/nvim/runtime/syntax/dtd.vim
so /usr/local/share/nvim/runtime/syntax/javascript.vim
so /usr/local/share/nvim/runtime/syntax/vb.vim
so /usr/local/share/nvim/runtime/syntax/css.vim
Can anyone help point me in the right direction for correctly sourcing the extra syntax highlighting logic that opening the `.html` buffer does? Thanks!
—
Reply to this email directly, view it on GitHub.
You are receiving this because you are subscribed to this thread.
Doug Kearns
The syntax/typescriptreact.vim file is linking some of its syntax groups to those defined in syntax/html.vim so that they have the same highlighting.
As a quick fix you could add a ~/.vim/syntax/typescriptreact.vim file containing the following to load the HTML syntax file.
syn include @html syntax/html.vim
—
Reply to this email directly, view it on GitHub.
You are receiving this because you are subscribed to this thread.
Christian Brabandt
perhaps @brammool (since you are listed as maintainer) wants to include this with the next runtime file update?
—
Reply to this email directly, view it on GitHub.
You are receiving this because you are subscribed to this thread.