Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Automated testing with Mocha#100

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
otmon76 merged 3 commits intojavascript-tutorial:masterfromotmon76:1.3.5
Jun 3, 2025
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,50 @@
The testdemonstrates one of the temptations a developer meets when writing tests.
Tento testukazuje jedno z pokušení, kterým vývojář při psaní testů čelí.

What we have here is actually 3 tests, but layed out as a single function with 3 asserts.
To, co zde máme, jsou ve skutečnosti 3 testy, ale jsou vytvořeny jako jediná funkce se 3 kontrolami.

Sometimes it's easier to write this way, but if an error occurs, it's much less obvious what went wrong.
Někdy je jednodušší psát takto, ale když nastane chyba, je mnohem méně zřejmé, co bylo špatně.

If an error happens in the middle of a complex execution flow, then we'll have to figure out thedata at that point. We'll actually have to *debug the test*.
Nastane-li chyba uprostřed složitého provádění, musíme v té chvíli zjišťovat, jaká byladata. Vlastně musíme *ladit test*.

It would be much better to break thetestinto multiple `it`blocks with clearly written inputs and outputs.
Bylo by mnohem lepší rozdělittestdo několika `it`bloků s jasně uvedenými vstupy a výstupy.

Like this:
Například takto:
```js
describe("Raises xto power n", function() {
it("5in the power of 1 equals 5", function() {
assert.equal(pow(5, 1), 5);
describe("Umocní xna n-tou", function() {
it("5na 1 se rovná 5", function() {
assert.equal(mocnina(5, 1), 5);
});

it("5in the power of 2 equals 25", function() {
assert.equal(pow(5, 2), 25);
it("5na 2 se rovná 25", function() {
assert.equal(mocnina(5, 2), 25);
});

it("5in the power of 3 equals 125", function() {
assert.equal(pow(5, 3), 125);
it("5na 3 se rovná 125", function() {
assert.equal(mocnina(5, 3), 125);
});
});
```

We replaced the single`it`with `describe`and a group of`it`blocks. Now if something fails we would see clearly what thedata was.
Nahradili jsme jediné`it`za `describe`a skupinu`it`bloků. Když nyní něco selže, jasně uvidíme, jaká byladata.

Also we can isolate a singletestand run it in standalone mode by writing`it.only`instead of `it`:
Nyní můžeme také izolovat jedinýtesta spustit jej samostatně. To uděláme tak, že napíšeme`it.only`místo `it`:


```js
describe("Raises xto power n", function() {
it("5in the power of 1 equals 5", function() {
assert.equal(pow(5, 1), 5);
describe("Umocní xna n-tou", function() {
it("5na 1 se rovná 5", function() {
assert.equal(mocnina(5, 1), 5);
});

*!*
// Mochawill run only this block
it.only("5in the power of 2 equals 25", function() {
assert.equal(pow(5, 2), 25);
// Mochaspustí pouze tento blok
it.only("5na 2 se rovná 25", function() {
assert.equal(mocnina(5, 2), 25);
});
*/!*

it("5in the power of 3 equals 125", function() {
assert.equal(pow(5, 3), 125);
it("5na 3 se rovná 125", function() {
assert.equal(mocnina(5, 3), 125);
});
});
```
20 changes: 10 additions & 10 deletions1-js/03-code-quality/05-testing-mocha/3-pow-test-wrong/task.md
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,23 +2,23 @@ importance: 5

---

#What's wrong in the test?
#Co je na tomto testu špatně?

What's wrong in the test of `pow` below?
Co je špatně na níže uvedeném testu funkce `mocnina`?

```js
it("Raises xto the power n", function() {
it("Umocní xna n-tou", function() {
let x = 5;

letresult = x;
assert.equal(pow(x, 1),result);
letvýsledek = x;
assert.equal(mocnina(x, 1),výsledek);

result *= x;
assert.equal(pow(x, 2),result);
výsledek *= x;
assert.equal(mocnina(x, 2),výsledek);

result *= x;
assert.equal(pow(x, 3),result);
výsledek *= x;
assert.equal(mocnina(x, 3),výsledek);
});
```

P.S.Syntactically thetestis correct and passes.
P.S.Syntakticky je tentotestkorektní a projde.
358 changes: 179 additions & 179 deletions1-js/03-code-quality/05-testing-mocha/article.md
View file
Open in desktop

