1
00:00:00,240 --> 00:00:03,090
- One of the hardest parts
about writing TypeScript is

2
00:00:03,090 --> 00:00:06,270
actually debugging the errors
that TypeScript throws you.

3
00:00:06,270 --> 00:00:08,550
So in this video, I'm gonna
give you a few different hints

4
00:00:08,550 --> 00:00:10,830
and tips for debugging TypeScript errors,

5
00:00:10,830 --> 00:00:13,320
as well as how you can navigate
through third party code,

6
00:00:13,320 --> 00:00:14,580
which makes it easier to figure out

7
00:00:14,580 --> 00:00:16,590
why these errors are being thrown.

8
00:00:16,590 --> 00:00:18,000
So to get started, we're
just gonna be talking

9
00:00:18,000 --> 00:00:21,300
about how can you debug errors
in the simplest way possible.

10
00:00:21,300 --> 00:00:22,860
So we have a really simple function here

11
00:00:22,860 --> 00:00:26,190
called print number, it takes
in a number and some options.

12
00:00:26,190 --> 00:00:27,600
I define these options up here,

13
00:00:27,600 --> 00:00:29,310
a debug property that's a Boolean,

14
00:00:29,310 --> 00:00:31,410
as well as a format object that takes tabs

15
00:00:31,410 --> 00:00:34,200
which is a Boolean, and a
tabWidth which is a number.

16
00:00:34,200 --> 00:00:35,250
Right now, we have no errors,

17
00:00:35,250 --> 00:00:37,200
and everything's working as expected.

18
00:00:37,200 --> 00:00:38,970
Now, if I change this number to a string,

19
00:00:38,970 --> 00:00:40,257
you can see that I'm getting an error,

20
00:00:40,257 --> 00:00:42,960
and this error is relatively
straightforward to understand.

21
00:00:42,960 --> 00:00:44,940
It just says that the
argument of type string is

22
00:00:44,940 --> 00:00:47,310
not assignable to the
parameter of type number.

23
00:00:47,310 --> 00:00:50,580
And generally, if you have
like, a one level deep error,

24
00:00:50,580 --> 00:00:51,780
it's really easy to understand,

25
00:00:51,780 --> 00:00:53,520
'cause it shows you the error right there.

26
00:00:53,520 --> 00:00:55,350
But as soon as you start
getting into objects

27
00:00:55,350 --> 00:00:57,390
or types that are nested
inside of each other,

28
00:00:57,390 --> 00:00:59,400
for example, this options object,

29
00:00:59,400 --> 00:01:01,320
has all these different
types inside of it,

30
00:01:01,320 --> 00:01:03,330
so we have a bunch of
different nesting going on,

31
00:01:03,330 --> 00:01:04,830
so when we have that happen,

32
00:01:04,830 --> 00:01:06,870
especially with really complex objects,

33
00:01:06,870 --> 00:01:09,219
our error messages become
quite a bit more complicated.

34
00:01:09,219 --> 00:01:10,590
I'll show you what I'm talking about.

35
00:01:10,590 --> 00:01:12,630
Let's just change this back to a number,

36
00:01:12,630 --> 00:01:14,760
and now let's try to pass
in just an empty object.

37
00:01:14,760 --> 00:01:16,080
Obviously, that's gonna throw an error,

38
00:01:16,080 --> 00:01:17,880
'cause it expects all
these different properties,

39
00:01:17,880 --> 00:01:19,710
and we hover over this,
you're noticing now

40
00:01:19,710 --> 00:01:21,870
that the error is a little
bit harder to understand.

41
00:01:21,870 --> 00:01:24,210
It's not terrible, but it's
still a little bit harder.

42
00:01:24,210 --> 00:01:26,670
Essentially, it's telling me
here that the argument type

43
00:01:26,670 --> 00:01:29,700
of empty object is not
assignable to our options type,

44
00:01:29,700 --> 00:01:32,220
and that's because this
empty object type is missing

45
00:01:32,220 --> 00:01:33,420
the following properties.

