gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat(learn): add mocha and chai instructions (#39976)

Browse Source 
* feat(learn): add mocha and chai instructions

* test: added one new lesson

* rename added file and add tests

* add meta to prettierignore, fix formatting

* add unit-test numbering

* add examples from boilerplate

Co-authored-by: Randell Dawson <rdawson@onepathtech.com>

* remove code comments, add description

* elaborate test testStrings

Co-authored-by: Randell Dawson <rdawson@onepathtech.com>
This commit is contained in:
Shaun Hamilton 2020-11-26 18:05:42 +00:00 committed by GitHub
parent 25429b9f3f
commit 493880ffaf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
27 changed files with 511 additions and 138 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.prettierignore
View File

@ -2,3 +2,4 @@
**/public
client/static
fixtures
curriculum/challenges/_meta/*/*

4
curriculum/challenges/_meta/quality-assurance-and-testing-with-chai/meta.json
View File

@ -104,6 +104,10 @@
[
"587d8250367417b2b2512c5d",
"Run Functional Tests using a Headless Browser II"
],
[
"5f8884f4c46685731aabfc41",
"Simulate Actions Using a Headless Browser"
]
],
"helpRoom": "Help",

18
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal.md
View File

@ -6,39 +6,47 @@ forumTopicId: 301587
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>deepEqual()</code> asserts that two object are deep equal.
`deepEqual()` asserts that two objects are deep equal.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.deepEqual()</code> or <code>assert.notDeepEqual()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#7` in the `Equality` suite, change each `assert` to either `assert.deepEqual` or `assert.notDeepEqual` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=6').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - deepEqual vs. notDeepEqual.
- text: You should choose the correct method for the first assertion - `deepEqual` vs. `notDeepEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=6').then(data => { assert.equal(data.assertions[0].method, 'deepEqual', 'The order of the keys does not matter'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - deepEqual vs. notDeepEqual.
- text: You should choose the correct method for the second assertion - `deepEqual` vs. `notDeepEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=6').then(data => { assert.equal(data.assertions[1].method, 'notDeepEqual', 'The position of elements within an array does matter'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

19
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements.md
View File

@ -6,42 +6,49 @@ forumTopicId: 301588
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isAbove()</code>(i.e. greater) or <code>assert.isAtMost()</code> (i.e. less than or equal) to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#8` in the `Comparisons` suite, change each `assert` to either `assert.isAbove` or `assert.isAtMost` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=7').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isAbove vs. isAtMost.
- text: You should choose the correct method for the first assertion - `isAbove` vs. `isAtMost`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=7').then(data => { assert.equal(data.assertions[0].method, 'isAtMost', '5 is at most (<=) 5'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isAbove vs. isAtMost.
- text: You should choose the correct method for the second assertion - `isAbove` vs. `isAtMost`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=7').then(data => { assert.equal(data.assertions[1].method, 'isAbove', '1 is greater than 0'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isAbove vs. isAtMost.
- text: You should choose the correct method for the third assertion - `isAbove` vs. `isAtMost`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=7').then(data => { assert.equal(data.assertions[2].method, 'isAbove', 'Math.PI = 3.14159265 is greater than 3'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isAbove vs. isAtMost.
- text: You should choose the correct method for the fourth assertion - `isAbove` vs. `isAtMost`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=7').then(data => { assert.equal(data.assertions[3].method, 'isAtMost', '1 - Math.random() is > 0 and <= 1. It is atMost 1 !'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

15
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work.md
View File

@ -6,38 +6,45 @@ forumTopicId: 301589
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isNull()</code> or <code>assert.isNotNull()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#1` in the `Basic Assertions` suite, change each `assert` to either `assert.isNull` or `assert.isNotNull` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=0').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isNull vs. isNotNull.
- text: You should choose the correct method for the first assertion - `isNull` vs. `isNotNull`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=0').then(data => { assert.equal(data.assertions[0].method, 'isNull', 'Null is null'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isNull vs. isNotNull.
- text: You should choose the correct method for the second assertion - `isNull` vs. `isNotNull`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=0').then(data => { assert.equal(data.assertions[1].method, 'isNotNull', '1 is not null'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

29
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method.md
View File

@ -6,10 +6,13 @@ forumTopicId: 301590
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
In the next example we'll see how to send data in a request payload (body).
We are going to test a PUT request. The <code>'/travellers'</code> endpoint accepts a JSON object taking the structure:
We are going to test a PUT request. The `'/travellers'` endpoint accepts a JSON object taking the structure:
```json
{
@ -18,7 +21,7 @@ We are going to test a PUT request. The <code>'/travellers'</code> endpoint acce
```
The route responds with :
```json
{
"name": [first name], "surname": [last name], "dates": [birth - death years]
@ -30,8 +33,12 @@ See the server code for more details.
</section>
## Instructions
<section id='instructions'>
Send <br>
Within `tests/2_functional-tests.js`, alter the `'send {surname: "Colombo"}'` test (`// #3`):
Send the following JSON response as a payload:
```json
{
@ -39,12 +46,19 @@ Send <br>
}
```
Replace <code>assert.fail()</code> and make the test pass.
Check for 1) <code>status</code>, 2) <code>type</code>, 3) <code>body.name</code>, 4) <code>body.surname</code>.
Follow the assertion order above, We rely on it.
Check for the following, within the `request.end` callback:
1. `status`
2. `type`
3. `body.name`
4. `body.surname`
Follow the assertion order above - we rely on it. Be sure to remove `assert.fail()`, once complete.
</section>
## Tests
<section id='tests'>
```yml
@ -59,17 +73,18 @@ tests:
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=2').then(data => { assert.equal(data.assertions[2].method, 'equal'); assert.equal(data.assertions[2].args[0], 'res.body.name'); assert.match(data.assertions[2].args[1], /('|")Cristoforo\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should test for 'res.body.surname' to be 'Colombo'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=2').then(data => { assert.equal(data.assertions[3].method, 'equal'); assert.equal(data.assertions[3].args[0], 'res.body.surname'); assert.match(data.assertions[3].args[1], /('|")Colombo\1/);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

26
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method.md
View File

@ -6,15 +6,23 @@ forumTopicId: 301591
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
This exercise is similar to the preceding one. Look at it for the details.
Now that you have seen how it is done, it is your turn to do it from scratch.
</section>
## Instructions
<section id='instructions'>
Send
Within `tests/2_functional-tests.js`, alter the `'send {surname: "da Verrazzano"}'` test (`// #4`):
Send the following JSON response as a payload to the `/travellers` route:
```json
{
@ -22,12 +30,19 @@ Send
}
```
Replace <code>assert.fail()</code> and make the test pass.
Check for 1) <code>status</code>, 2) <code>type</code>, 3) <code>body.name</code>, 4) <code>body.surname</code>.
Follow the assertion order above: we rely on it.
Check for the following, within a `request.end` callback:
1. `status`
2. `type`
3. `body.name`
4. `body.surname`
Follow the assertion order above - we rely on it. Be sure to remove `assert.fail()`, once complete.
</section>
## Tests
<section id='tests'>
```yml
@ -42,17 +57,18 @@ tests:
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=3').then(data => { assert.equal(data.assertions[2].method, 'equal'); assert.equal(data.assertions[2].args[0], 'res.body.name'); assert.match(data.assertions[2].args[1], /('|")Giovanni\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should test for 'res.body.surname' to be 'da Verrazzano'
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=3').then(data => { assert.equal(data.assertions[3].method, 'equal'); assert.equal(data.assertions[3].args[0], 'res.body.surname'); assert.match(data.assertions[3].args[1], /('|")da Verrazzano\1/);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

14
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii.md
View File

@ -6,18 +6,25 @@ forumTopicId: 301592
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Replace <code>assert.fail()</code>. Test the status and the <code>text.response</code>. Make the test pass.
Send your name in the query appending <code>?name=&ltyour_name&gt</code>, the endpoint responds with <code>'hello &ltyour_name&gt'</code>.
Within `tests/2_functional-tests.js`, alter the `'Test GET /hello with your name'` test (`// #2`) to assert the `status` and the `text` response to make the test pass.
Send your name in the query, appending `?name=<your_name>` to the route. The endpoint responds with `'hello <your_name>'`.
</section>
## Tests
<section id='tests'>
```yml
@ -28,17 +35,18 @@ tests:
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=1').then(data => { assert.equal(data.assertions[0].method, 'equal'); assert.equal(data.assertions[0].args[0], 'res.status'); assert.equal(data.assertions[0].args[1], '200');}, xhr => { throw new Error(xhr.responseText); })
- text: You should test for 'res.text' == 'hello Guest'
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=1').then(data => { assert.equal(data.assertions[1].method, 'equal'); assert.equal(data.assertions[1].args[0], 'res.text'); assert.match(data.assertions[1].args[1], /hello [\w\d_-]/);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

40
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http.md
View File

@ -6,18 +6,51 @@ forumTopicId: 301593
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
Mocha allows testing asyncronous operations. There is a small (BIG) difference. Can you spot it?
We can test our API endpoints using a plugin, called `chai-http`. Let's see how it works. And remember, API calls are asynchronous.
The following is an example of a test using `chai-http` for the `'GET /hello?name=[name] => "hello [name]"'` suite. The test sends a name string in a url query string (`?name=John`) using a `GET`request to the `server`. In the `end` method's callback function, the response object (`res`) is received and contains the `status` property. The first `assert.equal` checks if the status is equal to `200`. The second `assert.equal` checks that the response string (`res.text`) is equal to `"hello John"`.
```js
suite('GET /hello?name=[name] => "hello [name]"', function () {
test("?name=John", function (done) {
chai
.request(server)
.get("/hello?name=John")
.end(function (err, res) {
assert.equal(res.status, 200, "response status should be 200");
assert.equal(
res.text,
"hello John",
'response should be "hello John"'
);
done();
});
});
```
Notice the `done` parameter in the test's callback function. Calling it at the end without an argument is necessary to signal successful asynchronous completion.
</section>
## Instructions
<section id='instructions'>
Replace <code>assert.fail()</code>. Test the status and the <code>text.response</code>. Make the test pass.
Don't send a name in the query; the endpoint responds with <code>hello Guest</code>.
Within `tests/2_functional-tests.js`, alter the `'Test GET /hello with no name'` test (`// #1`) to assert the `status` and the `text` response to make the test pass. Do not alter the arguments passed to the asserts.
There should be no name in the query; the endpoint responds with `hello Guest`.
</section>
## Tests
<section id='tests'>
```yml
@ -28,17 +61,18 @@ tests:
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=0').then(data => { assert.equal(data.assertions[0].method, 'equal'); assert.equal(data.assertions[0].args[0], 'res.status'); assert.equal(data.assertions[0].args[1], '200');}, xhr => { throw new Error(xhr.responseText); })
- text: You should test for 'res.text' == 'hello Guest'
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=0').then(data => { assert.equal(data.assertions[1].method, 'equal'); assert.equal(data.assertions[1].args[0], 'res.text'); assert.match(data.assertions[1].args[1], /('|")hello Guest\1/);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

55
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii.md
View File

@ -6,43 +6,86 @@ forumTopicId: 301594
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
In the HTML main view we provided a input form. It sends data to the `PUT /travellers` endpoint that we used above with an Ajax request. When the request successfully completes, the client code appends a `<div>` containing the info returned by the call to the DOM. Here is an example of how to interact with this form:
```js
test('#test - submit the input "surname" : "Polo"', function (done) {
browser.fill('surname', 'Polo').pressButton('submit', function () {
browser.assert.success();
browser.assert.text('span#name', 'Marco');
browser.assert.text('span#surname', 'Polo');
browser.assert.element('span#dates', 1);
done();
});
}
```
First, the `fill` method of the `browser` object fills the `surname` field of the form with the value `'Polo'`. Immediately after, the `pressButton` method invokes the `submit` event listener of the form. The `pressButton` method is asynchronous.
Then, once a response is received from the AJAX request, a few assertions are made confirming:
1. The status of the response is `200`
2. The text within the `<span id='name'></span>` element matches `'Marco'`
3. The text within the `<span id='surname'></span>` element matches `'Polo'`
4. The there is `1` `<span id='dates'></span>` element.
Finally, the `done` callback is invoked, which is needed due to the asynchronous test.
</section>
## Instructions
<section id='instructions'>
This exercise is similar to the preceding one.
Look at the code for directions. Follow the assertions order: we rely on it.
Within `tests/2_functional-tests.js`, in the `'submit "surname" : "Colombo" - write your e2e test...'` test (`// #5`), automate filling-in and submitting the form:
1. Fill in the form
2. Submit it pressing `'submit'` button.
Within the callback:
1. assert that status is OK `200`
2. assert that the text inside the element `span#name` is `'Cristoforo'`
3. assert that the text inside the element `span#surname` is `'Colombo'`
4. assert that the element(s) `span#dates` exist and their count is `1`
Do not forget to to remove the `assert.fail()` call.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the headless browser request succeeded.
- text: You should assert that the headless browser request succeeded.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.assertions[0].method, 'browser.success'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the text inside the element 'span#name' is 'Amerigo'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.assertions[1].method, 'browser.text'); assert.match(data.assertions[1].args[0], /('|")span#name\1/); assert.match(data.assertions[1].args[1], /('|")Amerigo\1/);}, xhr => { throw new Error(xhr.responseText); })
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.assertions[1].method, 'browser.text'); assert.match(data.assertions[1].args[0], /('|")span#name\1/); assert.match(data.assertions[1].args[1], /('|")Cristoforo\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the text inside the element 'span#surname' is 'Vespucci'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.assertions[2].method, 'browser.text'); assert.match(data.assertions[2].args[0], /('|")span#surname\1/); assert.match(data.assertions[2].args[1], /('|")Vespucci\1/);}, xhr => { throw new Error(xhr.responseText); })
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.assertions[2].method, 'browser.text'); assert.match(data.assertions[2].args[0], /('|")span#surname\1/); assert.match(data.assertions[2].args[1], /('|")Colombo\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the element 'span#dates' exist and its count is 1.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=5').then(data => { assert.equal(data.assertions[3].method, 'browser.element'); assert.match(data.assertions[3].args[0], /('|")span#dates\1/); assert.equal(data.assertions[3].args[1], 1);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

48
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser.md
View File

@ -6,20 +6,57 @@ forumTopicId: 301595
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
In the next challenges we are going to simulate the human interaction with a page using a device called 'Headless Browser'.
A headless browser is a web browser without a graphical user interface. This kind of tool is particularly useful for testing web pages, as it is able to render and understand HTML, CSS, and JavaScript the same way a browser would.
For these challenges we are using Zombie.JS. It's a lightweight browser which is totally based on JS, without relying on additional binaries to be installed. This feature makes it usable in an environment such as Repl.it. There are many other (more powerful) options.
Mocha allows You to prepare the ground running some code before the actual tests. This can be useful for example to create items in the database, which will be used in the successive tests.
With a headless browser, before the actual testing, we need to **visit** the page we are going to inspect. The `suiteSetup` 'hook' is executed only once at the suite startup. Other different hook types can be executed before each test, after each test, or at the end of a suite. See the Mocha docs for more information.
</section>
## Instructions
<section id='instructions'>
For these challenges we are using Zombie.JS. It's a lightweight browser which is totally based on JS, without relying on additional binaries to be installed. This feature makes it usable in an environment such as Repl.it. There are many other (more powerful) options.<br>
Look at the examples in the code for the exercise directions Follow the assertions order, We rely on it.
Within `tests/2_functional-tests.js`, immediately after the `Browser` declaration, add your project URL to the `site` property of the variable:
```js
Browser.site = 'https://sincere-cone.gomix.me'; // Your URL here
```
If you are testing on a local environment replace the line above with
```js
Browser.localhost('example.com', process.env.PORT || 3000);
```
Within `tests/2_functional-tests.js`, at the root level of the `'e2e Testing with Zombie.js'` suite, instantiate a new instance of the `Browser` object with the following code:
```js
const browser = new Browser();
```
Then, use the `suiteSetup` hook to direct the `browser` to the `/` route with the following code:
```js
suiteSetup(function(done) {
return browser.visit('/', done);
});
```
</section>
## Tests
<section id='tests'>
```yml
@ -29,22 +66,23 @@ tests:
- text: You should assert that the headless browser request succeeded.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=4').then(data => { assert.equal(data.assertions[0].method, 'browser.success'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the text inside the element 'span#name' is 'Cristoforo'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=4').then(data => { assert.equal(data.assertions[1].method, 'browser.text'); assert.match(data.assertions[1].args[0], /('|")span#name\1/); assert.match(data.assertions[1].args[1], /('|")Cristoforo\1/);}, xhr => { throw new Error(xhr.responseText); })
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=4').then(data => { assert.equal(data.assertions[1].method, 'browser.text'); assert.match(data.assertions[1].args[0], /('|")span#name\1/); assert.match(data.assertions[1].args[1], /('|")Marco\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the text inside the element 'span#surname' is 'Colombo'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=4').then(data => { assert.equal(data.assertions[2].method, 'browser.text'); assert.match(data.assertions[2].args[0], /('|")span#surname\1/); assert.match(data.assertions[2].args[1], /('|")Colombo\1/);}, xhr => { throw new Error(xhr.responseText); })
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=4').then(data => { assert.equal(data.assertions[2].method, 'browser.text'); assert.match(data.assertions[2].args[0], /('|")span#surname\1/); assert.match(data.assertions[2].args[1], /('|")Polo\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the element 'span#dates' exist and its count is 1.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=4').then(data => { assert.equal(data.assertions[3].method, 'browser.element'); assert.match(data.assertions[3].args[0], /('|")span#dates\1/); assert.equal(data.assertions[3].args[1], 1);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

73
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/simulate-actions-using-a-headless-browser.md Normal file
View File

@ -0,0 +1,73 @@
---
id: 5f8884f4c46685731aabfc41
title: Simulate Actions Using a Headless Browser
challengeType: 2
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Within `tests/2_functional-tests.js`, in the `'submit "surname" : "Vespucci" - write your e2e test...'` test (`// #6`), automate filling-in and submitting the form from scratch:
1. Fill in the form with the `surname` of `Vespucci`
2. Submit it pressing `'submit'` button
Within the callback:
1. assert that status is `200`
2. assert that the text inside the element `span#name` is `'Amerigo'`
3. assert that the text inside the element `span#surname` is `'Vespucci'`
4. assert that the element(s) `span#dates` exist and their count is `1`
Do not forget to to remove the `assert.fail()` call.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=6').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the headless browser request succeeded.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=6').then(data => { assert.equal(data.assertions[0].method, 'browser.success'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the text inside the element 'span#name' is 'Amerigo'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=6').then(data => { assert.equal(data.assertions[1].method, 'browser.text'); assert.match(data.assertions[1].args[0], /('|")span#name\1/); assert.match(data.assertions[1].args[1], /('|")Amerigo\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the text inside the element 'span#surname' is 'Vespucci'.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=6').then(data => { assert.equal(data.assertions[2].method, 'browser.text'); assert.match(data.assertions[2].args[0], /('|")span#surname\1/); assert.match(data.assertions[2].args[1], /('|")Vespucci\1/);}, xhr => { throw new Error(xhr.responseText); })
- text: You should assert that the element 'span#dates' exist and its count is 1.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=functional&n=6').then(data => { assert.equal(data.assertions[3].method, 'browser.element'); assert.match(data.assertions[3].args[0], /('|")span#dates\1/); assert.equal(data.assertions[3].args[1], 1);}, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js
/**
Backend challenges don't need solutions,
because they would need to be tested against a full working project.
Please check our contributing guidelines to learn more.
*/
```
</section>

21
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness.md
View File

@ -6,10 +6,12 @@ forumTopicId: 301596
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>isTrue()</code> will test for the boolean value <code>true</code> and <code>isNotTrue()</code> will pass when given anything but the boolean value of <code>true</code>.
`isTrue()` will test for the boolean value `true` and `isNotTrue()` will pass when given anything but the boolean value of `true`.
```js
assert.isTrue(true, 'this will pass with the boolean value true');
@ -17,39 +19,44 @@ assert.isTrue('true', 'this will NOT pass with the string value 'true');
assert.isTrue(1, 'this will NOT pass with the number value 1');
```
`isFalse()` and `isNotFalse()` also exist, and behave similarly to their true counterparts except they look for the boolean value of `false`.
<code>isFalse()</code> and <code>isNotFalse()</code> also exist and behave similarly to their true counterparts except they look for the boolean value of <code>false</code>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isTrue()</code> or <code>assert.isNotTrue()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#4` in the `Basic Assertions` suite, change each `assert` to either `assert.isTrue` or `assert.isNotTrue` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=3').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isTrue vs. isNotTrue.
- text: You should choose the correct method for the first assertion - `isTrue` vs. `isNotTrue`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=3').then(data => { assert.equal(data.assertions[0].method, 'isTrue', 'True is true'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isTrue vs. isNotTrue.
- text: You should choose the correct method for the second assertion - `isTrue` vs. `isNotTrue`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=3').then(data => { assert.equal(data.assertions[1].method, 'isTrue', 'Double negation of a truthy value is true'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isTrue vs. isNotTrue.
- text: You should choose the correct method for the third assertion - `isTrue` vs. `isNotTrue`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=3').then(data => { assert.equal(data.assertions[2].method, 'isNotTrue', 'A truthy object is not true - neither is a false one'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

20
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring.md
View File

@ -6,42 +6,48 @@ forumTopicId: 301597
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>include()</code> and <code>notInclude()</code> work for strings too!
<code>include()</code> asserts that the actual string contains the expected substring.
`include()` and `notInclude()` work for strings too!
`include()` asserts that the actual string contains the expected substring.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.include()</code> or <code>assert.notInclude()</code> to make the tests pass.
<section id='instructions'>
Within `tests/1_unit-tests.js` under the test labelled `#14` in the `Strings` suite, change each `assert` to either `assert.include` or `assert.notInclude` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=13').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - include vs. notInclude.
- text: You should choose the correct method for the first assertion - `include` vs. `notInclude`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=13').then(data => { assert.equal(data.assertions[0].method, 'include', '\'Arrow\' contains \'row\'...'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - include vs. notInclude.
- text: You should choose the correct method for the second assertion - `include` vs. `notInclude`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=13').then(data => { assert.equal(data.assertions[1].method, 'notInclude', '... a \'dart\' doesn\'t contain a \'queue\''); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

24
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range.md
View File

@ -6,41 +6,53 @@ forumTopicId: 301598
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>.approximately(actual, expected, delta, [message])</code>
Asserts that the actual is equal <code>expected</code>, to within a +/- <code>delta</code> range.
```javascript
.approximately(actual, expected, delta, [message])
```
Asserts that the `actual` is equal to `expected`, to within a +/- `delta` range.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.approximately()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#10` in the `Comparisons` suite, change each `assert` to `assert.approximately` to make the test pass (should evaluate to `true`).
Choose the minimum range (3rd parameter) to make the test always pass. It should be less than 1.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=9').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should use approximately(actual, expected, range) - You should choose the correct range.
- text: You should choose the correct range for the first assertion - `approximately(actual, expected, range)`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=9').then(data => { assert.equal(data.assertions[0].method, 'approximately'); assert.equal(data.assertions[0].args[2], 0.5, 'weirdNumbers(0.5) is in the range (0.5, 1.5]. It\'s within 1 +/- 0.5'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should use approximately(actual, expected, range) - You should choose the correct range.
- text: You should choose the correct range for the second assertion - `approximately(actual, expected, range)`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=9').then(data => { assert.equal(data.assertions[1].method, 'approximately'); assert.equal(data.assertions[1].args[2], 0.8, 'weirdNumbers(0.2) is in the range (0.2, 1.2]. It\'s within 1 +/- 0.8'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

21
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string.md
View File

@ -6,40 +6,49 @@ forumTopicId: 301599
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>isString</code> or <code>isNotString</code> asserts that the actual value is a string.
`isString` or `isNotString` asserts that the actual value is a string.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isString()</code> or <code>assert.isNotString()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#13` in the `Strings` suite, change each `assert` to either `assert.isString` or `assert.isNotString` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=12').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isString vs. isNotString.
- text: You should choose the correct method for the first assertion - `isString` vs. `isNotString`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=12').then(data => { assert.equal(data.assertions[0].method, 'isNotString', 'A float number is not a string'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isString vs. isNotString.
- text: You should choose the correct method for the second assertion - `isString` vs. `isNotString`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=12').then(data => { assert.equal(data.assertions[1].method, 'isString', 'environment vars are strings (or undefined)'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isString vs. isNotString.
- text: You should choose the correct method for the third assertion - `isString` vs. `isNotString`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=12').then(data => { assert.equal(data.assertions[2].method, 'isString', 'A JSON is a string'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

16
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array.md
View File

@ -6,37 +6,45 @@ forumTopicId: 301600
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isArray()</code> or <code>assert.isNotArray()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#11` in the `Arrays` suite, change each `assert` to either `assert.isArray` or `assert.isNotArray` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=10').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isArray vs. isNotArray.
- text: You should choose the correct method for the first assertion - `isArray` vs. `isNotArray`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=10').then(data => { assert.equal(data.assertions[0].method, 'isArray', 'String.prototype.split() returns an Array'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isArray vs. isNotArray.
- text: You should choose the correct method for the second assertion - `isArray` vs. `isNotArray`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=10').then(data => { assert.equal(data.assertions[1].method, 'isNotArray', 'Array.prototype.indexOf() returns a number'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

24
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type.md
View File

@ -6,45 +6,53 @@ forumTopicId: 301601
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>#typeOf</code> asserts that value’s type is the given string, as determined by <code>Object.prototype.toString</code>.
`#typeOf` asserts that value's type is the given string, as determined by `Object.prototype.toString`.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.typeOf()</code> or <code>assert.notTypeOf()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#17` in the `Objects` suite, change each `assert` to either `assert.typeOf` or `assert.notTypeOf` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=16').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - typeOf vs. notTypeOf.
- text: You should choose the correct method for the first assertion - `typeOf` vs. `notTypeOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=16').then(data => { assert.equal(data.assertions[0].method, 'typeOf', 'myCar is typeOf Object'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - typeOf vs. notTypeOf.
- text: You should choose the correct method for the second assertion - `typeOf` vs. `notTypeOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=16').then(data => { assert.equal(data.assertions[1].method, 'typeOf', 'Car.model is a String'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - typeOf vs. notTypeOf.
- text: You should choose the correct method for the third assertion - `typeOf` vs. `notTypeOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=16').then(data => { assert.equal(data.assertions[2].method, 'notTypeOf', 'Plane.wings is a Number (not a String)'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - typeOf vs. notTypeOf.
- text: You should choose the correct method for the fourth assertion - `typeOf` vs. `notTypeOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=16').then(data => { assert.equal(data.assertions[3].method, 'typeOf', 'Plane.engines is an Array'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - typeOf vs. notTypeOf.
- text: You should choose the correct method for the fifth assertion - `typeOf` vs. `notTypeOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=16').then(data => { assert.equal(data.assertions[4].method, 'typeOf', 'Car.wheels is a Number'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

17
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined.md
View File

@ -6,40 +6,47 @@ forumTopicId: 301602
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isDefined()</code> or <code>assert.isUndefined()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#2` in the `Basic Assertions` suite, change each `assert` to either `assert.isDefined()` or `assert.isUndefined()` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=1').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isDefined vs. isUndefined.
- text: You should choose the correct method for the first assertion - `isDefined` vs. `isUndefined`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=1').then(data => { assert.equal(data.assertions[0].method, 'isDefined', 'Null is not undefined'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isDefined vs. isUndefined.
- text: You should choose the correct method for the second assertion - `isDefined` vs. `isUndefined`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=1').then(data => { assert.equal(data.assertions[1].method, 'isUndefined', 'Undefined is undefined'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isDefined vs. isUndefined.
- text: You should choose the correct method for the third assertion - `isDefined` vs. `isUndefined`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=1').then(data => { assert.equal(data.assertions[2].method, 'isDefined', 'A string is not undefined'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

