[Bug]: Fails to parse Flow conditional type.

[seiyab]

💻

• Would you like to work on a fix?

How are you using Babel?

Programmatic API (babel.transform, babel.parse)

Input code

type TypeofAnimal = Dog extends Animal ? 'animal' : 'unknown'; // evaluates to 'animal'

Configuration file name

No response

Configuration

No response

Current and expected behavior

Current:

/repl.js: Missing semicolon. (1:23)

> 1 | type TypeofAnimal = Dog extends Animal ? 'animal' : 'unknown'; 
    |                        ^

Expected: successfully parse it.

Environment

Here is Babel playground.
https://babeljs.io/repl/#?browsers=defaults%2C%20not%20ie%2011%2C%20not%20ie_mob%2011&build=&builtIns=false&corejs=3.21&spec=false&loose=false&code_lz=C4TwDgpgBAKuEHsBmBBAdgSwLYEMA2UAvFACIIDmUEAHsBGgCYDOU62-UA_FAOQ6a48PKAC5eAVzQBrNAgDuaHgG4oQA&debug=false&forceAllTransforms=false&modules=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=env%2Cstage-2%2Cflow&prettier=false&targets=&version=7.23.6&externalPlugins=&assumptions=%7B%7D

Possible solution

No response

Additional context

I found it investigating a Prettier's issue. I'm not actual user of Flow.

[babel-bot]

Hey @seiyab! 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.

[kungfooman]

There doesn't seem to be one fixture for this:

https://github.com/search?q=repo%3Ababel%2Fbabel+path%3A%2F%5Epackages%5C%2Fbabel-parser%5C%2Ftest%5C%2Ffixtures%5C%2Fflow%5C%2F%2F+extends&type=code&p=1

And this is also not supported: https://flow.org/en/docs/types/type-guards/

So "flow" plugin seems to be quite under-developed. However, I tested with "typescript" plugin and it works great:

const ast = parse(code, {plugins: ["typescript"]});

(in case this may be an option for you)

I never used Flow, but it seems your use-case only cares about TypeScript syntax anyway - I always wondered why there are two type parser mixins (probably there are minor differences here and there ... 🤔)

[seiyab]

Yes, they have minor differences, say, upperbound for type parameter.
Flow Playground

export type Unpromise<Type: Promise<mixed>> =
  Type extends Promise<infer Generic>
    ? Generic
    : empty;

The sample input I write for description is very simplified one to make the issue easy to understand.
And as I mentioned, for myself, I'm not a flow dev. I found it as a contributor of Prettier, that is a JavaScript formatter supporting flow.

Adding more context, I don't intend to fix it and don't expect it to be resolved. I just submitted the issue because:

• I consider it is better to have an issue to track the problem status.
• Community might help me if I'm misunderstanding something.