46
00:01:33,420 --> 00:01:35,250
That mostly reads like English,

47
00:01:35,250 --> 00:01:37,380
and isn't too hard to understand.

48
00:01:37,380 --> 00:01:38,700
But if we take this a step further

49
00:01:38,700 --> 00:01:40,830
and we start adding some
things inside of here,

50
00:01:40,830 --> 00:01:42,780
for example, we know it
has a debug property,

51
00:01:42,780 --> 00:01:44,118
we'll just set that to false,

52
00:01:44,118 --> 00:01:45,880
and we have a format inside of here,

53
00:01:45,880 --> 00:01:48,221
and for this format we
have some tab stuff,

54
00:01:48,221 --> 00:01:50,550
so we'll say tabs is going to be true,

55
00:01:50,550 --> 00:01:51,383
and let's say, you know what?

56
00:01:51,383 --> 00:01:53,250
For tabWidth I accidentally put false,

57
00:01:53,250 --> 00:01:55,050
I put a Boolean instead of a number.

58
00:01:55,050 --> 00:01:56,790
Now when I hover over this,
I'm getting another error,

59
00:01:56,790 --> 00:01:58,350
type Boolean is not
assignable to type number.

60
00:01:58,350 --> 00:02:00,403
Okay, that's really good,
that's exactly what I expected.

61
00:02:00,403 --> 00:02:02,359
What happens if we leave
this off, what do we get now?

62
00:02:02,359 --> 00:02:03,810
When we hover over this,

63
00:02:03,810 --> 00:02:05,280
you can see we're getting an error here.

64
00:02:05,280 --> 00:02:07,620
And again these errors
aren't too terribly bad

65
00:02:07,620 --> 00:02:09,990
to understand, but again, as
things get more complicated,

66
00:02:09,990 --> 00:02:12,840
these errors will get much
larger and much harder to read.

67
00:02:12,840 --> 00:02:14,850
To show you a bit of an example
of what I'm talking about,

68
00:02:14,850 --> 00:02:17,010
I'm actually gonna take some
code from a different project.

69
00:02:17,010 --> 00:02:18,600
I'm just gonna pull it over for you.

70
00:02:18,600 --> 00:02:21,150
As you can see here, this is
the setup session function,

71
00:02:21,150 --> 00:02:23,430
and it just has this giant options object.

72
00:02:23,430 --> 00:02:25,620
So options object contains a
bunch of different information,

73
00:02:25,620 --> 00:02:27,540
and somewhere in there
I've made a mistake.

74
00:02:27,540 --> 00:02:29,400
As you can see, I'm
getting an error down here,

75
00:02:29,400 --> 00:02:30,960
and when I hover over this error,

76
00:02:30,960 --> 00:02:33,450
you can see my error message
is quite a lot larger,

77
00:02:33,450 --> 00:02:35,310
and it's frankly quite difficult

78
00:02:35,310 --> 00:02:36,867
to really understand what's going on,

79
00:02:36,867 --> 00:02:38,400
and this is where my first tip

80
00:02:38,400 --> 00:02:40,440
for TypeScript errors is going to be.

81
00:02:40,440 --> 00:02:42,000
Generally, the actual error

82
00:02:42,000 --> 00:02:44,670
that you're getting is going
to be in the last sentence

83
00:02:44,670 --> 00:02:47,430
or the very last section
of your TypeScript error.

84
00:02:47,430 --> 00:02:49,080
So really what you wanna
do is you wanna scroll down

85
00:02:49,080 --> 00:02:50,550
to the very bottom, and that's where

86
00:02:50,550 --> 00:02:52,440
you're most likely going
to find your error.

87
00:02:52,440 --> 00:02:54,243
So if I read down here,
it says type someValue

88
00:02:54,243 --> 00:02:56,970
anotherNestedValue
number is not assignable

89
00:02:56,970 --> 00:02:58,290
to type Boolean or undefined.

90
00:02:58,290 --> 00:02:59,970
Okay, and if I go up a step further,

