Args out of range error in rjsx-mode when applying style prop to elements.

[bearguns]

I have an issue when trying to use rjsx-mode in conjunction with autopair-mode. I cannot close a nested pair of curly braces in a JSX element, i.e. a style prop in a span tag. The issue does not occur when using js2-jsx-mode, only when using rjsx-mode.

Issue Demo:

The issue only occurs in JSX elements that have a corresponding closing tag, but no content between them, i.e. trying to add a style prop to the opening tag of <h1></h1> will result in the error, but doing the same to <input /> will not throw the error.

Steps to Reproduce:

• Enable rjsx-mode and autopair-mode
• In a JSX block, open a new HTML element w/ closing tag i.e. <p></p>.
• Attempt to add a prop with nested braces: <p style={{ fontWeight: '300' }}></p>
• Open a self-closing tag i.e. <input /> and add style={{...}}. Issue should not occur.

The error is thrown when trying to complete the outer set of braces. However, if I add content to the element first, and then go back and add the style prop, the issue does not occur.

Workaround

The workaround for the issue is to open the element and closing tag, and type/insert any content between the two tags before trying to add the style prop to the opening tag.

[felipeochoa]

What versions of emacs, rjsx, js2, and autopair are you using? I'm unable to reproduce this issue

[wyuenho]

@bearguns Try smartparens

[bearguns]

@felipeochoa I'm running Emacs 26.1.

JS2-Mode is version js2-mode-20180724.801 RJSX-Mode rjsx-mode-20180625.58 Autopair autopair-20160304.1237

[bearguns]

@felipeochoa I switched to smartparens instead of autopair per @wyuenho's suggestion, and the issue doesn't occur with smartparens. I'm happy to just use smartparens instead of autopair, obv if it's not a widespread issue then no need to worry.

[felipeochoa]

@bearguns Thanks for letting me know, and glad you found a workaround. I still couldn't reproduce the issue, so will close it for now. (Until someone hits it again...)