- Okay. In this section, we going to see how to
write some simple JavaScript code, how to test it using Jest
and how to run that test from the command line.
So all the examples are located in the example1 folder.
You can follow along if you like,
let me show you where to get the examples from.
So going to JSTDD, which contains the
all the demos for the entire video series.
We're currently in LessonO1, if you go in there,
there are three separate examples we're gonna look
at in this lesson.
The first example for this section is in example1.
Okay. So I'm gonna open that folder.
There are three files.
There's the JavaScript code that I'm gonna test.
There's my test code.
You tend to have a file that called something
.test.JS, and then a package .JSON file
which I'll discuss in a moment.
So I'm gonna use VS Code Visual Studio Code
as the editor for all my examples.
So you can open that folder in Visual Studio code
and it looks like this.
So here are my three files, my JavaScript code
the test code and this mysterious package
.JSON that we'll discuss in a few minutes.
So, first of all, then here's the JavaScript code.
It's a very simple example just to get the ball rolling.
It's a simple add function.
It takes two numbers and returns the sum.
Notice at the bottom of the JavaScript
I have a module.exports statement,
technically speaking this file is called a common JS module.
This is what NodeJS uses to organize script files.
Okay. So when you have a script file
or module file in NodeJS, every function
or class or variable is by default private to that file.
If you want to access a function outside the file
you have to export it.
And that's what the module.exports does.
It allows us to export symbols like function names.
So we can then import them elsewhere, like in our test code.
Okay. So I've module.exports is how I export
or make public the add function
so that I can access it in my test.
Okay. So the module exports is the way
that you share symbols
across multiple files in NodeJS.
A little bit later
I'll show you an another way
of exporting symbols as it works in ECMAScript6.
Okay. So that would be a slightly different way
of exporting symbols.
We'll see that later.
But for now here's my simple example function.
Example.JS is the file.
So in Visual Studio Code, here's my example.
That's the example I want to test.
What could be easier than that?
So to write some tests
Do you know, just, I've got a color scheme.
I've got yellow for my code and orange for my tests.
I hope you like it.
So the first thing we need to do
in our test is we need to import the file
and the symbols that we want to test.
Okay. So the require function in NodeJS
is like an import statement.
You give it to the name of the file.
So from the current folder
it'll import the example .JS file.
It kind of knows that it's looking for the JS file.
So it'll import the example, .JS file.
And in that file, I exported the add function.
Okay. So this gives me access.
This is basically importing the add function
from that module.
Okay. So first of all, import the add function
then I've got a test function.
Test is a Jest function, as you would imagine.
And alternatively, you can say it.
Okay. So instead of saying test, you can say it
and inside this function
inside the test function or inside the it function
you basically specify the test that you want to do.
And this is in my example.test file.
Okay. So just for the sake of completeness in VS code
this is my example test file.
Okay. So let's dig a bit deeper into this test function.
The test function takes two parameters.
The first parameter is a free-format string that basically
describes the purpose of the test.
Okay. So you can put any message you want in there
including spaces.
That's fine.
This is the name that's going to appear when
you run the test.
Okay. So you make it nice and clear what the purpose is.
That's the first parameter.
The second parameter is a Lambda.
Okay? So this is or an arrow function.
If you prefer, this is the code that you want to execute
for your test.
So defined this as an ECMAScript6 arrow function, or
if you prefer you can call it a Lambda.
Okay? So that code will be executed for that test.
So inside my Lambda, you call the expect function.
This is similar to assert.
If you've used J unit, the expect function is where
you specify what you expect to happen.
So the expect function specifies the operation to perform.
It will invoke this operation.
It adds one and two, not rocket science.
And obviously that will return a value
and whatever it returns, I'm hoping it's going to be three.
I'm expecting the result to be three.
ToBe it's called a matcher.
And the way it works is by equality.
It takes the value that you specified here, the result
of that function, and it compares it for equality
against this result here.
Hopefully the add function, the result will be three.
Okay. So that's fairly straightforward
but that's the way that you that's the way you write it.
Okay. Next thing is, how do you actually run the test?
So what you do, just open up a command window
in the folder and just run Jest
and that will run the test and hopefully it'll pass.
So when you run the test in my Lesson1
example01 folder, I run Jest.
What it does, it looks for all files that have a
.test filing and it'll execute all the test functions
and all the it functions in those files.
So it found one test and it passed.
So we get a nice green pass symbol.
Okay. I'm a bit of a skeptic.
So I'm gonna actually try running this actually
in real life to see if this really happens.
So I'm gonna go into a command window.
[Instructor] Here's my command window
in the correct folder.
[Instructor] And I'm going to run Jest here.
So like I said, it scans the command folder
for all files by default that have a test file name.
It found that one
that file had one test function, which passed.
Great.
What if it failed?
You get a big red marker
and it tells you where it went wrong.
So I'm gonna deliberately hijack my code so that it fails.
It tries to add two numbers together
but it gets it wrong, somehow.
So let's change my code to introduce a bike
and then we'll see how it fails the test.
Right? So my code example.JS.
So the add function, it gets two parameters
but I accidentally get my algorithm incorrect
and I return wibble.
Okay. An easy mistake to make.
That's my add function, now.
It should have added the numbers together.
Instead it returns wibble.
What's gonna happen when I run the test?
Well, we just saw what's gonna happen.
Let's give it a try.
So just run the tests again.
So it will obviously run, locate the test file
run the test.
And it gives me an error message and a big red error
message. So the whole thing, if one test fails
the whole thing fails.
This is the name of my, this is the string
in my test function.
This is the statement that failed.
And it, it has a nice color code in, I dunno, if you can see
that the value that it received back was wibble.
The value that it expected to be was three.
Okay. So basically it kind of shows me
where the error occurred.
There was one test that it found
And it failed.
So I would go back here
and I would realize the it's the add function.
That seems to be in error.
I wonder if I can fix the bug.
Oh, I can see it.
It should have not returned wibble.
It should have returned the actual sum, fix the bug.
Okay, great.
Run the test again.
And hopefully this time it's gonna work.
If it doesn't work, I start panicking.
Right? So that's worked.
That was easy enough.
If you want to, there is another way of running the tests.
I mentioned the package.json file.
In the package.json file.
I've defined a script.
I've set up a name script called test.
So I can basically run this command
as a yarn command or as a node package manager command.
I can basically run it like this now.
Okay. I can say yarn test.
When you say yarn, yarn looks for the package .JSON file.
And it looks for a script called test.
There it is.
So that's another way of running the Jest tool
or alternatively, I could say node package manager run
and I can give it the name of the script
and it'll run that there.
Okay. So you can either just run jest on its own
or you can say yarn test or NPM run test.
So for example
NPM run test doesn't really gain you anything.
It's just another way of running the test.
Okay. So you can see it's running jest
it located the test command.
The test command basically equates to running jest.
Jest has run my test and it's worked fine.