16
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item.md
View File

@ -6,37 +6,45 @@ forumTopicId: 301603
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.include()</code> or <code>assert.notInclude()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#12` in the `Arrays` suite, change each `assert` to either `assert.include` or `assert.notInclude` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=11').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - include vs. notInclude.
- text: You should choose the correct method for the first assertion - `include` vs. `notInclude`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=11').then(data => { assert.equal(data.assertions[0].method, 'notInclude', 'It\'s summer in july...'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - include vs. notInclude.
- text: You should choose the correct method for the second assertion - `include` vs. `notInclude`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=11').then(data => { assert.equal(data.assertions[1].method, 'include', 'JavaScript is a backend language !!'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

20
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property.md
View File

@ -6,41 +6,49 @@ forumTopicId: 301604
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>property</code> asserts that the actual object has a given property.
`property` asserts that the actual object has a given property.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.property()</code> or <code>assert.notProperty()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#16` in the `Objects` suite, change each `assert` to either `assert.property` or `assert.notProperty` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=15').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - property vs. notProperty.
- text: You should choose the correct method for the first assertion - `property` vs. `notProperty`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=15').then(data => { assert.equal(data.assertions[0].method, 'notProperty', 'A car has not wings'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - property vs. notProperty.
- text: You should choose the correct method for the second assertion - `property` vs. `notProperty`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=15').then(data => { assert.equal(data.assertions[1].method, 'property', 'planes have engines'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - property vs. notProperty.
- text: You should choose the correct method for the third assertion - `property` vs. `notProperty`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=15').then(data => { assert.equal(data.assertions[2].method, 'property', 'Cars have wheels'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

