Type of symbol-named computed property is contextually typed with string literal

[christianalfoni]

Bug Report

🔎 Search Terms

symbol
index
extends

🕗 Version & Regression Information

Version 4.2.3 and all previous version. Does not work in 4.3.0 Beta either

• This is the behavior in every version I tried, and I reviewed the FAQ for entries about indexing symbols and extending

⏯ Playground Link

Playground link with relevant code

💻 Code

export interface TContext {
  state: string;
}

export interface TAction {
  type: string | symbol;
}


export type TTransitions<C extends TContext, A extends TAction, NewState extends C['state']> = {
  [State in C['state']]: {
    [Type in A['type']]?: (
      action: A & { type: Type },
      state: C extends { state: State } ? C : never,
    ) => C extends { state: NewState } ? C : never;
  };
};

const transition = <C extends TContext, A extends TAction, NewState extends C['state']>(
  state: C,
  action: A,
  transitions: TTransitions<C, A, NewState>,
): C => {
 return {} as any
}

const A = Symbol('A')
const B = Symbol('B')

type Context = {
  state: 'FOO'
} | {
  state: 'BAR'
}

type Action = {
  type: typeof A
  data: string
} | {
  type: typeof B
  data: number
}

const context: Context = {} as any
const action: Action = {} as any

transition(context, action, {
  // When I hover this FOO I can see the correct typing of the [A]: (action) => ({ state: 'BAR' }). It states
  // that the "action" argument indeed is a `{ type: typeof A, data: string }` type
  FOO: {
    // But here the "action" argument becomes `never`
    [A]: (action) => ({ state: 'BAR' })
  },
  BAR: {}
})

🙁 Actual behavior

The "action" argument becomes never

Here I am hovering the FOO property

Here I am hovering the action argument

🙂 Expected behavior

The "action" argument should have had the same type as when hovering the "FOO" property:

{
  type: typeof A;
  data: string;
} & {
  type: typeof A;
}

[christianalfoni]

I found a workaround which required a changed API surface. It was for the better, but keeping this here as it does seem like a bug 😄

[andrewbranch]

Slightly reduced: https://www.typescriptlang.org/play?ts=4.2.3#code/KYDwDg9gTgLgBASwHY2FAZgQwMbDgFQEFsYEIk4BvAKDjhgE8xgAuOAZximQHM4AfDgwC2AIwgAbANzUAvtQXZynOITgBeOAGUR4iQAoA5IUMBKakqQqAQhu27JR62YWNmqkmQqaadN63omYAh0VVo4ABNMGEw2Tm4kHjkBKnD-Nn8QuGtwqJi2JABXMTQ5BQjgbAlMKDxLFRxScjZiJqQZagqqmrx0QqRPcjh0AB58OFBUJAj2AlavAD59Rq82fAAaOFFqgAs2SjgAbQBpRAp8Q8N-QwBdG4B+NmXBpDW4ADIqQOY2U9lTDQLOAANwgCAicH+bEwSAYMnQzzam18R0IN2hL0BX3k-2oQA

[sandersn]

This happens with string | number and const A = 1 as well. I'm pretty sure the problem is inference+contextual typing producing an intersection of string & number for the type of action, which reduces to never. But I'll confirm first.

[sandersn]

Here's an example with more distinct identifiers, so that it's easier to talk about.

const A = Symbol("A");
const B = Symbol("B");

type Action =
    | {type: typeof A, data: string}
    | {type: typeof B, data: number}

declare const ab: Action;

declare function f<
    T extends {type: string | symbol;}
>(action: T, blah: { [K in T['type']]: (p: T & { type: K }) => void }): any;
f(ab, {
    [A]: ap => { ap.type },
    [B]: bp => { bp.type },
})

[sandersn]

After some discussion with @andrewbranch, I'm pretty sure the problem is that computed property name with symbol types are treated incorrectly in contextual typing. Here's a smaller repro that gets rid of the intersection and never:

const A = Symbol("A");
const B = Symbol("B");

type Action =
    | {type: typeof A, data: string}
    | {type: typeof B, data: number}

declare const ab: Action;
type X = { type: Action["type"] } & { type: typeof A }
declare function g(fx: (p: X) => void);
g(ap => { ap.type })

declare function f<
    T extends {type: string | symbol;}
>(action: T, blah: { [K in T['type']]: (p: K) => void }): any;
f(ab, {
    [A]: ap => { ap },
    [B]: bp => { bp },
})