Definitelytyped: @types/next/document and typescript 3.1.1

Created on 28 Sep 2018  路  4Comments  路  Source: DefinitelyTyped/DefinitelyTyped

@joaovieira

Thanks for the definitions!

Typescript 3.1.1 seems to break the document test (works fine with 3.0.3).

The error is: 

[ts]
Class static side 'typeof default' incorrectly extends base class static side 'typeof Document'.
  Types of property 'getInitialProps' are incompatible.
    Type '(ctx: NextDocumentContext<Record<string, string | string[] | undefined>>) => Promise<{ pageContext: PageContext; styles: Element; buildManifest: Record<string, any>; html?: string | undefined; head?: ReactElement<...>[] | undefined; }>' is not assignable to type '(context: NextDocumentContext<Record<string, string | string[] | undefined>>) => DefaultDocumentIProps'.
      Type 'Promise<{ pageContext: PageContext; styles: Element; buildManifest: Record<string, any>; html?: string | undefined; head?: ReactElement<any>[] | undefined; }>' is not assignable to type 'DefaultDocumentIProps'.
        Property 'buildManifest' is missing in type 'Promise<{ pageContext: PageContext; styles: Element; buildManifest: Record<string, any>; html?: string | undefined; head?: ReactElement<any>[] | undefined; }>'.

Reduced the example to minimalistic, but still getting the error

class MyDoc2 extends Document<WithUrlProps> {
  public static async getInitialProps({ req, renderPage }: NextDocumentContext) {
    // without callback

    // with callback
    const { html, head, buildManifest } = renderPage();

    const styles = [<style />];

    // Custom prop
    const url = req!.url;

    return { html, head, buildManifest, styles, url };
  }

  public render() {
    return <html />;
  }
}
picture virzak

All 4 comments

@virzak just updated myself to v3.1.1 as well. Don't think this is related to the TS version but to the async type instead. We're discussing it on https://github.com/DefinitelyTyped/DefinitelyTyped/pull/29181#issuecomment-425535563

joaovieira picture joaovieira on 30 Sep 2018
👍1

@joaovieira Looks like everything works now.

I had to make a change to this line:
https://github.com/mui-org/material-ui/blob/master/examples/nextjs/pages/_document.js#L79
to return an array instead.

Not sure if this is a definition problem or an issue in the material-ui example.

virzak picture virzak on 11 Oct 2018

I see. We took from the default Document.getInitialProps which is an array of elements but you're right that it can be any React.ReactNode.

joaovieira picture joaovieira on 11 Oct 2018
👍1

Awesome, thanks so much @joaovieira ! Closing this.

virzak picture virzak on 11 Oct 2018
👍1
Was this page helpful?
0 / 5 - 0 ratings

Related issues

jamespero picture jamespero  路  3Comments
demisx picture demisx  路  3Comments
jbreckmckye picture jbreckmckye  路  3Comments
csharpner picture csharpner  路  3Comments
natejgardner picture natejgardner  路  3Comments