[Bug]: Babel removes parenthesis at place where are required. #16111

gabrielgortabns · 2023-11-20T10:33:28Z

💻

Would you like to work on a fix?

How are you using Babel?

Programmatic API (babel.transform, babel.parse)

Input code

import something from 'something';

export function myfunction(bool) {
    return /** @type {SomeType} */ (
        bool ? something.a() : something.b()
    )
}

Configuration file name

No response

Configuration

No response

Current and expected behavior

const something = require('something');

exports.myfunction = myfunction;

function myfunction(bool) {
    return; /** @type {SomeType} */ 
        bool ? something.a() : something.b()
}

Environment

System:
OS: Windows 11 10.0.22621
Binaries:
Node: 18.6.0 - C:\Program Files\nodejs\node.EXE
npm: 8.15.0 - C:\Program Files\nodejs\npm.CMD
npmPackages:
@babel/cli: ^7.23.0 => 7.23.0
@babel/core: ^7.23.2 => 7.23.2
@babel/plugin-transform-modules-commonjs: ^7.23.3 => 7.23.3
@babel/preset-env: ^7.23.3 => 7.23.3
@babel/traverse: ^7.23.3 => 7.23.3
eslint: ^8.53.0 => 8.53.0
jest: ^29.7.0 => 29.7.0

Possible solution

No response

Additional context

The issue happens when there is /** @type {SomeType} */ in return statement, or in assigment. Causing either in invalid return, or even if code itself works, in output files, TypeScript throws error because of invalid types (as without parenthesis it doesn't apply type cast on whole expression).

reproduction in comment below:

#16111 (comment)

The text was updated successfully, but these errors were encountered:

babel-bot · 2023-11-20T10:33:46Z

Hey @GabrielGorta! We really appreciate you taking the time to report an issue. The collaborators on this project attempt to help as many people as possible, but we're a limited number of volunteers, so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack community that typically always has someone willing to help. You can sign-up here for an invite.

nicolo-ribaudo · 2023-11-20T11:01:18Z

I'm releasing a patch right now that might fix this issue

nicolo-ribaudo · 2023-11-20T11:02:03Z

#16104

liuxingbaoyu · 2023-11-20T11:07:43Z

I'm worried this PR might not be helpful.
Also can you provide a way to reproduce it? I can't reproduce it in repl.

repl

gabrielgortabns · 2023-11-20T11:13:51Z

Checking tests in PR #16104 and it really seems it will fix the issue.

liuxingbaoyu · 2023-11-20T11:15:50Z

That test isn't actually what's being fixed, but I'm concerned it's a regression.

Sorry for not stating this in the PR before.

kungfooman · 2023-11-20T13:57:54Z

Isn't this because createParenthesizedExpressions is false by default (for whatever reason, AST vs. CST story)?

I wanted to test this in REPL, but I can't find a way to set {createParenthesizedExpressions: true}. Is there any way to set parse options in REPL?

liuxingbaoyu · 2023-11-20T14:03:33Z

Isn't this because createParenthesizedExpressions is false by default (for whatever reason, AST vs. CST story)?

I wanted to test this in REPL, but I can't find a way to set {createParenthesizedExpressions: true}. Is there any way to set parse options in REPL?

No, even this is unexpected when creatingParenthesizedExpressions: false. This is different in AST.

I wanted to test this in REPL, but I can't find a way to set {createParenthesizedExpressions: true}. Is there any way to set parse options in REPL?

Unfortunately there is currently no easy way.

kungfooman · 2023-11-20T15:28:00Z

Unfortunately there is currently no easy way.

Too bad, I would also like a "Show AST" option to quickly judge what's going on.

Checking tests in PR #16104 and it really seems it will fix the issue.

Try a single-line type cast comment, it doesn't work: REPL

Output:

function test(bool = false) {
  return /** @type {number} */bool ? 1 : 2;
}

liuxingbaoyu · 2023-11-20T15:31:38Z

You can view them via astexplorer.
https://astexplorer.net/#/gist/c8fa290417825f5efb7f858da5be9f14/28b66f5d63d27c90887e83d09ab237b9d9aa34e1

kungfooman · 2023-11-20T15:34:59Z

@liuxingbaoyu Thank you, I mean integrated into the PR build, because some plugins or options could manipulate the AST (e.g. createParenthesizedExpressions)

liuxingbaoyu · 2023-11-20T15:39:04Z

To be honest, I even doubt whether the plugins have good support for such an option. :)
I personally think that such an AST is more suitable for scenarios where only parser/generator are used.

babel-bot · 2023-11-23T09:41:54Z

Hi @GabrielGorta! This issue is missing some important information we'll need to be able to reproduce this issue.

Please understand that we receive a high volume of issues, and there are only a limited number of volunteers that help maintain this project. The easier it is for us to decipher an issue with the info provided, the more likely it is that we'll be able to help.

Please make sure you have the following information documented in this ticket:

Your Babel configuration (typically from .babelrc or babel.config.js)
The current (incorrect) behavior you're seeing
The behavior you expect
A short, self-contained example

Please provide either a link to the problem via the repl, or if the repl is insufficient, a new and minimal repository with instructions on how to build/replicate the issue.