91
00:02:59,970 --> 00:03:02,730
it says the type cookie.httpOnly
is not compatible

92
00:03:02,730 --> 00:03:04,260
between these two types.

93
00:03:04,260 --> 00:03:06,180
That right there gives me the
error that I'm looking for.

94
00:03:06,180 --> 00:03:07,350
If I scroll up here,

95
00:03:07,350 --> 00:03:10,461
you can see this cookie httpOnly
property is not the same

96
00:03:10,461 --> 00:03:12,000
between the two different types,

97
00:03:12,000 --> 00:03:14,301
and if I look back at this
error, it's telling me the reason

98
00:03:14,301 --> 00:03:17,220
for that is because the
type I supplied is not

99
00:03:17,220 --> 00:03:19,290
either a Boolean or undefined.

100
00:03:19,290 --> 00:03:20,850
If I were to come up
here and I change this

101
00:03:20,850 --> 00:03:22,920
to a Boolean or undefined, for example,

102
00:03:22,920 --> 00:03:25,821
I just changed this real
quickly to like true,

103
00:03:25,821 --> 00:03:28,410
now if I scroll down, you can
see it got rid of the error.

104
00:03:28,410 --> 00:03:29,280
So generally, when you're dealing

105
00:03:29,280 --> 00:03:31,350
with those really long
complicated error blocks,

106
00:03:31,350 --> 00:03:33,540
the best thing for you to
do is to just come in here

107
00:03:33,540 --> 00:03:34,860
and look at the very last sentence,

108
00:03:34,860 --> 00:03:36,660
because that a lot of times
will tell you what the error is,

109
00:03:36,660 --> 00:03:38,370
or maybe the last couple sentences.

110
00:03:38,370 --> 00:03:40,220
Most of this stuff up here
is kind of getting you

111
00:03:40,220 --> 00:03:41,850
into that nested layer.

112
00:03:41,850 --> 00:03:43,500
It's essentially going from the top level,

113
00:03:43,500 --> 00:03:44,790
all the way down to the lowest level.

114
00:03:44,790 --> 00:03:47,640
So at first, it's saying
this giant options object is

115
00:03:47,640 --> 00:03:50,130
not assignable, and then it's
saying this particular part

116
00:03:50,130 --> 00:03:52,037
of the options object is not
assignable, and then finally,

117
00:03:52,037 --> 00:03:55,140
the reason it's not
assignable is because of this.

118
00:03:55,140 --> 00:03:56,490
So the more nesting you have

119
00:03:56,490 --> 00:03:58,770
inside of your different
objects and your options,

120
00:03:58,770 --> 00:04:01,350
it's going to become more
and more of an error message,

121
00:04:01,350 --> 00:04:03,210
and again, the most
important part is pretty much

122
00:04:03,210 --> 00:04:05,220
just going to be at the
very bottom for you.

123
00:04:05,220 --> 00:04:07,021
Now, another way that
you can really understand

124
00:04:07,021 --> 00:04:09,030
TypeScript errors a little bit better is

125
00:04:09,030 --> 00:04:10,830
if you're using VS Code,
there's an extension

126
00:04:10,830 --> 00:04:13,470
that makes these error
messages a lot easier to read.

127
00:04:13,470 --> 00:04:14,580
If we go to the extensions tab,

128
00:04:14,580 --> 00:04:17,220
we can search for TypeScript Pretty,

129
00:04:17,220 --> 00:04:20,190
and I believe this is called
Pretty TypeScript Errors.

130
00:04:20,190 --> 00:04:21,840
Here we go, Pretty TypeScript Errors.

131
00:04:21,840 --> 00:04:23,460
I'm just going to enable this right now.

132
00:04:23,460 --> 00:04:25,380
And if we come back over to our code,

133
00:04:25,380 --> 00:04:26,430
and now we look at this error,

134
00:04:26,430 --> 00:04:28,410
you're gonna notice we still
get the same original message,

135
00:04:28,410 --> 00:04:29,610
but if we scroll down
a little bit further,