Large diffs are not rendered by default.

View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<!--add mochacss, to show results -->
<!--přidámecss mochy, aby se zobrazily výsledky -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.css">
<!--add mocha framework code -->
<!--přidáme kód frameworku mocha -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.js"></script>
<script>
//enable bdd-style testing
//umožňuje testování stylem bdd
mocha.setup('bdd');
</script>
<!--add chai -->
<!--přidáme chai -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.5.0/chai.js"></script>
<script>
// chaihas a lot of stuff, let's makeassertglobal
// chaimá spoustu věcí, učinímeassertglobálním
let assert = chai.assert;
</script>
</head>

<body>

<!--the script with tests (describe, it...) -->
<!--skript s testy (describe, it...) -->
<script src="test.js"></script>

<!--the element withid="mocha"will contain test results -->
<!--prvek sid="mocha"bude obsahovat výsledky testů -->
<div id="mocha"></div>

<!--run tests! -->
<!--spustíme testy! -->
<script>
mocha.run();
</script>
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
describe("test", function() {

// Mochausually waits for the tests for 2 seconds before considering them wrong
// Mochaobvykle čeká na provedení testu 2 sekundy a pak jej považuje za špatný

this.timeout(200000); //With this code we increase this -in this case to 200,000milliseconds
this.timeout(200000); //S tímto kódem to můžeme zvýšit -v tomto případě na 200000milisekund

//This is because of the"alert" function, because if you delay pressing the"OK" button the tests will not pass!
//To je kvůli funkci"alert", protože jestliže budete zaváhat se stisknutím tlačítka"OK", testy neprojdou!

before(() => alert("Testing started – before all tests"));
after(() => alert("Testing finished – after all tests"));
before(() => alert("Začíná testování - před všemi testy"));
after(() => alert("Končí testování - po všech testech"));

beforeEach(() => alert("Before a test – enter a test"));
afterEach(() => alert("After a test – exit a test"));
beforeEach(() => alert("Před testem - vstup do testu"));
afterEach(() => alert("Po testu - výstup z testu"));

it('test 1', () => alert(1));
it('test 2', () => alert(2));
Expand Down
20 changes: 10 additions & 10 deletions1-js/03-code-quality/05-testing-mocha/index.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<!--add mochacss, to show results -->
<!--přidámecss mochy, aby se zobrazily výsledky -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.css">
<!--add mocha framework code -->
<!--přidáme kód frameworku mocha -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.js"></script>
<script>
mocha.setup('bdd'); //minimal setup
mocha.setup('bdd'); //minimální nastavení
</script>
<!--add chai -->
<!--přidáme chai -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.5.0/chai.js"></script>
<script>
// chaihas a lot of stuff, let's makeassertglobal
// chaitoho obsahuje spoustu, učinímeassertglobálním
let assert = chai.assert;
</script>
</head>

<body>

<script>
functionpow(x, n) {
/*function code is to be written, empty now */
functionmocnina(x, n) {
/*kód funkce musí být napsán, nyní je prázdný */
}
</script>

<!--the script with tests (describe, it...) -->
<!--skript s testy (describe, it...) -->
<script src="test.js"></script>

<!--the element withid="mocha"will contain test results -->
<!--prvek sid="mocha"bude obsahovat výsledky testů -->
<div id="mocha"></div>

<!--run tests! -->
<!--spustíme testy! -->
<script>
mocha.run();
</script>
Expand Down
20 changes: 10 additions & 10 deletions1-js/03-code-quality/05-testing-mocha/pow-1.view/index.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,37 @@
<!DOCTYPE html>
<html>
<head>
<!--add mochacss, to show results -->
<!--přidámecss mochy, aby se zobrazily výsledky -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.css">
<!--add mocha framework code -->
<!--přidáme kód frameworku mocha -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.js"></script>
<script>
//enable bdd-style testing
//umožňuje testování stylem bdd
mocha.setup('bdd');
</script>
<!--add chai -->
<!--přidáme chai -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.5.0/chai.js"></script>
<script>
// chaihas a lot of stuff, let's makeassertglobal
// chaimá spoustu věcí, učinímeassertglobálním
let assert = chai.assert;
</script>
</head>

<body>

<script>
functionpow(x, n) {
/*function code is to be written, empty now */
functionmocnina(x, n) {
/*kód funkce ještě musí být napsán, prozatím je prázdný */
}
</script>

<!--the script with tests (describe, it...) -->
<!--skript s testy (describe, it...) -->
<script src="test.js"></script>

<!--the element withid="mocha"will contain test results -->
<!--prvek sid="mocha"bude obsahovat výsledky testů -->
<div id="mocha"></div>

<!--run tests! -->
<!--spustíme testy! -->
<script>
mocha.run();
</script>
Expand Down
6 changes: 3 additions & 3 deletions1-js/03-code-quality/05-testing-mocha/pow-1.view/test.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
describe("pow", function() {
describe("mocnina", function() {

it("raises to n-th power", function() {
assert.equal(pow(2, 3), 8);
it("umocňuje na n-tou", function() {
assert.equal(mocnina(2, 3), 8);
});

});
20 changes: 10 additions & 10 deletions1-js/03-code-quality/05-testing-mocha/pow-2.view/index.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,37 @@
<!DOCTYPE html>
<html>
<head>
<!--add mochacss, to show results -->
<!--přidámecss mochy, aby se zobrazily výsledky -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.css">
<!--add mocha framework code -->
<!--přidáme kód frameworku mocha -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.js"></script>
<script>
//enable bdd-style testing
//umožňuje testování stylem bdd
mocha.setup('bdd');
</script>
<!--add chai -->
<!--přidáme chai -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.5.0/chai.js"></script>
<script>
// chaihas a lot of stuff, let's makeassertglobal
// chaimá spoustu věcí, učinímeassertglobálním
let assert = chai.assert;
</script>
</head>

<body>

<script>
functionpow(x, n) {
return 8; // :)we cheat!
functionmocnina(x, n) {
return 8; // :)podvádíme!
}
</script>

<!--the script with tests (describe, it...) -->
<!--skript s testy (describe, it...) -->
<script src="test.js"></script>

<!--the element withid="mocha"will contain test results -->
<!--prvek sid="mocha"bude obsahovat výsledky testů -->
<div id="mocha"></div>

<!--run tests! -->
<!--spustíme testy! -->
<script>
mocha.run();
</script>
Expand Down
10 changes: 5 additions & 5 deletions1-js/03-code-quality/05-testing-mocha/pow-2.view/test.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
describe("pow", function() {
describe("mocnina", function() {

it("2raised to power 3 is 8", function() {
assert.equal(pow(2, 3), 8);
it("2na 3 je 8", function() {
assert.equal(mocnina(2, 3), 8);
});

it("3raised to power 4 is 81", function() {
assert.equal(pow(3, 4), 81);
it("3na 4 je 81", function() {
assert.equal(mocnina(3, 4), 81);
});

});
24 changes: 12 additions & 12 deletions1-js/03-code-quality/05-testing-mocha/pow-3.view/index.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,43 @@
<!DOCTYPE html>
<html>
<head>
<!--add mochacss, to show results -->
<!--přidámecss mochy, aby se zobrazily výsledky -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.css">
<!--add mocha framework code -->
<!--přidáme kód frameworku mocha -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/3.2.0/mocha.js"></script>
<script>
//enable bdd-style testing
//umožňuje testování stylem bdd
mocha.setup('bdd');
</script>
<!--add chai -->
<!--přidáme chai -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.5.0/chai.js"></script>
<script>
// chaihas a lot of stuff, let's makeassertglobal
// chaimá spoustu věcí, učinímeassertglobálním
let assert = chai.assert;
</script>
</head>

<body>

<script>
functionpow(x, n) {
letresult = 1;
functionmocnina(x, n) {
letvýsledek = 1;

for (let i = 0; i < n; i++) {
result *= x;
výsledek *= x;
}

returnresult;
returnvýsledek;
}
</script>

<!--the script with tests (describe, it...) -->
<!--skript s testy (describe, it...) -->
<script src="test.js"></script>

<!--the element withid="mocha"will contain test results -->
<!--prvek sid="mocha"bude obsahovat výsledky testů -->
<div id="mocha"></div>

<!--run tests! -->
<!--spustíme testy! -->
<script>
mocha.run();
</script>
Expand Down
Loading

[8]ページ先頭

©2009-2025 Movatter.jp