Request: Supporting trailiing comma for arrow function.

[Ailrun]

Following https://tc39.github.io/ecma262/#sec-arrow-function-definitions,

((a, b,) => { console.log(a, b) })()

should be valid one.

However, in js2-mode, this one makes problem with syntax highlighting.

It looks like trailing comma for normal function already works by daed014, so I don't know why this arrow function one isn't supported.

[kwshi]

I am experiencing this same issue. It doesn't just raise issues with syntax highlighting but also simply fails to parse the arrow-function correctly as arguments and raises "undeclared variable or function", "missing formal parameter", and "syntax error" errors.

[Ailrun]

@kwshi If you use ... (rest arguments), you cannot add , after that.

[kwshi]

Yes, that is not my issue. Here is the arrow function:

      (
        {courses, order, starred, checked},
        {
          starred: courseStarred,
          selected: courseChecked,
          ...courseData // there is no trailing comma here 
        }, // <-- this comma is causing the problem
      ) => {
        const course = deserializeCourse(courseData);
        const key = courseUtil.courseKey(course);

        return {
          courses: courses.set(key, course),
          order: order.push(key),
          starred: courseStarred ? starred.add(key) : starred,
          checked: courseChecked ? checked.add(key) : checked,
        };
      }

It has been parsed and formatted by prettier and checked with ESLint, so I know it is valid JS. As you can see, there is no trailing comma after the rest arguments inside the destructuring, but only after the second arrow-function argument. This code raises syntax errors with js2-mode, but removing the trailing comma, as such:

      (
        {courses, order, starred, checked},
        {
          starred: courseStarred,
          selected: courseChecked,
          ...courseData // there is no trailing comma here 
        } // <-- no more trailing comma
      ) => {
        const course = deserializeCourse(courseData);
        const key = courseUtil.courseKey(course);

        return {
          courses: courses.set(key, course),
          order: order.push(key),
          starred: courseStarred ? starred.add(key) : starred,
          checked: courseChecked ? checked.add(key) : checked,
        };
      }

fixes the syntax errors in js2-mode. Thus I am having the same problem as you.

[deb0ch]

I am experiencing this issue and it is a bother.

Can somebody give hints as to where to start looking to try fixing it ourselves ?

[sandinmyjoints]

My emacs lisp is mediocre at best. I suspect the problem is in js2-parse-function-params. Perhaps around these lines: https://github.com/mooz/js2-mode/blob/master/js2-mode.el#L8411-L8416
It seems like the parser is consuming parameters and commas, but all it knows to expect after parameters and commas is right parenthesis (js2-RP). It needs to optionally be able to consume and discard one comma (js-COMMA) after a param name. If I have time to investigate more, I'll share...

[dgutov]

Thanks for the ping, this turned out to be a tricky one.

The problem was not in js2-parse-function-params but rather in the more general place which gets executed during speculative parsing step (when we are not sure yet if the parens belong to a simple paren expression, or to an arrow function).

[sandinmyjoints]

Thanks for fixing it!

[dgutov]

Hey folks, I wrote a thing based on this bugfix: http://dgutov.github.io/blog/2021/06/19/debugging-a-syntax-error-in-js2-mode/

[YievCkim]

Thank you for sharing this @dgutov I am learning emacs lisp and I have found your article very interesting