136
00:04:29,610 --> 00:04:31,890
we get this section that
is nicely formatted,

137
00:04:31,890 --> 00:04:33,660
and as you can see, it's
saying argument of type,

138
00:04:33,660 --> 00:04:35,970
and it's giving me my full
thing, is not assignable

139
00:04:35,970 --> 00:04:38,400
to SessionOptions, and then
it's telling me the types

140
00:04:38,400 --> 00:04:41,130
of cookie.httpOnly are
incompatible, and then finally,

141
00:04:41,130 --> 00:04:43,140
that the thing I passed
in is not assignable

142
00:04:43,140 --> 00:04:45,240
to type Boolean or undefined.

143
00:04:45,240 --> 00:04:47,310
It's the exact same message as up here,

144
00:04:47,310 --> 00:04:48,660
but they just formatted it in a way

145
00:04:48,660 --> 00:04:51,270
that's much easier to read and
understand what's going on.

146
00:04:51,270 --> 00:04:53,460
And I really like how they have
the indentation to tell you

147
00:04:53,460 --> 00:04:55,320
when you're going to
different levels of nesting,

148
00:04:55,320 --> 00:04:57,630
and overall, this is just
much easier to parse and read,

149
00:04:57,630 --> 00:05:00,210
because the most important
parts are syntax highlighted,

150
00:05:00,210 --> 00:05:02,250
and they're kind of like,
outlined with this background,

151
00:05:02,250 --> 00:05:04,080
which makes it really easy to see.

152
00:05:04,080 --> 00:05:06,533
Now, sometimes even while
looking at the error message,

153
00:05:06,533 --> 00:05:08,760
and reading through all that it has,

154
00:05:08,760 --> 00:05:10,192
and with the prettier error messages,

155
00:05:10,192 --> 00:05:13,950
you may still not know 100%
why you have a problem,

156
00:05:13,950 --> 00:05:15,810
because maybe the type that it says

157
00:05:15,810 --> 00:05:17,430
that you can assign right
here isn't as simple

158
00:05:17,430 --> 00:05:18,780
as Boolean or undefined.

159
00:05:18,780 --> 00:05:20,520
It may be something more
complicated by just saying

160
00:05:20,520 --> 00:05:22,592
like, session options or
something generic like that.

161
00:05:22,592 --> 00:05:25,860
So that's where having the
ability to actually dive in

162
00:05:25,860 --> 00:05:27,180
to this third party code

163
00:05:27,180 --> 00:05:28,950
or whatever code you're using, and seeing

164
00:05:28,950 --> 00:05:32,070
what all the implementation
details are really helps.

165
00:05:32,070 --> 00:05:33,053
So no matter what code you're using,

166
00:05:33,053 --> 00:05:35,760
whether you're using third
party code like I am here,

167
00:05:35,760 --> 00:05:38,370
or if you're using your own
code or a built-in code,

168
00:05:38,370 --> 00:05:40,350
the same thing applies for all of them.

169
00:05:40,350 --> 00:05:43,050
What you can do is wherever
you're trying to use your code

170
00:05:43,050 --> 00:05:45,060
where you're getting error,
for example, this function,

171
00:05:45,060 --> 00:05:46,920
you can right click on
this, and you can click

172
00:05:46,920 --> 00:05:50,040
on the go to definition,
which is an F12 hotkey,

173
00:05:50,040 --> 00:05:52,350
or what I generally do
on a Windows computer is

174
00:05:52,350 --> 00:05:54,900
you can hold down control,
or command on Mac,

175
00:05:54,900 --> 00:05:56,820
and you can click on the function name.

176
00:05:56,820 --> 00:05:58,050
And what that'll do is it'll bring you

177
00:05:58,050 --> 00:05:59,130
to the definition for that.

178
00:05:59,130 --> 00:06:00,690
It opens up in this weird little popup.

179
00:06:00,690 --> 00:06:03,300
If you double click in here,
it'll open it up full screen,