22
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor.md
View File

@ -6,43 +6,51 @@ forumTopicId: 301605
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>#instanceOf</code> asserts that an object is an instance of a constructor.
`#instanceOf` asserts that an object is an instance of a constructor.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.instanceOf()</code> or <code>assert.notInstanceOf()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#18` in the `Objects` suite, change each `assert` to either `assert.instanceOf` or `assert.notInstanceOf` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=17').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - instanceOf vs. notInstanceOf.
- text: You should choose the correct method for the first assertion - `instanceOf` vs. `notInstanceOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=17').then(data => { assert.equal(data.assertions[0].method, 'notInstanceOf', 'myCar is not an instance of Plane'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - instanceOf vs. notInstanceOf.
- text: You should choose the correct method for the second assertion - `instanceOf` vs. `notInstanceOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=17').then(data => { assert.equal(data.assertions[1].method, 'instanceOf', 'airlinePlane is an instance of Plane'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - instanceOf vs. notInstanceOf.
- text: You should choose the correct method for the third assertion - `instanceOf` vs. `notInstanceOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=17').then(data => { assert.equal(data.assertions[2].method, 'instanceOf', 'everything is an Object in JavaScript...'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - instanceOf vs. notInstanceOf.
- text: You should choose the correct method for the fourth assertion - `instanceOf` vs. `notInstanceOf`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=17').then(data => { assert.equal(data.assertions[3].method, 'notInstanceOf', 'myCar.wheels is not an instance of String'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

19
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another.md
View File

@ -6,42 +6,49 @@ forumTopicId: 301606
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isBelow()</code> (i.e. less than) or <code>assert.isAtLeast()</code> (i.e. greater than or equal) to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#9` in the `Comparisons` suite, change each `assert` to either `assert.isBelow` or `assert.isAtLeast` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=8').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isBelow vs. isAtLeast.
- text: You should choose the correct method for the first assertion - `isBelow` vs. `isAtLeast`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=8').then(data => { assert.equal(data.assertions[0].method, 'isAtLeast', '5 is at least (>=) 5'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isBelow vs. isAtLeast.
- text: You should choose the correct method for the second assertion - `isBelow` vs. `isAtLeast`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=8').then(data => { assert.equal(data.assertions[1].method, 'isAtLeast', '2 * Math.random() is at least 0'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isBelow vs. isAtLeast.
- text: You should choose the correct method for the third assertion - `isBelow` vs. `isAtLeast`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=8').then(data => { assert.equal(data.assertions[2].method, 'isBelow', '1 is smaller than 2'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isBelow vs. isAtLeast.
- text: You should choose the correct method for the fourth assertion - `isBelow` vs. `isAtLeast`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=8').then(data => { assert.equal(data.assertions[3].method, 'isBelow', '2/3 (0.6666) is smaller than 1'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

