[Bug]: cannot parse satisfies op that is in in left side of assignment

[sosukesuzuki]

💻

• Would you like to work on a fix?

How are you using Babel?

Programmatic API (babel.transform, babel.parse)

Input code

• Babel REPL Link

(a satisfies any) = null;

Configuration file name

No response

Configuration

Enable typescript plugin via @babel/parser API.

Current and expected behavior

current:

Syntax error: Invalid parenthesized assignment pattern. (2:1)

expected:

No errors.

Environment

System:
    OS: macOS 12.3
  Binaries:
    Node: 16.17.1 - ~/.volta/tools/image/node/16.17.1/bin/node
    Yarn: 3.2.4 - ~/.volta/tools/image/yarn/1.22.19/bin/yarn
    npm: 8.15.0 - ~/.volta/tools/image/node/16.17.1/bin/npm
  npmPackages:
    @babel/code-frame: 7.18.6 => 7.18.6 
    @babel/generator: 7.20.0 => 7.20.0 
    @babel/parser: 7.20.0 => 7.20.0 
    @babel/types: 7.20.0 => 7.20.0 
    eslint: 8.26.0 => 8.26.0 
    jest: 29.2.1 => 29.2.1

Possible solution

No response

Additional context

TypeScript compiler can parse it (TypeScript playground Link)

[mnpenner]

I'm still getting a syntax error on satisfies with the latest @babel/preset-typescript@^7.18.6 . Which babel plugin do I need to update to what version to get this to work?

[liuxingbaoyu]

@mnpenner Have you tried updating @babel/core?

[mnpenner]

@liuxingbaoyu Yes, running @babel/core@npm:7.20.7

[jordan-cutler]

Same boat here @mnpenner . Did you end up getting it resolved?

[mnpenner]

@lehighjcut Nope. Still have no idea what the issue is. My IDE (PhpStorm) isn't showing any errors, says I'm running TS 4.9.4. But when I try compile my app I get:

ERROR in ./assets/scripts/components/FreeQuoteForm2.tsx 871:3
Module parse failed: Unexpected token (871:3)
File was processed with these loaders:
 * ./node_modules/@pmmmwh/react-refresh-webpack-plugin/loader/index.js
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|   key: 'comments',
|   title: "Comments"
> }] satisfies readonly PageInfo[]);
| export default function FreeQuoteForm(props) {
|   _s();
 @ ./assets/scripts/pages/free_quote_form.tsx 5:0-57 8:51-64
 @ ./assets/scripts/pages/ lazy ^\.\/.*$ prefetchOrder: 0 namespace object ./free_quote_form.tsx ./free_quote_form
 @ ./assets/scripts/webpack.ts 8:9-64
 @ ./assets/scripts/index.ts 7:0-37 31:26-33

The first line is from my app, where I tried to use satisfies, and then the only 2 modules it mentions are @pmmmwh/react-refresh-webpack-plugin and babel-loader which I've already tried updating to their latest versions, so I have no idea.

[liuxingbaoyu]

The easiest way, you can try to delete *.lock and node_modules.

[jordan-cutler]

Deleting *.lock and node_modules and re-running yarn gives me other issues I need to solve. Potentially from a past person editing yarn.lock manually. I'm unsure :/ but it seems I can't go that route for now.

Looking into this thread which seems like it has a potential solution just posted: #15157 (comment)

[mnpenner]

@liuxingbaoyu That worked for me actually! Kind of a nuclear option, but nothing seems to have broken yet.