1
00:00:00,870 --> 00:00:02,520
Instructor: So we've got the first part

2
00:00:02,520 --> 00:00:04,080
of our simulate helper right here,

3
00:00:04,080 --> 00:00:06,300
where we actually trigger an event.

4
00:00:06,300 --> 00:00:08,070
We need to take care of the second part

5
00:00:08,070 --> 00:00:11,640
where we will update the value of the HTML element

6
00:00:11,640 --> 00:00:13,980
if one was passed into this function.

7
00:00:13,980 --> 00:00:16,230
And so this part is a little bit more straightforward.

8
00:00:16,230 --> 00:00:19,833
We'll just check to see if a value was passed in.

9
00:00:21,660 --> 00:00:25,110
Then this .val value.

10
00:00:25,110 --> 00:00:26,700
And so this .val,

11
00:00:26,700 --> 00:00:28,020
this again, is a reference

12
00:00:28,020 --> 00:00:30,150
to the HTML element that was selected.

13
00:00:30,150 --> 00:00:32,310
And val is a jQuery method

14
00:00:32,310 --> 00:00:35,220
that sets the value of the HTML element.

15
00:00:35,220 --> 00:00:37,710
And so this is really relevant or used

16
00:00:37,710 --> 00:00:39,240
whenever we have a input,

17
00:00:39,240 --> 00:00:41,400
or a text area, or similar.

18
00:00:41,400 --> 00:00:43,620
And so we just pass in the new value that we want,

19
00:00:43,620 --> 00:00:45,033
and boom, there we go.

20
00:00:45,870 --> 00:00:48,090
So let's go ahead and save this,

21
00:00:48,090 --> 00:00:50,400
check out the console,

22
00:00:50,400 --> 00:00:52,920
and it looks like we've got another spec passing,

23
00:00:52,920 --> 00:00:55,233
we're down to just one more error.

24
00:00:56,070 --> 00:00:58,590
I bet you it's gonna be very close related

25
00:00:58,590 --> 00:01:01,260
to the fact that we have not set yet jquery-chai,

26
00:01:01,260 --> 00:01:02,610
down here at the bottom.

27
00:01:02,610 --> 00:01:04,470
So let's go ahead and do that right now,

28
00:01:04,470 --> 00:01:06,070
since it should be pretty quick.

29
00:01:07,650 --> 00:01:10,080
So the first thing we need to do to set up chai-jquery

30
00:01:10,080 --> 00:01:11,823
is we need to import the library,

31
00:01:12,730 --> 00:01:13,710
we've not yet imported it.

32
00:01:13,710 --> 00:01:17,367
So we'll import chaiJquery from chai-jquery.

33
00:01:21,990 --> 00:01:24,210
And then to set up a plugin

34
00:01:24,210 --> 00:01:27,720
or a additional set of matchers for Chai,

35
00:01:27,720 --> 00:01:30,510
we need to get reference to the Chai library.

36
00:01:30,510 --> 00:01:33,210
Right now we've only pulled in the Expect library.

37
00:01:33,210 --> 00:01:35,790
So to pull in the entire Chai library,

38
00:01:35,790 --> 00:01:37,473
we'll add in Chai, like so.

39
00:01:40,680 --> 00:01:42,213
Now down back at the bottom,

40
00:01:44,430 --> 00:01:47,580
we'll pass in chaiJQuery,

41
00:01:47,580 --> 00:01:49,350
and we're gonna call this, it's a function

42
00:01:49,350 --> 00:01:53,640
that we're gonna call with chai, chai.util,

43
00:01:53,640 --> 00:01:55,110
and our instance of jQuery

44
00:01:55,110 --> 00:01:56,220
that we've already set up.

45
00:01:56,220 --> 00:01:57,120
Remember, this is kind of

46
00:01:57,120 --> 00:01:59,670
that fanangled instance of jQuery

47
00:01:59,670 --> 00:02:03,303
that we already pulled off of jsdom up here.

48
00:02:05,070 --> 00:02:06,870
So again, this method signature

49
00:02:06,870 --> 00:02:07,890
is something you can look up

50
00:02:07,890 --> 00:02:10,410
by looking directly at the Chai jQuery docs.

51
00:02:10,410 --> 00:02:12,030
It's something you do not need to memorize,

52
00:02:12,030 --> 00:02:15,630
it's something that I got by looking at the documentation,

53
00:02:15,630 --> 00:02:18,030
which you can certainly do as well.

54
00:02:18,030 --> 00:02:18,863
All right.

55
00:02:18,863 --> 00:02:21,600
Let's save this and see how we're doing.

56
00:02:21,600 --> 00:02:22,890
And it looks like, hey,

57
00:02:22,890 --> 00:02:24,270
all of our specs are passing,

58
00:02:24,270 --> 00:02:25,503
green across the board.

59
00:02:27,090 --> 00:02:28,800
So I hope you've enjoyed this kinda walkthrough

60
00:02:28,800 --> 00:02:31,050
setting up the test utils file,

61
00:02:31,050 --> 00:02:32,190
or the test helper file.

62
00:02:32,190 --> 00:02:33,930
I know that it's been really confusing,

63
00:02:33,930 --> 00:02:35,437
there's probably been a lot of places where you said,

64
00:02:35,437 --> 00:02:37,200
"Wait, what the heck just happened?"

65
00:02:37,200 --> 00:02:38,550
Again, the idea here was

66
00:02:38,550 --> 00:02:40,590
to give you just a little bit of a hint

67
00:02:40,590 --> 00:02:42,300
at how this got set up.

68
00:02:42,300 --> 00:02:44,610
When I did the initial setup for this test helper,

69
00:02:44,610 --> 00:02:45,443
this is a test helper

70
00:02:45,443 --> 00:02:47,790
that I've used on several projects of my own,

71
00:02:47,790 --> 00:02:49,680
it took me quite a lot of tweaking.

72
00:02:49,680 --> 00:02:52,140
You know, a lot of work went into this simple,

73
00:02:52,140 --> 00:02:54,690
you know, it's only about 39 lines of code,

74
00:02:54,690 --> 00:02:56,910
but it took me many, many, many hours

75
00:02:56,910 --> 00:02:58,740
to get everything set up just right.

76
00:02:58,740 --> 00:03:00,840
So again, this was just

77
00:03:00,840 --> 00:03:02,460
to give you a little bit of taste of

78
00:03:02,460 --> 00:03:04,621
what's going on behind the scenes.

79
00:03:04,621 --> 00:03:05,460
All right.

80
00:03:05,460 --> 00:03:07,893
I'll go ahead and catch you in the next section.