bjornharrtell · 2023-11-24T08:51:35Z

This appears to be cause of openlayers/openlayers#15358. A reproduction can be found at https://github.com/bjornharrtell/ol-issue-15358.

ahocevar · 2023-11-24T09:04:00Z

This appears to be cause of openlayers/openlayers#15358. A reproduction can be found at https://github.com/bjornharrtell/ol-issue-15358.

Looks like this is a regression in @babel/parser. Downgrading to @babel/parser@7.19.0 (by manually editing the lockfile) makes the problem go away:

diff --git a/package-lock.json b/package-lock.json
index c84d63d..3f3903c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -115,7 +115,7 @@
         "@babel/helper-compilation-targets": "^7.22.15",
         "@babel/helper-module-transforms": "^7.23.3",
         "@babel/helpers": "^7.23.2",
-        "@babel/parser": "^7.23.3",
+        "@babel/parser": "^7.19.0",
         "@babel/template": "^7.22.15",
         "@babel/traverse": "^7.23.3",
         "@babel/types": "^7.23.3",
@@ -500,7 +500,7 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.23.4",
+      "version": "7.19.0",
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.4.tgz",
       "integrity": "sha512-vf3Xna6UEprW+7t6EtOmFpHNAuxw3xqPZghy+brsnusscJRW5BMUzzHZc5ICjULee81WeUV2jjakG09MDglJXQ==",
       "dev": true,
@@ -1849,7 +1849,7 @@
       "dev": true,
       "dependencies": {
         "@babel/code-frame": "^7.22.13",
-        "@babel/parser": "^7.22.15",
+        "@babel/parser": "^7.19.0",
         "@babel/types": "^7.22.15"
       },
       "engines": {
@@ -1868,7 +1868,7 @@
         "@babel/helper-function-name": "^7.23.0",
         "@babel/helper-hoist-variables": "^7.22.5",
         "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/parser": "^7.23.4",
+        "@babel/parser": "^7.19.0",
         "@babel/types": "^7.23.4",
         "debug": "^4.1.0",
         "globals": "^11.1.0"

gabrielgortabns · 2023-11-24T10:54:27Z

@bjornharrtell

Amazing job! I've just donwgraded the @babel/parser and now it works correctly at least in runtime (e.g. return statement, still type casts are lost). It's exactly same issue. Thank you @ahocevar too, for finding solution.

kungfooman · 2023-11-24T11:09:19Z

@ahocevar I tried to reproduce the issue and it's kinda confusing:

mkdir babel_paren
cd babel_paren

Create file test.mjs:

import {parse} from '@babel/parser';
import generator from '@babel/generator';
const generate = generator.default;
const code = `
function getResolutionForValueFunction(power) {
  power = power || 2;
  const maxResolution = this.getConstrainedResolution(this.maxResolution_);
  const minResolution = this.minResolution_;
  const max = Math.log(maxResolution / minResolution) / Math.log(power);
  return (
    /**
     * @param {number} value Value.
     * @return {number} Resolution.
     */
    function (value) {
      const resolution = maxResolution / Math.pow(power, value * max);
      return resolution;
    }
  );
}
`;
const ast = parse(code);
const out = generate(ast,
  {
    compact: true,
    //createParenthesizedExpressions: true,
  }
);
console.log(out);

First run:

rm -rf node_modules package.json package-lock.json && npm i @babel/parser@7.23.3 @babel/generator@7.23.3 && node test.mjs

added 12 packages, and audited 13 packages in 737ms

found 0 vulnerabilities
{
  code: 'function getResolutionForValueFunction(power){power=power||2;const maxResolution=this.getConstrainedResolution(this.maxResolution_);const minResolution=this.minResolution_;const max=Math.log(maxResolution/minResolution)/Math.log(power);return(/**\n' +
    '     * @param {number} value Value.\n' +
    '     * @return {number} Resolution.\n' +
    '     */function(value){const resolution=maxResolution/Math.pow(power,value*max);return resolution;});}',
  decodedMap: undefined,
  __mergedMap: [Getter],
  map: [Getter/Setter],
  rawMappings: [Getter/Setter]
}

Nice parentheses, right?

But now run:

npm i @babel/generator && node test.mjs

Result

up to date, audited 13 packages in 439ms

found 0 vulnerabilities
{
  code: 'function getResolutionForValueFunction(power){power=power||2;const maxResolution=this.getConstrainedResolution(this.maxResolution_);const minResolution=this.minResolution_;const max=Math.log(maxResolution/minResolution)/Math.log(power);return/**\n' +
    '     * @param {number} value Value.\n' +
    '     * @return {number} Resolution.\n' +
    '     */function(value){const resolution=maxResolution/Math.pow(power,value*max);return resolution;};}',
  decodedMap: undefined,
  __mergedMap: [Getter],
  map: [Getter/Setter],
  rawMappings: [Getter/Setter]
}

Parentheses are gone! 👀

This only happens when using {compact: true} as generate option.

liuxingbaoyu · 2023-11-24T11:18:29Z

@ahocevar @kungfooman
Thank you for your detailed report!
I think there are two problems here.

#16111 (comment)
Regression from @babel/generator@7.23.4, I can reproduce it, will fix it.

And https://github.com/bjornharrtell/ol-issue-15358 is related to @babel/parser.
~~I get the error, but even if I downgrade @babel/parser it doesn't work.🤔~~

Suddenly it works fine and I'm investigating. 🤦‍♂️

liuxingbaoyu · 2023-11-24T11:41:31Z

I don't understand why downgrading @babel/parer would work and I can't replicate this locally.
The bug in https://github.com/bjornharrtell/ol-issue-15358 disappeared after I downgraded @babel/generator, and it was caused by the merged PR a few days ago.

bjornharrtell · 2023-11-24T11:46:25Z

Confirmed that downgrading to @babel/generator@7.23.0 resolves https://github.com/bjornharrtell/ol-issue-15358. Note that downgrading to @babel/generator@7.23.3 does not appear to be enough.

liuxingbaoyu · 2023-11-24T14:53:40Z

I downgraded it to @babel/generator@7.23.3 and it worked, this should be fixed soon.

Doyler123 · 2023-11-30T10:32:25Z

FYI for anyone who might have started seeing the below error in their react application over the last week. This bug is the cause and it is fixed in @babel/generator@7.23.5

Error: Minified React error #152; visit https://reactjs.org/docs/error-decoder.html?invariant=152&args[]=f

bjornharrtell · 2023-11-30T14:49:55Z

Confirmed @babel/generator@7.23.5 resolves the issue and a lockfile regen/deps cleanup will bring that for me as transitive dependency.

gabrielgortabns added the i: needs triage label Nov 20, 2023

liuxingbaoyu added the Needs Info label Nov 23, 2023

ahocevar mentioned this issue Nov 24, 2023

Build issue involving @babel/parser openlayers/openlayers#15358

Closed

liuxingbaoyu added i: bug pkg: parser i: regression and removed Needs Info i: needs triage labels Nov 24, 2023

liuxingbaoyu removed the pkg: parser label Nov 24, 2023

liuxingbaoyu mentioned this issue Nov 24, 2023

fix: Missing parentheses after line break #16122

Merged

liuxingbaoyu closed this as completed Apr 15, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Bug]: Babel removes parenthesis at place where are required. #16111