19
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok.md
View File

@ -6,44 +6,51 @@ forumTopicId: 301607
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>isOk()</code> will test for a truthy value and <code>isNotOk()</code> will test for a falsy value.
`isOk()` will test for a truthy value, and `isNotOk()` will test for a falsy value.
To learn more about truthy and falsy values, try our <a href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer" target="_blank">Falsy Bouncer</a> challenge.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.isOk()</code> or <code>assert.isNotOk()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#3` in the `Basic Assertions` suite, change each `assert` to either `assert.isOk()` or `assert.isNotOk()` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=2').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isOk vs. isNotOk.
- text: You should choose the correct method for the first assertion - `isOk` vs. `isNotOk`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=2').then(data => { assert.equal(data.assertions[0].method, 'isNotOk', 'Null is falsy'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isOk vs. isNotOk.
- text: You should choose the correct method for the second assertion - `isOk` vs. `isNotOk`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=2').then(data => { assert.equal(data.assertions[1].method, 'isOk','A string is truthy'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - isOk vs. isNotOk.
- text: You should choose the correct method for the third assertion - `isOk` vs. `isNotOk`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=2').then(data => { assert.equal(data.assertions[2].method, 'isOk', 'true is truthy'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

24
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string.md
View File

@ -6,39 +6,47 @@ forumTopicId: 301608
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>match()</code> asserts that the actual value matches the second argument regular expression.
`match()` asserts that the actual value matches the second argument regular expression.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.match()</code> or <code>assert.notMatch()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#15` in the `Strings` suite, change each `assert` to either `assert.match` or `assert.notMatch` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=14').then(data => { assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - match vs. notMatch.
testString: 'getUserInput => $.get(getUserInput(''url'') + ''/_api/get-tests?type=unit&n=14'').then(data => { assert.equal(data.assertions[0].method, ''match'', ''\''# name: John Doe, age: 35\'' matches the regex''); }, xhr => { throw new Error(xhr.responseText); })'
- text: You should choose the right assertion - match vs. notMatch.
testString: 'getUserInput => $.get(getUserInput(''url'') + ''/_api/get-tests?type=unit&n=14'').then(data => { assert.equal(data.assertions[1].method, ''notMatch'', ''\''# name: Paul Smith III, age: twenty-four\'' does not match the regex (the age must be numeric)''); }, xhr => { throw new Error(xhr.responseText); })'
- text: You should choose the correct method for the first assertion - `match` vs. `notMatch`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=14').then(data => { assert.equal(data.assertions[0].method, 'match', '\'# name:John Doe, age:35\' matches the regex'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the correct method for the second assertion - `match` vs. `notMatch`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=14').then(data => { assert.equal(data.assertions[1].method, 'notMatch', '\'# name:Paul Smith III, age:twenty-four\' does not match the regex (the age must be numeric)'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