180
00:06:03,300 --> 00:06:06,180
and now you can see exactly
where that's coming from.

181
00:06:06,180 --> 00:06:08,040
Now, in this project, it just
brought us to the same file,

182
00:06:08,040 --> 00:06:09,690
'cause I'm doing some
weird overriding stuff.

183
00:06:09,690 --> 00:06:11,010
For now, I'm just gonna comment this out,

184
00:06:11,010 --> 00:06:12,300
and we're gonna do the exact same trick.

185
00:06:12,300 --> 00:06:13,170
So we're gonna click on this,

186
00:06:13,170 --> 00:06:14,640
and now you can see it brought me directly

187
00:06:14,640 --> 00:06:16,440
to where that function is declared,

188
00:06:16,440 --> 00:06:18,180
and it gives me all the
different types for everything.

189
00:06:18,180 --> 00:06:21,300
So you can see this is
an index.d.tss file.

190
00:06:21,300 --> 00:06:23,970
We'll talk later about
what these .d files are.

191
00:06:23,970 --> 00:06:25,650
But if you look at the actual types here,

192
00:06:25,650 --> 00:06:27,450
you'll see we're in our
node_modules folder,

193
00:06:27,450 --> 00:06:29,952
'cause this is where we've
installed this particular library

194
00:06:29,952 --> 00:06:31,080
and now it's telling me

195
00:06:31,080 --> 00:06:33,090
that this option is an optional object

196
00:06:33,090 --> 00:06:34,710
that is of this specific type.

197
00:06:34,710 --> 00:06:35,970
And if I wanna learn what this type is,

198
00:06:35,970 --> 00:06:38,550
again you can do the same trick
of control clicking on it,

199
00:06:38,550 --> 00:06:40,290
and you can see it brought me
down to this line right here,

200
00:06:40,290 --> 00:06:42,270
which is this interface for these options,

201
00:06:42,270 --> 00:06:44,100
and you can see it's
describing what everything is.

202
00:06:44,100 --> 00:06:45,810
There's huge documentation in here,

203
00:06:45,810 --> 00:06:47,280
describing what every single one

204
00:06:47,280 --> 00:06:48,900
of these different properties means,

205
00:06:48,900 --> 00:06:50,850
and in our case, we had
problems with this cookie.

206
00:06:50,850 --> 00:06:52,389
So we can go to our cookie options next,

207
00:06:52,389 --> 00:06:54,420
and we can look inside
of here and you can see,

208
00:06:54,420 --> 00:06:56,130
okay, we have this, we have this,

209
00:06:56,130 --> 00:06:58,350
and the problem I was
running into was HTTP only,

210
00:06:58,350 --> 00:07:01,530
and you'll see, okay, here's
the type, Boolean or undefined.

211
00:07:01,530 --> 00:07:03,990
Mine was not following
this Boolean or undefined,

212
00:07:03,990 --> 00:07:06,240
so that's why I was running
into those problems.

213
00:07:06,240 --> 00:07:08,640
So you can use that
control/command click kind

214
00:07:08,640 --> 00:07:10,890
of technology to navigate
further and further,

215
00:07:10,890 --> 00:07:11,723
and if you need to,

216
00:07:11,723 --> 00:07:13,080
there's a back button up here in VS Code,

217
00:07:13,080 --> 00:07:15,360
so I can just keep going back, forward,

218
00:07:15,360 --> 00:07:16,800
and back and forward to try to figure out

219
00:07:16,800 --> 00:07:19,890
exactly what's going on inside
of this third party code.

220
00:07:19,890 --> 00:07:21,420
This is a really powerful tool

221
00:07:21,420 --> 00:07:23,250
when you really need to go an extra step

222
00:07:23,250 --> 00:07:24,510
into the debugging process

223
00:07:24,510 --> 00:07:26,700
when the actual error
messages aren't clear enough,

224
00:07:26,700 --> 00:07:27,870
or maybe you're trying to use something

225
00:07:27,870 --> 00:07:29,790
you don't know why it's
not quite working right.

