Subject: bug#30225: closed (Re: bug#32158: 26.1; Broken JSX indentation in case of arrow function passing to props)

From: [email-masked] (GNU bug Tracking System)
Date: Wed, 05 Jun 2019 11:01:03 +0000

Your bug report

#32158: 27.0.50; jsx: Arrow function in attribute breaks indentation

which was filed against the emacs package, has been closed.

The explanation is attached below, along with your original report.
If you require more details, please reply to [email-masked].

-- 
32158: http://debbugs.gnu.org/cgi/bugreport.cgi?bug=32158
GNU Bug Tracking System
Contact [email-masked] with problems

Subject: Re: bug#32158: 26.1; Broken JSX indentation in case of arrow function passing to props
From: Dmitry Gutov <[email-masked]>
To: Jackson Ray Hamilton <[email-masked]>, [email-masked]
Cc: [email-masked]
Date: Wed, 5 Jun 2019 14:00:16 +0300
List-Id: <debbugs-submit.debbugs.gnu.org>

On 05.06.2019 13:58, Dmitry Gutov wrote:

> Jackson, here's a slight variation on this example that looks problematic:
> 
> const foo = (props) => (
>      <div>
>      <input
>    cat={i => i} />
> 
>    </div>
> );
> 
> (Note the empty line)
> 
> That seems incorrect to me.

Sorry, never mind. I had to enable js-jsx-mode to test it properly.

So, closing.

Note that you can do it yourself by appending -done to a bug email.

Subject: 27.0.50; jsx: Arrow function in attribute breaks indentation
From: Mitchel Humpherys <[email-masked]>
To: [email-masked]
Date: Mon, 22 Jan 2018 17:27:53 -0800
List-Id: <debbugs-submit.debbugs.gnu.org>

I've noticed an indentation bug in js-jsx-mode.

The following code doesn't indent properly (note the `value` attribute on the `select`):

class MySelect extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            value: "",
        };
    }

    render() {
        return (
            <select style={{paddingRight: "10px"}}
                    onChange={e => this.setState({value: e.target.value})}
              value={this.state.value}>
              <option>Hi</option>
            </select>
        );
    }
}

However, when I move the `onChange` arrow function out it indents fine:

class MySelect extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            value: "",
        };
        this.onChange = this.onChange.bind(this);
    }

    render() {
        return (
            <select style={{paddingRight: "10px"}}
                    onChange={this.onChange}
                    value={this.state.value}>
              <option>Hi</option>
            </select>
        );
    }

    onChange(e) {
        this.setState({value: e.target.value});
    }
}

In GNU Emacs 27.0.50 (build 2, x86_64-pc-linux-gnu, GTK+ Version 3.22.26)
 of 2018-01-22 built on grinchel
Repository revision: 2df391c202eeee0d575980555443a5e81b8f6b1f
Windowing system distributor 'Fedora Project', version 11.0.11906000
System Description: Fedora release 27 (Twenty Seven)

Recent messages:
For information about GNU Emacs and the GNU system, type C-h C-a.
Mark set [2 times]
Indenting region...done
user-error: Beginning of history; no preceding item
Making completion list...
user-error: Beginning of history; no preceding item

Configured using:
 'configure --prefix=/home/mgalgs/opt/emacs-git'

Configured features:
XPM JPEG TIFF GIF PNG RSVG IMAGEMAGICK SOUND GPM DBUS GSETTINGS NOTIFY
ACL LIBSELINUX GNUTLS LIBXML2 FREETYPE M17N_FLT LIBOTF XFT ZLIB
TOOLKIT_SCROLL_BARS GTK3 X11 THREADS LCMS2

Important settings:
  value of $LC_CTYPE: en_US.UTF-8
  value of $LANG: en_US.UTF-8
  value of $XMODIFIERS: @im=ibus
  locale-coding-system: utf-8-unix

Major mode: JSX

Minor modes in effect:
  tooltip-mode: t
  global-eldoc-mode: t
  electric-indent-mode: t
  mouse-wheel-mode: t
  tool-bar-mode: t
  menu-bar-mode: t
  file-name-shadow-mode: t
  global-font-lock-mode: t
  font-lock-mode: t
  blink-cursor-mode: t
  auto-composition-mode: t
  auto-encryption-mode: t
  auto-compression-mode: t
  line-number-mode: t
  transient-mark-mode: t

Load-path shadows:
None found.

Features:
(shadow sort mail-extr emacsbug message rmc puny dired dired-loaddefs
format-spec rfc822 mml mml-sec password-cache epa derived epg epg-config
gnus-util rmail rmail-loaddefs mm-decode mm-bodies mm-encode mail-parse
rfc2231 mailabbrev gmm-utils mailheader sendmail rfc2047 rfc2045
ietf-drums mm-util mail-prsvr mail-utils js advice sgml-mode dom json
map seq byte-opt gv bytecomp byte-compile cconv imenu thingatpt cc-mode
cc-fonts easymenu cc-guess cc-menus cc-cmds cc-styles cc-align cc-engine
cc-vars cc-defs cl-loaddefs cl-lib elec-pair time-date mule-util tooltip
eldoc electric uniquify ediff-hook vc-hooks lisp-float-type mwheel
term/x-win x-win term/common-win x-dnd tool-bar dnd fontset image
regexp-opt fringe tabulated-list replace newcomment text-mode elisp-mode
lisp-mode prog-mode register page menu-bar rfn-eshadow isearch timer
select scroll-bar mouse jit-lock font-lock syntax facemenu font-core
term/tty-colors frame cl-generic cham georgian utf-8-lang misc-lang
vietnamese tibetan thai tai-viet lao korean japanese eucjp-ms cp51932
hebrew greek romanian slovak czech european ethiopic indian cyrillic
chinese composite charscript charprop case-table epa-hook jka-cmpr-hook
help simple abbrev obarray minibuffer cl-preloaded nadvice loaddefs
button faces cus-face macroexp files text-properties overlay sha1 md5
base64 format env code-pages mule custom widget hashtable-print-readable
backquote dbusbind inotify lcms2 dynamic-setting system-font-setting
font-render-setting move-toolbar gtk x-toolkit x multi-tty
make-network-process emacs)

Memory information:
((conses 16 121749 8471)
 (symbols 48 23352 1)
 (miscs 40 54 97)
 (strings 32 37829 1944)
 (string-bytes 1 1118347)
 (vectors 16 17941)
 (vector-slots 8 534418 8920)
 (floats 8 52 297)
 (intervals 56 243 0)
 (buffers 992 13))