question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

`generate()` produces incorrect output for arrow function expression

See original GitHub issue

Bug Report

  • I would like to work on a fix!

Current behavior A clear and concise description of the behavior.

generate() produces incorrect code for arrow function expression.

const generate = require('@babel/generator').default;
const node = t.arrowFunctionExpression( [], t.objectExpression( [] ) );
console.log( generate( node ) );

Output:

() => {}

Output should be:

() => ({})

Babel Configuration (babel.config.js, .babelrc, package.json#babel, cli command, .eslintrc)

No config used. The above is the complete reproduction case.

Environment

System:
	OS: macOS Mojave 10.14.6
Binaries:
	Node: 14.9.0 - ~/.nvm/versions/node/v14.9.0/bin/node
	npm: 6.14.8 - ~/.nvm/versions/node/v14.9.0/bin/npm
npmPackages:
	@babel/core: ^7.11.6 => 7.11.6 
	@babel/generator: ^7.11.6 => 7.11.6 
	@babel/helper-module-transforms: ^7.11.0 => 7.11.0 
	@babel/parser: ^7.11.5 => 7.11.5 
	@babel/plugin-transform-modules-commonjs: ^7.10.4 => 7.10.4 
	@babel/plugin-transform-react-jsx: ^7.10.4 => 7.10.4 
	@babel/register: ^7.11.5 => 7.11.5 
	@babel/traverse: ^7.11.5 => 7.11.5 
	@babel/types: ^7.11.5 => 7.11.5 
	babel-jest: ^26.3.0 => 26.3.0 
	babel-plugin-dynamic-import-node: ^2.3.3 => 2.3.3 
	eslint: ^7.8.1 => 7.8.1 
	jest: ^26.4.2 => 26.4.2

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:5 (4 by maintainers)

github_iconTop GitHub Comments

2reactions
JLHwungcommented, Sep 12, 2020

You can take a look at https://github.com/babel/babel/blob/c8f0b6dc1ecbe99d34f9188863b41582bf55d043/packages/babel-generator/src/node/parentheses.js#L286-L322

In your case, the printStack is Array (2) [ ArrowExpression, ObjectExpression ], it seems that the while-loop (which will consider arrow functions) is incorrectly skipped because i == 0. I believe the condition should be loosen and only applied to the second if condition where i-- is applied.

PR is welcome. If you don’t know how to clone Babel, follow these steps: (you need to have make and yarn available on your machine).

  1. Write a comment there to let other possible contributors know that you are working on this bug.
  2. Fork the repo
  3. Run git clone https://github.com/<YOUR_USERNAME>/babel.git && cd babel
  4. Run yarn && make bootstrap
  5. Wait ⏳
  6. Run make watch (or make build whenever you change a file)
  7. Add a test (only input.js; output.js will be automatically generated) to packages/babel-generator/test/fixtures/parentheses
  8. Update the code!
  9. yarn jest babel-generator to run the tests
    • If some test outputs don’t match but the new results are correct, you can delete the bad output.js files and run the tests again
  10. If it is working, run make test to run all the tests
  11. Run git push and open a PR!
1reaction
overlookmotelcommented, Sep 12, 2020

@JLHwung Thanks loads for the swift reply and advice to where to look in the code base.

I will try to put a PR together in next few days. I’ll post another comment here when/if I start work on it, so there’s no duplicated effort by another contributor.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Arrow function expressions - JavaScript - MDN Web Docs
Arrow functions cannot use yield within their body and cannot be created as generator functions. Try it.
Read more >
Anomalies in JavaScript arrow functions - LogRocket Blog
The following example shows how an arrow function can be used as a callback function, especially with array methods like map() , filter()...
Read more >
Arrow Functions in JavaScript: Fat & Concise Syntax - SitePoint
Learn how to use JavaScript arrow functions, understand fat and concise arrow syntax, and what to be aware of when using them in...
Read more >
Why am I obtaining this error in this TypeScript arrow function?
First the way your arrow function is defined doesn't look right. It looks like you are defining a function but the parameter definitions...
Read more >
How To Use Javascript Arrow Functions & This Keyword
ES6 introduced a new way of writing JavaScript functions called arrow function that uses a fat arrow ( => ). This guide will...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found