22
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality.md
View File

@ -6,43 +6,51 @@ forumTopicId: 301609
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>equal()</code> compares objects using <code>==</code>.
`equal()` compares objects using `==`.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.equal()</code> or <code>assert.notEqual()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#5` in the `Equality` suite, change each `assert` to either `assert.equal` or `assert.notEqual` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=4').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - equal vs. notEqual.
- text: You should choose the correct method for the first assertion - `equal` vs. `notEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=4').then(data => { assert.equal(data.assertions[0].method, 'equal', 'Numbers are coerced into strings with == '); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - equal vs. notEqual.
- text: You should choose the correct method for the second assertion - `equal` vs. `notEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=4').then(data => { assert.equal(data.assertions[1].method, 'notEqual', ' == compares object references'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - equal vs. notEqual.
- text: You should choose the correct method for the third assertion - `equal` vs. `notEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=4').then(data => { assert.equal(data.assertions[2].method, 'equal', '6 * \'2\' is 12 ! It should be equal to \'12\''); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - equal vs. notEqual.
- text: You should choose the correct method for the fourth assertion - `equal` vs. `notEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=4').then(data => { assert.equal(data.assertions[3].method, 'notEqual', '6 + \'2\' is \'62\'...'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js

22
curriculum/challenges/english/06-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality.md
View File

