Bug: xstate@4.30.2 is incompatible with typescript@<4.3.0

[wlee221]

Description

Building a TypeScript app with xstate@4.30.2 and typescript@<4.3.0 fail with the following errors on xstate/lib/interpreter.d.ts :

node_modules/xstate/lib/interpreter.d.ts:26:22 - error TS2420: Class 'Interpreter<TContext, TStateSchema, TEvent, TTypestate, TResolvedTypesMeta>' incorrectly implements interface 'ActorRef<TEvent, State<TContext, TEvent, TStateSchema, TTypestate, TResolvedTypesMeta>>'.
  Property '[Symbol.observable]' is missing in type 'Interpreter<TContext, TStateSchema, TEvent, TTypestate, TResolvedTypesMeta>' but required in type 'ActorRef<TEvent, State<TContext, TEvent, TStateSchema, TTypestate, TResolvedTypesMeta>>'.

26 export declare class Interpreter<TContext, TStateSchema extends StateSchema = any, TEvent extends EventObject = EventObject, TTypestate extends Typestate<TContext> = {
                        ~~~~~~~~~~~

  node_modules/xstate/lib/types.d.ts:979:5
    979     [Symbol.observable]: () => InteropSubscribable<T>;
            ~~~~~~~~~~~~~~~~~~~
    '[Symbol.observable]' is declared here.

node_modules/xstate/lib/interpreter.d.ts:192:5 - error TS1165: A computed property name in an ambient context must refer to an expression whose type is a literal type or a 'unique symbol' type.

192     [symbolObservable](): InteropSubscribable<State<TContext, TEvent, TStateSchema, TTypestate, TResolvedTypesMeta>>;
        ~~~~~~~~~~~~~~~~~~


Found 2 errors.

I could confirm that:

• Downgrading to xstate@4.30.1 or
• Updating typescript to ~4.3.0
  resolve these errors.

This error is prominent on Angular 11 (LTS at the moment), which TypeScript version is at 4.0.x || 4.1.x. While updating Angular 12+ is an option, we maintain an Angular library so we can't really control which Angular version user installs or their skipLibCheck settings.

Any Apps on older version of typescript will have the same error.

Expected result

No TS errors on interpreter.d.ts on typescript@~4.2.0.

Actual result

TS errors shown above.

Reproduction

https://github.com/wlee221/xstate-4.30.2-lib-error

Additional context

Related to #3063.

[Andarist]

Thanks to the report, i will fix this today

[esemczak]

I would like to add, that the version 4.30.2 breaks "machine.matches('state')", at least when "model.createMachine" has been used.

Type error: Argument of type 'string' is not assignable to parameter of type 'never'.

if(machine.matches(‘bla’)) return <MyComponent />

[Andarist]

@wlee221 I've prepared a fix for this: #3088 . However, I still recommend you to use skipLibCheck in your tsconfig.json. There is no reason for you to run typecheck over our declaration files.

@esemczak this is completely unrelated to this issue here. Please open a new issue and provide a runnable repro case of the problem.