/

TypeScript catch block errors

https://kentcdodds.com/blog/get-a-catch-block-error-message-with-typescript
typescript
On this page
  • Basic example
  • Extract the error handling logic
  • More robust example

Basic example

This example does not extract logic from the catch block

ts
try {
// something that might throw
} catch (error: unknown) {
// do something with the error message
if (error instanceof Error) {
return error.message
}
return String(error)
}

Extract the error handling logic

ts
const getErrorMessage = (error: unknown) => {
if (error instanceof Error) return error.message
return String(error)
}
const reportError = ({ message }: { message: string }) => {
// send the error to our logging service...
}
try {
throw new Error('Oh no!')
} catch (error) {
const errorMessage = getErrorMessage(error)
console.error(`๐Ÿš€ ~ errorMessage`, errorMessage)
// we'll proceed, but let's report it
reportError({ message: errorMessage })
}

More robust example

The above solution might not fit all cases, since many frameworks throw errors that comply to the Error api, but aren't instance of Error. ๐Ÿ”—

ts
type ErrorWithMessage = {
message: string
}
const isErrorWithMessage = (error: unknown): error is ErrorWithMessage => {
return (
typeof error === 'object' &&
error !== null &&
'message' in error &&
typeof (error as Record<string, unknown>).message === 'string'
)
}
const toErrorWithMessage = (maybeError: unknown): ErrorWithMessage => {
if (isErrorWithMessage(maybeError)) return maybeError
try {
return new Error(JSON.stringify(maybeError))
} catch {
// fallback in case there's an error stringifying the maybeError
// like with circular references for example.
return new Error(String(maybeError))
}
}
const getErrorMessage = (error: unknown) => {
return toErrorWithMessage(error).message
}

Usage

ts
try {
throw new Error('Oh no!')
} catch (error) {
const errorMessage = getErrorMessage(error)
console.error(`๐Ÿš€ ~ errorMessage`, errorMessage)
// we'll proceed, but let's report it
reportError({ message: errorMessage })
}

Some very detailed info can be found at joefallon.net/2018/0...errors/

Edit this page
Want to make your own site like this?
Try gatsby-theme-code-notes by Zander Martineau.
Notes on code. My second brain, by Zander Martineau.