Highlighting broken when a class lambda returns a single JSX tag not enclosed in parentheses

[naveg]

My coworkers are always telling me to remove useless parens, but they aren't useless to me! ;)

Here's a modified plugin section of my vimrc. The bug reproduces with a vimrc consisting of this snippet only.

if empty(glob('~/.vim/autoload/plug.vim'))
  silent !curl -fLo ~/.vim/autoload/plug.vim --create-dirs
    \ https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
  autocmd VimEnter * PlugInstall | source $MYVIMRC
endif

call plug#begin('~/.vim/plugged')

Plug 'pangloss/vim-javascript', {'for': ['javascript', 'javascript.jsx']}
Plug 'mxw/vim-jsx', {'for': ['javascript', 'javascript.jsx']}

call plug#end()

[mxw]

Thanks for the report, @Naveg, as well as the detailed examples and counterexamples! I am able to repro this issue.

Unfortunately, I don't see a great way to fix this. The core issue here is as follows:

1. The jsClassBlock syntax region contains a pretty narrow subset of things, none of which transparently contains jsxRegion.
2. The jsArrowFunction syntax element can impose a special-case match on the next element, but it only looks for jsFunctionBraces, which you're omitting explicitly in your example.
3. The jsClassValue syntax element can contain arbitrary expressions (including JSX), but is explicitly ended by a newline character.

Together, this actually means that you could replace your JSX element with pretty much anything and the highlighting would be broken, e.g.:

The tl;dr is that this seems like a bug with pangloss/vim-javascript. Feel free to file a bug report over there, and if their fix doesn't address this specific case, let me know.

[mxw]

Closing out because it's not readily actionable from vim-jsx's end. (Feel free to reopen if things change upstream.)