Include potential statusCode for next.js Error return

[rgbkrk]

Please fill in this template.

• Use a meaningful title for the pull request. Include the name of the package modified.
• Test the change in your own code. (Compile and run.)
• Follow the advice from the readme.
• Avoid common mistakes.
• Run npm run lint package-name (or tsc if no tslint.json is present).

Select one of these and delete the others:

If changing an existing definition:

• Provide a URL to documentation or source code which provides context for the suggested changes: createError from micro creates the errors with statusCode set: https://github.com/zeit/micro/blob/069f31fa506086cdbf0ce3364d16ab972e8cc200/lib/index.js

[mohsen1]

It looks like that the type of err is not Error. Guessing it's a Response object?

[rgbkrk]

Within the next code base they use this createError function from micro:

const createError = (code, message, original) => {
	const err = new Error(message);

	err.statusCode = code;
	err.originalError = original;

	return err;
};

for the errors, tacking the status code onto the Error object. They then suggest in the next docs when creating your own _error.js page to rely on this statusCode property.

[joaovieira]

if we go with this approach I'd suggest including originalError for completeness as well

[typescript-bot]

@rgbkrk Thank you for submitting this PR!

🔔 @Dru89 @brikou @jthegedus @resir014 @scottdj92 @joaovieira @ajliv - please review this PR in the next few days. Be sure to explicitly select Approve or Request Changes in the GitHub UI so I know what's going on.

If no reviewer appears after a week, a DefinitelyTyped maintainer will review the PR instead.

[typescript-bot]

@rgbkrk The Travis CI build failed! Please review the logs for more information.

Once you've pushed the fixes, the build will automatically re-run. Thanks!

[joaovieira]

@rgbkrk you can attach anything to your Error. statusCode is just an example that Next.js uses in their default server implementation. Same applies for originalError apparently. I, for example, have a custom Express.js server and can attach anything to it.

Thus, I'd say this needs to be cast explicitly on your client, either to any or to your custom error type:

static getInitialProps(context: NextContext) {
  const { err, res } = context;
  const statusCode = res ? res.statusCode : err ? (err as any).statusCode : null;

  return { statusCode };
}

You can also override your NextContext type:

interface MyError extends Error {
  statusCode?: number;
  originalError?: Error;
}

interface MyNextContext extends NextContext {
  err?: MyError
}

static getInitialProps(context: MyNextContext) {
  const { err, res } = context;
  const statusCode = res ? res.statusCode : err ? err.statusCode : null;

  return { statusCode };
}

[resir014]

@rgbkrk @joaovieira Since the err property is only used in _error.tsx as the documentation suggests, it might be better to limit the scope of this change to error.d.ts instead. I think we're better off doing this:

// error.d.ts

export interface NextErrorContext extends NextContext {
  err: DefaultErrorIProps
}

export default class Error<P = {}> extends React.Component<P & DefaultErrorIProps> {
    static getInitialProps(context: NextErrorContext): Promise<DefaultErrorIProps> | DefaultErrorIProps;
}

[resir014]

@rgbkrk I added my change suggestion. My finger slipped so my message might have accidentally got cut short if you received your notifications via email. 😅

[joaovieira]

@resir014 I think we should be able to use err.statusCode in any page, page HOC, or _app. It's the same error, same context. No?

[resir014]

I think we should be able to use err.statusCode in any page, page HOC, or _app. It's the same error, same context. No?

Ah, you're right, err is the same on every page. I stand corrected. @joaovieira

[rgbkrk]

Thank you all so much for digging into this to find the truth!

[typescript-bot]

A definition owner has approved this PR ⭐️. A maintainer will merge this PR shortly. If it shouldn't be merged yet, please leave a comment saying so and we'll wait. Thank you for your contribution to DefinitelyTyped!

[amcasey]

@joaovieira @mohsen1 Do you have any remaining concerns?

[joaovieira]

@rgbkrk as you pointed out the default Next.js error also has an originalError prop. Could you add some tests as well?

[typescript-bot]

@rgbkrk One or more reviewers has requested changes. Please address their comments. I'll be back once they sign off or you've pushed new commits or comments. Thank you!

[typescript-bot]

@rgbkrk I haven't seen anything from you in a while and this PR currently has problems that prevent it from being merged. The PR will be closed tomorrow if there aren't new commits to fix the issues.

[rgbkrk]

I'm going on paternity leave for a bit, so if anyone wants to pick up this PR (or even start a new one), I'd really appreciate it!

[typescript-bot]

@rgbkrk To keep things tidy, we have to close PRs that aren't mergeable but don't have activity from their author. No worries, though - please open a new PR if you'd like to continue with this change. Thank you!