TypeError when using the ** operator with BigInt

[bpierre]

🐛 bug report

Preflight Checklist

• I have read the Contributing Guidelines for this project.
• I agree to follow the Code of Conduct that this project
  adheres to.
• I have searched the issue tracker for an issue that matches the one I want
  to file, without success.

Description of the problem

I can’t use the ** operator on BigInt values without triggering an error. It seems CodeSandbox attempts to convert BigInts into Number when ** is used, even though this is a valid BigInt operator. Perhaps ** are being converted into Math.pow() calls internally, which only supports numbers.

Note: I don’t have this problem with Vite or Parcel 1.x when used locally. I also tried to update the Parcel version in CodeSandbox, but I get the same error.

To Reproduce

From the CodeSandbox TypeScript template:

• Set target to es2020 in the tsconfig.json (in order to support BigInt).
• Use 10n ** 2n anywhere.
• It will trigger the following error: “TypeError: can't convert BigInt to number”.

Link to sandbox: link (optional)

https://codesandbox.io/s/codesandbox-issue-bigint-power-6vi5lb?file=/src/index.ts

Your Environment

Software	Name/Version
Сodesandbox	Latest
Browser	Firefox Nightly
Operating System	Arch Linux

[aj-foster]

This bug is interesting! I noticed that the error only seems to occur in the preview, and not the TS runtime used by, for example, the editor / linter. Does this match with your experience?

[bpierre]

Absolutely, I also don’t get any error in the editor itself.

[aj-foster]

This issue took some digging to figure out. It looks like you might be seeing this issue because of the way we use Create React App for the preview portion of the page.

I was able to fix the preview by modifying the default .babelrc file to have the following:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "exclude": [
          "babel-plugin-transform-exponentiation-operator"
        ]
      }
    ]
  ],
  "plugins": [
    "transform-runtime"
  ],
  "parserOpts": {
    "plugins": [
      "dynamicImport"
    ]
  }
}

After this change, Babel in the preview no longer tries to coerce the BigInts into numbers prior to calling the exponentiation.

Hope this helps, and sorry you ran into this!

[bpierre]

Cool thanks!