226
00:07:29,790 --> 00:07:32,070
This is a great way to look
at just the types of the code.

227
00:07:32,070 --> 00:07:34,590
It doesn't give you any of the
implementation or JavaScript.

228
00:07:34,590 --> 00:07:37,020
This just shows you what
the types of everything are,

229
00:07:37,020 --> 00:07:38,940
which makes it easier to read
since you don't have to worry

230
00:07:38,940 --> 00:07:41,730
about implementation, you can
just see the type information.

231
00:07:41,730 --> 00:07:43,872
Now if we just go back to our
simpler code here real quick,

232
00:07:43,872 --> 00:07:46,020
there's a few other
tricks that you can use

233
00:07:46,020 --> 00:07:48,510
when it comes to errors
inside your types groups code.

234
00:07:48,510 --> 00:07:51,060
And this is especially useful
when you're converting code

235
00:07:51,060 --> 00:07:53,670
from JavaScript to TypeScript,
or maybe you have some code

236
00:07:53,670 --> 00:07:55,560
that doesn't quite work with TypeScript,

237
00:07:55,560 --> 00:07:56,912
and that is the ability to ignore errors

238
00:07:56,912 --> 00:07:58,890
that show up in your code.

239
00:07:58,890 --> 00:08:01,620
Let's say, for example, that
this code is actually correct,

240
00:08:01,620 --> 00:08:03,360
and this error that I'm
getting from TypeScript

241
00:08:03,360 --> 00:08:05,768
on this format thing, it's just
a bad error for some reason.

242
00:08:05,768 --> 00:08:08,190
Well, if that was the
case, I wouldn't be able

243
00:08:08,190 --> 00:08:10,112
to compile my code with
this error in there,

244
00:08:10,112 --> 00:08:13,013
so instead what I need to do
is I need to write a comment

245
00:08:13,013 --> 00:08:14,490
that tells TypeScript, "Hey,

246
00:08:14,490 --> 00:08:16,290
I expect there to be an error there.

247
00:08:16,290 --> 00:08:18,120
Just ignore this line of code completely,

248
00:08:18,120 --> 00:08:19,552
and do not do anything with it."

249
00:08:19,552 --> 00:08:23,130
So if you write a comment
like this, and you say @ts,

250
00:08:23,130 --> 00:08:25,050
you'll notice we have a
couple different options.

251
00:08:25,050 --> 00:08:27,270
The one I'm gonna look
at here is @ts-ignore.

252
00:08:27,270 --> 00:08:29,857
What that does is it just
tells the TypeScript compiler,

253
00:08:29,857 --> 00:08:31,650
"Ignore the next line completely.

254
00:08:31,650 --> 00:08:33,300
Just pretend it doesn't even exist

255
00:08:33,300 --> 00:08:34,830
when you do your type checking."

256
00:08:34,830 --> 00:08:36,690
Now you'll see that this
error no longer shows up,

257
00:08:36,690 --> 00:08:38,220
because it's not actually type checking

258
00:08:38,220 --> 00:08:39,540
this line right here.

259
00:08:39,540 --> 00:08:41,190
Now, this is obviously
something you should use

260
00:08:41,190 --> 00:08:43,200
incredibly sparingly,
because by doing this,

261
00:08:43,200 --> 00:08:45,240
you just turn off all the
benefits of TypeScript,

262
00:08:45,240 --> 00:08:46,432
and you essentially go back to JavaScript

263
00:08:46,432 --> 00:08:48,030
for one line of code,

264
00:08:48,030 --> 00:08:50,100
but in very specific niche scenarios,

265
00:08:50,100 --> 00:08:52,500
where maybe you have a
bug or something in like,

266
00:08:52,500 --> 00:08:53,670
some library code you're using

267
00:08:53,670 --> 00:08:55,650
where their types are wrong
or something like like that,

268
00:08:55,650 --> 00:08:57,180
this could come in handy to make sure

269
00:08:57,180 --> 00:08:58,530
you can still compile your code

