conflict with vim-javascript

[solyarisoftware]

Hi Luo,
rainbow seems to me beautiful also for javascript!

But the plugin seems in conflict with https://github.com/pangloss/vim-javascript
(I use this last to colorize JSDOCs); With vim-javascript plugin enabled, rainbow doesn't colorize parentheses.

There is any (simple) way to run together both plugins?
Sorry for boring request (I know often people asked about it, but I can't find a solution).

Thanks!
giorgio

[jackcogdill]

From looking at vim-javascript's defined syntax, it seems that the use of matchgroup and start and end makes it inherently incompatible with this plugin. It is using the parentheses to find blocks of code.

I found that setting rainbow's config containedin= and listing their code blocks solves a lot of the issues, but the code blocks themselves will not be colored. E.g., if () {... } these parentheses and braces do not get colored.

@luochen1990 Please correct me if I'm wrong, or if you have any advice.

[ruler501]

I've been playing around with it and I managed to make a config that mostly works. Does not handle highlighting inside of regexes and auto indentation doesn't work a lot of places. Note that some of the operators have spaces around them which was needed to disambiguate them from other syntax elements. Even has somewhat decent jsx tag matching support (doesn't match < and > but it will match <Component> with </Component>. If you specify properties on the tag it won't highlight the close bracket of the opening tag which was a compromise to keep the syntax highlighting of attributes working).

\    'javascript': {
\      'operators': '_,\|+\|-\|\*\|\*\*\| / \|//\|===\|!==\|==\|!=\| < \|<=\| > \|>=\|:\|%\|&\||_',
\      'parentheses_options': 'containedin=jsxElement fold ',
\      'parentheses': [
\        'start=/\z((\)/ end=/)/ contains=@jsAll', 'start=/\[/ end=/\]/ contains=@jsAll',
\        'start=/{/ end=/}/ contains=@jsAll containedin=jsTemplateString',
\        'start=_<\z([^ />]*\)>\?_ end=_</\z1>_ end=_/>_ contains=jsxOpenTag,jsxAttrib,jsxExpressionBlock,jsxSpreadOperator,jsComment,@javascriptComments,javaScriptLineComment,javaScriptComment',
\      ],
\      'after': [
\        'syn clear jsParen', 'syn clear jsFuncArgs', 'syn clear jsxExpressionBlock',
\        'syn clear jsParensError', 'syn clear jsParenIfElse', 'syn clear jsDestructuringBlock',
\        'syn clear jsFuncBlock', 'syn clear jsArrowFuncArgs', 'syn clear jsParenSwitch',
\        'syn clear jsBlock', 'syn clear jsObject', 'syn clear jsxTag', 'syn clear jsTemplateExpression',
\        'syn clear jsParenRepeat', 'syn clear jsRepeatBlock'
\      ],
\      'contains_prefix': '',
\    },

This does basically gut a bunch of the syntax highlighting infrastructure, but it isn't very noticeable beyond the indentation issues.