[Bug]: Babel removes parenthesis at place where are required. #16111

gabrielgortabns commented Nov 20, 2023 •

edited

babel-bot commented Nov 20, 2023

nicolo-ribaudo commented Nov 20, 2023

nicolo-ribaudo commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023

gabrielgortabns commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023 •

edited

kungfooman commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023

kungfooman commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023

kungfooman commented Nov 20, 2023 •

edited

liuxingbaoyu commented Nov 20, 2023

babel-bot commented Nov 23, 2023

bjornharrtell commented Nov 24, 2023

ahocevar commented Nov 24, 2023 •

edited

gabrielgortabns commented Nov 24, 2023 •

edited

kungfooman commented Nov 24, 2023 •

edited

liuxingbaoyu commented Nov 24, 2023 •

edited

liuxingbaoyu commented Nov 24, 2023

bjornharrtell commented Nov 24, 2023

liuxingbaoyu commented Nov 24, 2023

Doyler123 commented Nov 30, 2023 •

edited

bjornharrtell commented Nov 30, 2023

[Bug]: Babel removes parenthesis at place where are required. #16111

[Bug]: Babel removes parenthesis at place where are required. #16111

Comments

gabrielgortabns commented Nov 20, 2023 • edited

💻

How are you using Babel?

Input code

Configuration file name

Configuration

Current and expected behavior

Environment

Possible solution

Additional context

reproduction in comment below:

babel-bot commented Nov 20, 2023

nicolo-ribaudo commented Nov 20, 2023

nicolo-ribaudo commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023

gabrielgortabns commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023 • edited

kungfooman commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023

kungfooman commented Nov 20, 2023

liuxingbaoyu commented Nov 20, 2023

kungfooman commented Nov 20, 2023 • edited

liuxingbaoyu commented Nov 20, 2023

babel-bot commented Nov 23, 2023

bjornharrtell commented Nov 24, 2023

ahocevar commented Nov 24, 2023 • edited

gabrielgortabns commented Nov 24, 2023 • edited

kungfooman commented Nov 24, 2023 • edited

liuxingbaoyu commented Nov 24, 2023 • edited

liuxingbaoyu commented Nov 24, 2023

bjornharrtell commented Nov 24, 2023

liuxingbaoyu commented Nov 24, 2023

Doyler123 commented Nov 30, 2023 • edited

bjornharrtell commented Nov 30, 2023

gabrielgortabns commented Nov 20, 2023 •

edited

liuxingbaoyu commented Nov 20, 2023 •

edited

kungfooman commented Nov 20, 2023 •

edited

ahocevar commented Nov 24, 2023 •

edited

gabrielgortabns commented Nov 24, 2023 •

edited

kungfooman commented Nov 24, 2023 •

edited

liuxingbaoyu commented Nov 24, 2023 •

edited

Doyler123 commented Nov 30, 2023 •

edited