1
00:00:01,050 --> 00:00:03,719
Instructor: Normally when introducing a complex topic

2
00:00:03,719 --> 00:00:06,060
such as testing, I like to do a long discussion

3
00:00:06,060 --> 00:00:09,210
about the purpose of testing, the history,

4
00:00:09,210 --> 00:00:11,730
some of the different methods, and so on.

5
00:00:11,730 --> 00:00:14,520
I found over practice, though, that jumping right in

6
00:00:14,520 --> 00:00:16,950
to some examples when working with testing

7
00:00:16,950 --> 00:00:19,020
tends to be a little bit more useful

8
00:00:19,020 --> 00:00:21,180
as you're just starting to learn.

9
00:00:21,180 --> 00:00:22,860
So we're gonna go ahead and start

10
00:00:22,860 --> 00:00:25,950
by cloning a starter repository,

11
00:00:25,950 --> 00:00:27,990
walk through a couple code examples,

12
00:00:27,990 --> 00:00:29,850
and then we'll dive right back in

13
00:00:29,850 --> 00:00:32,520
to the theory and purpose of testing.

14
00:00:32,520 --> 00:00:35,910
So to get started, I'm gonna open up my browser

15
00:00:35,910 --> 00:00:39,000
and navigate to the existing GitHub repo.

16
00:00:39,000 --> 00:00:40,710
I can get there by visiting

17
00:00:40,710 --> 00:00:45,710
github.com/stephengrider/reduxsimplestarter.

18
00:00:52,230 --> 00:00:55,290
And once I'm here, I can either clone the repo,

19
00:00:55,290 --> 00:00:57,090
if you're familiar with Git.

20
00:00:57,090 --> 00:00:59,700
There's also directions on how to get started

21
00:00:59,700 --> 00:01:01,080
if you're not familiar with Git.

22
00:01:01,080 --> 00:01:04,260
So either way, don't sweat it, got you covered.

23
00:01:04,260 --> 00:01:05,820
I'm gonna go ahead and use Git.

24
00:01:05,820 --> 00:01:07,713
So I'm gonna copy the link up here,

25
00:01:12,600 --> 00:01:14,790
paste it in with a Git clone,

26
00:01:14,790 --> 00:01:17,740
and I'm gonna clone this into a directory called "testing."

27
00:01:21,660 --> 00:01:23,820
Next, I'll change into that directory,

28
00:01:23,820 --> 00:01:26,010
and I'll do an NPM install.

29
00:01:26,010 --> 00:01:27,270
So while this is running,

30
00:01:27,270 --> 00:01:29,770
I'm gonna go ahead and open up my code editor too.

31
00:01:30,660 --> 00:01:32,790
So we can do a little bit of glance through

32
00:01:32,790 --> 00:01:34,800
on the existing code base here

33
00:01:34,800 --> 00:01:37,113
while we're installing dependencies.

34
00:01:39,300 --> 00:01:41,130
So in this directory, or in this project,

35
00:01:41,130 --> 00:01:45,840
you'll see three separate files, source, style, and test.

36
00:01:45,840 --> 00:01:48,810
Source has a kind of a skeleton, or boiler plate,

37
00:01:48,810 --> 00:01:51,450
of a project already wired up with Redux in here.

38
00:01:51,450 --> 00:01:53,910
So we've got an index file for actions,

39
00:01:53,910 --> 00:01:55,290
we've got some components,

40
00:01:55,290 --> 00:01:59,040
and we've at least got the stub for some reducers.

41
00:01:59,040 --> 00:02:03,690
You'll also find a stub of a style.css in here.

42
00:02:03,690 --> 00:02:05,460
Not really useful for us,

43
00:02:05,460 --> 00:02:07,620
but what is really interesting and useful

44
00:02:07,620 --> 00:02:09,600
is this test directory.

45
00:02:09,600 --> 00:02:11,970
So we're gonna be writing a whole array

46
00:02:11,970 --> 00:02:14,370
of different tests inside of this directory right here,

47
00:02:14,370 --> 00:02:17,250
and we're gonna see it grow over time.

48
00:02:17,250 --> 00:02:19,560
In this directory in particular,

49
00:02:19,560 --> 00:02:21,390
you'll already see two files in here.

50
00:02:21,390 --> 00:02:23,883
One is the test helper, let's open that up.

51
00:02:30,180 --> 00:02:32,370
And in here I've already put together a whole bunch

52
00:02:32,370 --> 00:02:34,800
of configuration for our testing suite.

53
00:02:34,800 --> 00:02:37,260
Now it's definitely my intent to walk you through

54
00:02:37,260 --> 00:02:39,420
putting together your own testing setup.

55
00:02:39,420 --> 00:02:42,360
So at the end of this section, we're gonna delete this file,

56
00:02:42,360 --> 00:02:44,610
and rewrite it all from scratch.

57
00:02:44,610 --> 00:02:46,500
But when you're just getting started with testing

58
00:02:46,500 --> 00:02:47,940
it's a little bit of a nightmare

59
00:02:47,940 --> 00:02:49,590
to walk through the first time.

60
00:02:49,590 --> 00:02:51,990
So let's first learn a little bit about testing

61
00:02:51,990 --> 00:02:54,240
and then worry about doing the initial setup.

62
00:02:55,830 --> 00:02:58,290
We've also got an initial spec file in here.

63
00:02:58,290 --> 00:03:02,010
You'll see "describe," some stuff, you'll see "it" in here.

64
00:03:02,010 --> 00:03:04,830
And then "expect," something, something, something.

65
00:03:04,830 --> 00:03:07,620
So this is kind of a first test in here

66
00:03:07,620 --> 00:03:08,880
that we've already got included.

67
00:03:08,880 --> 00:03:10,320
It's just kind of a mock of a test,

68
00:03:10,320 --> 00:03:12,120
not really testing a whole lot right now.

69
00:03:12,120 --> 00:03:14,250
And we're definitely going to expand upon this

70
00:03:14,250 --> 00:03:17,103
and walk through each step of this spec in great detail.

71
00:03:19,050 --> 00:03:20,790
Flipping back over to my command line,

72
00:03:20,790 --> 00:03:24,360
it looks like my dependencies are all done installing,

73
00:03:24,360 --> 00:03:27,060
so I will go ahead and catch you in the next section

74
00:03:27,060 --> 00:03:29,073
when yours are done installing as well.