Typescript Type Level Custom Error Message For Utility Types
Tags: webdev
Published: 2023-06-28 15:45:34

---
series: Typescript Type Level Custom Error Message
---

In the previous article, we have learned how to create custom type level error message for our function

In this article, we are going to learn how to create custom type level error message for...type itself!

Now imagine we want to create a type converter that convert true and false to 1 and 2 respectively

We want to convert either true or false, but we don't want to convert both

```ts
type A <T extends true | false, U = T> = T extends true ? 1 : 2

type X = A<boolean> // no error, but we dont want this
//   ^?
type Y = A<true> 
//   ^?
type Z = A<false> 
//   ^?

const x1:X = 1
const x2:X = 2
const y:Y = 1
const z:Z = 2
```

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c8kos0m65iq3qaueiy12.png)
[playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBAglA8AVKEAewIDsAmBnKwATgK4QA+AZgIYA2uEANFAKpQC8UiAfO5yuljwES0APxQAjFABcUAEwAoBaEhQAGrxjwARgHtdNCFUw8A9KaiZdKQoV2Em24sCgB3aNl2YXr4y+AAFgCWuArmUBEAeqLK4NAAmprwRKQ8YRZRMSrQAFpJ1HQQaeGZSgDGXrguqBLSGhwSChWYVVCocnW8is2tINKJDU2VLgBe0nkcckA)

No error or what so ever

Normally the solution is:

```ts
type A <T extends true|false, U = T> = boolean extends T ? "You cannot convert type `boolean` !": T extends true ? 1 : 2

type X = A<boolean> // no error, but we dont want this
//   ^?
type Y = A<true> 
//   ^?
type Z = A<false> 
//   ^?

const x1:X = 1 // error
const x2:X = 2 // error
const y:Y = 1
const z:Z = 2
```
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wui64bxzkaju51wosezp.png)

[playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBAglA8AVKEAewIDsAmBnKwATgK4QA+AZgIYA2uEANFAKpQC8UiAfO1AEYB7ATQhVMKdFjycoAfigAiAJoDiUAMZjMA4BoGYAbhEK7QkKAANBw0ZgtQAhAoBcMtBhz4ipOVACMUK4ATABQIWbQABq8MPDWImI8APRJUNoohIQChEx8xLoA7tDY+oVipgAWAJa4ISlQDQB6suHg0Eox8N4QPHWpTS0RUABandR0PVB9DVDNYer6uLqofs7RHAH1xlk5nG1QAOR+B1A1aTpQVLi4VQDmmFR8IgQCBPsHyqoaWhcLhsamfZWIQJOyOBQHAB0IT+SygqCCa14QSgW0y2SYiHeQROZ20uiuN3uj2ewFeQw+KjUmkw+L0-xMb3MwJsYnsTihMMWuhAzg6Gy5mDhAC9nKMOEEgA)

nice, we have the error, the user know what is wrong!

but we can do better, we can let the user know something is wrong **earlier**

```ts
type A <T extends [U] extends [boolean] ? (boolean extends U ? "error: cannot use `boolean`, please use `true` or `false` instead" : U) : "error: expected a boolean", U = T> = T extends true ? 1 : 2

type X = A<boolean> // error with custom error message!
//   ^?
type Y = A<true> 
//   ^?
type Z = A<false> 
//   ^?

const x1:X = 1 // no error, because error is lifted 
const x2:X = 2 // no error, because error is lifted 
const y:Y = 1
const z:Z = 2
```

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l722h59w76lzpk05x7o3.png)

[playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBAglA8AVKEAewIDsAmBnKA2gKoC6K6WehARgPa0A2EAhpmQPxQAUdjLm5DDnxEonAEQQATlNpSAXFADGrTLWBQArrmgADXk1a6ANFDCGdWy7uBTNEXVDlRdAM2YMdjgJaZcGZmxxKEUiAEoQqEkZOUU0SCUMbChmKAN+cVNRAF4oRAA+KFzkNCEqW3sxKABGSIAmACgG0EgoAA0i2Hh01kKAej6UGKkoAHdvYAALZW1gWgBbIdkR+YhcXGYAcwgAQgaBqEOAPXZm8GgATU6YeAqIQv3B49OW6AAta-h3T3uoR8OoCcmkpaH4NKhqvIOrlagc1Es5KZqBAVNpoNJllBvPgGN5XEk-iCwVBUHUoZ06lA4bQEVIkSjmGjaVicXiCQ0if4oCB5FcYRzQVyAF7yD65OpAA)

If you are creating utility type library, this will further enhance your users dev experience

1. It warns your users when they use your type improperly
2. The error acts as quick documentation that teaches your users how to use the type correctly