yarn test:cra fails with TS errors

[beepsoft]

When running yarn test:cra in the main branch (with mst-gql 0.17.1) it fails with various Typescript errors, eg:

Compiled with problems:

ERROR in src/model/ChoicesAggregateFieldsModel.base.ts:39:5

TS2322: Type 'IOptionalIType<ISimpleType<"choices_aggregate_fields">, [undefined]>' is not assignable to type 'ModelPrimitive | IAnyType'.
  Property '[$type]' is missing in type 'IOptionalIType<ISimpleType<"choices_aggregate_fields">, [undefined]>' but required in type 'IType<any, any, any>'.
    37 |   .named('ChoicesAggregateFields')
    38 |   .props({
  > 39 |     __typename: types.optional(types.literal("choices_aggregate_fields"), "choices_aggregate_fields"),
       |     ^^^^^^^^^^
    40 |     avg: types.union(types.undefined, types.null, types.late((): any => ChoicesAvgFieldsModel)),
    41 |     count: types.union(types.undefined, types.null, types.integer),
    42 |     max: types.union(types.undefined, types.null, types.late((): any => ChoicesMaxFieldsModel)),

If I change tests/cra-test/test-cra.sh to install explicitly mobx-state-tree@5.1.5 (the version that must have been the latest at the time of 0.17.1 release) yarn tets:cra reports just 2 other errors not related to MST:

src/model/reactUtils.ts:9:63 - error TS2345: Argument of type 'typeof React' is not assignable to parameter of type 'typeof import("/Volumes/Promise/pataki/home/Documents/work/sztaki/hmic20/trials/mst-gql-beepsoft/node_modules/@types/react/index")'.
  The types of 'createFactory(...)(...).props.style' are incompatible between these types.
    Type 'React.CSSProperties | undefined' is not assignable to type 'import("/Volumes/Promise/pataki/home/Documents/work/sztaki/hmic20/trials/mst-gql-beepsoft/node_modules/@types/react/index").CSSProperties | undefined'.
      Type 'CSSProperties' is not assignable to type 'Properties<string | number, string & {}>'.
        Types of property 'aspectRatio' are incompatible.
          Type 'import("/Volumes/Promise/pataki/home/Documents/work/sztaki/hmic20/trials/mst-gql-beepsoft/tests/cra-test/node_modules/csstype/index").Property.AspectRatio | undefined' is not assignable to type 'import("/Volumes/Promise/pataki/home/Documents/work/sztaki/hmic20/trials/mst-gql-beepsoft/node_modules/csstype/index").Property.AspectRatio | undefined'.
            Type 'number & {}' is not assignable to type 'AspectRatio | undefined'.
              Type 'number & {}' is not assignable to type 'string & {}'.
                Type 'number & {}' is not assignable to type 'string'.

9 export const StoreContext = createStoreContext<RootStoreType>(React)
                                                                ~~~~~

src/model/reactUtils.ts:11:58 - error TS2345: Argument of type 'typeof React' is not assignable to parameter of type 'typeof import("/Volumes/Promise/pataki/home/Documents/work/sztaki/hmic20/trials/mst-gql-beepsoft/node_modules/@types/react/index")'.

11 export const useQuery = createUseQueryHook(StoreContext, React)
                                                            ~~~~~


Found 2 errors in the same file, starting at: src/model/reactUtils.ts:9

So, something in MST 5.1.6 breaks mst-gql as well as something with the newest React lib or its TS type defs. This means that new users of mst-gql most probably will have problems bootstrapping any new React or CRA projects.

[Benz19]

HI @beepsoft ... Im helping @jesse-savary with these issues and I'll try and act as a community manager to get things cleaned up in a timely manner. If you have any questions let me know.