270
00:08:58,530 --> 00:09:00,270
while getting all your
TypeScript benefits,

271
00:09:00,270 --> 00:09:02,853
and only ignoring it in specific
cases where it's broken,

272
00:09:02,853 --> 00:09:05,700
based on something that's
out of your control.

273
00:09:05,700 --> 00:09:07,860
Generally, when I have those
types of situations, though,

274
00:09:07,860 --> 00:09:09,330
instead of using ts-ignore,

275
00:09:09,330 --> 00:09:11,333
which just says ignore
the next line completely,

276
00:09:11,333 --> 00:09:13,140
don't throw any errors ever,

277
00:09:13,140 --> 00:09:15,840
I like to use the ts-expect-error.

278
00:09:15,840 --> 00:09:16,980
This is slightly different

279
00:09:16,980 --> 00:09:19,320
in that it'll actually
expect there to be an error,

280
00:09:19,320 --> 00:09:21,360
so if there is an error on the next line,

281
00:09:21,360 --> 00:09:23,040
everything is perfectly fine,

282
00:09:23,040 --> 00:09:25,110
but if you don't have an
error on the next line,

283
00:09:25,110 --> 00:09:27,150
like let's say I just
actually fixed this code

284
00:09:27,150 --> 00:09:28,530
by giving this a tabWidth,

285
00:09:28,530 --> 00:09:30,420
you'll now see I get an error here saying

286
00:09:30,420 --> 00:09:32,568
that error is expected to be
an error but there is no error.

287
00:09:32,568 --> 00:09:34,860
This is really great if you have something

288
00:09:34,860 --> 00:09:36,660
that you think will get
fixed in the future,

289
00:09:36,660 --> 00:09:38,910
or that you plan on fixing in the future.

290
00:09:38,910 --> 00:09:40,530
Putting an expect error in here means

291
00:09:40,530 --> 00:09:42,300
that if it ever does get fixed,

292
00:09:42,300 --> 00:09:45,090
they'll make sure to see that
this is now no longer needed,

293
00:09:45,090 --> 00:09:46,320
and it'll be able to get removed,

294
00:09:46,320 --> 00:09:48,600
which means this line will
now have TypeScript be applied

295
00:09:48,600 --> 00:09:50,790
to it again instead of
permanently being ignored.

296
00:09:50,790 --> 00:09:53,712
Because generally, if you
see a ts-ignore in your file,

297
00:09:53,712 --> 00:09:55,110
you don't want to remove it,

298
00:09:55,110 --> 00:09:57,060
'cause you don't know the
reason for it being there,

299
00:09:57,060 --> 00:09:59,130
so it just kind of sticks around forever.

300
00:09:59,130 --> 00:10:01,509
That's kind of why I like
expect-error instead.

301
00:10:01,509 --> 00:10:04,020
Also, something that I think
is a really good practice is

302
00:10:04,020 --> 00:10:06,600
if you're using ignore or expect-error,

303
00:10:06,600 --> 00:10:07,909
a good thing to do is just describe

304
00:10:07,909 --> 00:10:09,510
what you're trying to ignore,

305
00:10:09,510 --> 00:10:11,430
what error you're running
into, so kind of like,

306
00:10:11,430 --> 00:10:14,070
copy paste the TypeScript
error, or just mention like,

307
00:10:14,070 --> 00:10:17,280
we are ignoring this error
because of X, Y, and Z issue.

308
00:10:17,280 --> 00:10:18,240
That's a really great thing,

309
00:10:18,240 --> 00:10:20,220
because now people know why this is there,

310
00:10:20,220 --> 00:10:22,200
and they can know if they
can remove it in the future

311
00:10:22,200 --> 00:10:23,970
when those different things
are fixed or changed,

312
00:10:23,970 --> 00:10:25,500
or maybe there's a new way to do things,

313
00:10:25,500 --> 00:10:27,090
where they can get around
that particular thing

314
00:10:27,090 --> 00:10:28,790
that you're mentioning right here.