Typescript TS2322 error with typescript 3.8.2

Author: pschofferCreated Feb 23, 2020Updated Jul 14, 2020

Intended outcome:

After upgrading typescript to 3.8.2 I started to get a compile error:

TS2322: Type '({ data, loading, error }: { data: any; loading: any; error: any; }) => Element' is not assignable to type '(result: QueryResult<any, Record<string, any>>) => Element'.
  Types of parameters '__0' and 'result' are incompatible.
    Type 'QueryResult<any, Record<string, any>>' is not assignable to type '{ data: any; loading: any; error: any; }'.
      Property 'error' is optional in type 'QueryResult<any, Record<string, any>>' but required in type '{ data: any; loading: any; error: any; }'.

I have also asked on Stack Ovverflow first. Good people there mentioned that Typescript ^3.8 is more strict and there might be something you could do to make compiling works.

Here is example usage in my code:

 <Query query={validateTokenQuery}>
                        {({ data, loading, error }) => {
            
                        }}
 </Query>

Actual outcome:

Project compiles

How to reproduce the issue:

Sorry I wasn't able to reproduce in sandbox. Do you have typescript version of the template there? Maybe that could be easier.

Version

System: OS: Linux 5.3 Ubuntu 18.04.4 LTS (Bionic Beaver) Binaries: Node: 13.8.0 - /usr/bin/node npm: 6.13.6 - /usr/bin/npm Browsers: Firefox: 72.0.2 npmPackages: apollo-cache-inmemory: ^1.6.5 => 1.6.5 apollo-client: ^2.6.8 => 2.6.8 apollo-link-context: ^1.0.17 => 1.0.19 apollo-upload-client: ^10.0.0 => 10.0.1 react-apollo: ^3.1.3 => 3.1.3

"react-scripts-ts": "^4.0.8",
"typescript": "^3.8.2"

Source: apollographql/react-apollo