@ -6,43 +6,51 @@ forumTopicId: 301610
---
## Description
<section id='description'>
As a reminder, this project is being built upon the following starter project on <a href="https://repl.it/github/freeCodeCamp/boilerplate-mochachai">Repl.it</a>, or cloned from <a href='https://github.com/freeCodeCamp/boilerplate-mochachai/'>GitHub</a>.
<code>strictEqual()</code> compares objects using <code>===</code>.
`strictEqual()` compares objects using `===`.
</section>
## Instructions
<section id='instructions'>
Use <code>assert.strictEqual()</code> or <code>assert.notStrictEqual()</code> to make the tests pass.
Within `tests/1_unit-tests.js` under the test labelled `#6` in the `Equality` suite, change each `assert` to either `assert.strictEqual` or `assert.notStrictEqual` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: All tests should pass.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=5').then(data => {assert.equal(data.state,'passed'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - strictEqual vs. notStrictEqual.
- text: You should choose the correct method for the first assertion - `strictEqual` vs. `notStrictEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=5').then(data => { assert.equal(data.assertions[0].method, 'notStrictEqual', 'with strictEqual the type must match'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - strictEqual vs. notStrictEqual.
- text: You should choose the correct method for the second assertion - `strictEqual` vs. `notStrictEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=5').then(data => { assert.equal(data.assertions[1].method, 'strictEqual', '3*2 = 6...'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - strictEqual vs. notStrictEqual.
- text: You should choose the correct method for the third assertion - `strictEqual` vs. `notStrictEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=5').then(data => { assert.equal(data.assertions[2].method, 'strictEqual', '6 * \'2\' is 12. Types match !'); }, xhr => { throw new Error(xhr.responseText); })
- text: You should choose the right assertion - strictEqual vs. notStrictEqual.
- text: You should choose the correct method for the fourth assertion - `strictEqual` vs. `notStrictEqual`.
testString: getUserInput => $.get(getUserInput('url') + '/_api/get-tests?type=unit&n=5').then(data => { assert.equal(data.assertions[3].method, 'notStrictEqual', 'Even if they have the same elements, the Arrays are notStrictEqual'); }, xhr => { throw new Error(xhr.responseText); })
```
</section>
## Challenge Seed
<section id='challengeSeed'>
</section>
## Solution
<section id='solution'>
```js