?? and ??= behave differently when they shouldn't

[trajafri]

TypeScript Version: 4.0.2, Nightly (2020-9-2)

Search Terms:
Nullish coalescing operator
Nullish never
Coalescing never
Nullish coalescing assignment

Code
According to this post usage of ?? and ??= should be equivalent in the sample code below:

const values: { a?: string[] } = { };

delete values.a;
(values.a ?? (values.a = [])).push("hello"); // error
values.a = undefined;
(values.a ?? (values.a = [])).push("hello"); // error

delete values.a;
(values.a ??= []).push("hello");
values.a = undefined;
(values.a ??= []).push("hello");

Expected behavior:
Examples with ?? and ??= should compile and behave similarly.

Actual behavior:
Examples with ?? do not compile (Argument of type 'string' is not assignable to parameter of type 'never'.(2345))

Playground Link:
link

Related Issues:
Didn't find anything similar

[maurobringolf]

I think the following lines exhibit the same behavior that is triggering the error above:

let a : number[] | undefined = undefined
let b = (a = a ?? []) // b : never[]
a = undefined
let c = (a ??= []) // c : number[]

// The corresponding behavior without nullability
let d : number[]
let e = (d = []) // e : never[]

playground link

For the example above to run, the corresponding behavior here would be that the inferred type of both b and d is number[]. I am not sure what the desired behavior in this case is, but if someone has inputs I am happy to look into this more.

[Kingwl]

Sorry for the delay. But I'm a bit confused too...
What should the behavior is?

Seems (values.a ?? (values.a = [])) has been assumed as never[], But (values.a ??= []) as string[].

IMO string[] is reasonable?

And there are some changes about the never[] If I'm correct.

/cc: @RyanCavanaugh

[ddhorstman]

I've run into this bug too - is anyone working on a fix? Here's another example of the problem in action:

type MaybeNumber = number | undefined;
const a: MaybeNumber = undefined;
const b = 5;
let x: MaybeNumber, y: MaybeNumber, z: MaybeNumber;

// Chained nullish coalescing
x = (x ?? a ?? b);
console.log(x + 1); // 6

// Single nullish assignment
y ??= b;
console.log(y + 1); // 6

// Nullish assignment into nullish coalescing
z ??= a ?? b;
console.log(z + 1); // Object is possibly 'undefined'

playground link

As I understand it, x and z should behave identically. Is this difference in behavior somehow intentional?

[jihndai]

Might be related to #40494

[DanielRosenwasser]

@p810 that one is related to #9998.

[DanielRosenwasser]

@Keyacom you need to set your target to ES2021 or later, otherwise it will get downleveled.

[C-Ezra-M]

@Keyacom you need to set your target to ES2021 or later, otherwise it will get downleveled.

I wonder why the playground's target ES version is set to ES2017 by default, but okay.

[stevenwdv]

I found a different variant of the bug (posted first as a comment to #40494).

Take the following code snippet, where there is a bug (?? should have been ||).

let elem!: Element;

let selector1 =
    (elem.hasAttribute('name') && `[name='${elem.getAttribute('name')!}']`)
    ?? elem.tagName;
const s1: string = selector1;  // Correctly reports that false is not assignable to string

let selector2;
selector2 = elem.hasAttribute('name') && `[name='${elem.getAttribute('name')!}']`;
selector2 ??= elem.tagName;
const s2: string = selector2;  // No error as selector2 has been incorrectly narrowed to string, where there should be!!

It seems as though ??= incorrectly works identical to ||=.
This is not a regression, it was apparently always there.

Playground link