Practicar sintaxi amb tests unitaris (framework Mocha)

De wikijoan
Salta a la navegació Salta a la cerca

Introducció

Mocha és un framework per a fer tests unitaris. Ara que estem aprenent la sintaxi del llenguatge Javascript, donem preferència a la consola del navegador web i la consola de Node per practicar amb Javascript.

Mitjançant els tests unitaris podem fer tests que ens permetin acreditar el bon funcionament de les nostres funcions i procediments.

Instal·lació i primers passos

Llibreria per fer tests unitaris:

Instal·lació Primer de tot, crea la teva carpeta de treball per fer tests. Per exemple: ~/M06_2122/UF1/test 

$ cd ~/M06_2122/UF1/test
$ npm init (com a entry point posarem ''test.js'')

es crea el fitxer package.json

Intal·lem el packet mocha de forma local: 

$ npm install mocha

es crea la carpeta node_modules, que conté la carpeta mocha/. 

$ mkdir test
$ nano test/test.js # or open with your favorite editor

En comptes de nano pots fer servir el teu editor per defecte, o fins i tot un editor gràfic (el professor fa servir l'editor joe).

Contingut del script test.js: 

var assert = require('assert');
describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal([1, 2, 3].indexOf(4), -1);
    });
  });
});

Aquest script el que fa és avaluar si dins de l'array [1,2,3] hi ha l'element 4. Com que no hi és, el mètode indexOf() retorna un -1. Aquesta és la manera com podem testejar el funcionament del mètode indexOf().

I ara ja podem testejar el script: 

$ ./node_modules/mocha/bin/mocha

  Array
    #indexOf()
      ✓ should return -1 when the value is not present


  1 passing (9ms)

Anem a fer-ho més senzill. Editem el fitxer package.json: 

"scripts": {
  "test": "mocha"
}

I ara senzillament hem de fer: 

$ npm test

Diferents possibilitats

SYNCHRONOUS CODE

A part de assert, podem utilitzar altres llibreries, com per exemple should: 

$ npm install should --save-dev

Codi: 

describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      [1, 2, 3].indexOf(5).should.equal(-1);
      [1, 2, 3].indexOf(0).should.equal(-1);
    });
  });
});

i en aquest cas podem testejar dues sentències de forma síncrona.

DYNAMICALLY GENERATING TESTS

Provem el següent codi: 

const assert = require('assert');

function add(args) {
  return args.reduce((prev, curr) => prev + curr, 0);
}

describe('add()', function() {
  const tests = [
    {args: [1, 2], expected: 3},
    {args: [1, 2, 3], expected: 6},
    {args: [1, 2, 3, 4], expected: 10}
  ];

  tests.forEach(({args, expected}) => {
    it(`correctly adds ${args.length} args`, function() {
      const res = add(args);
      assert.strictEqual(res, expected);
    });
  });
});

En aquest cas, si ens fixem bé en el codi, amb la funció add() estem avaluant la suma dels elements de l'array, i aquesta operació la fem tres vegades. El resultat que obtenim en la consola: 

> test@1.0.0 test
> mocha


  add()
    ✔ correctly adds 2 args
    ✔ correctly adds 3 args
    ✔ correctly adds 4 args


  3 passing (3ms)

Provar els tests unitaris en el navegador

Mocha test en el navegador

mocha_test.html: 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Mocha Tests</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
  </head>
  <body>
    <div id="mocha"></div>

    <script src="https://unpkg.com/chai/chai.js"></script>
    <script src="https://unpkg.com/mocha/mocha.js"></script>

    <script class="mocha-init">
      mocha.setup('bdd');
      mocha.checkLeaks();
    </script>

    <script src="./test_html.js"></script>
    <script class="mocha-exec">
      mocha.run();
    </script>
  </body>
</html>

El nostre test_html.js queda de la següent forma: (necessitem la llibreria chai) 

//https://www.chaijs.com/
let assert = chai.assert;
let should = chai.should();
let expect = chai.expect;

describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal([1, 2, 3].indexOf(4), -1);
    });
  });
});


describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      [1, 2, 3].indexOf(5).should.equal(-1);
      [1, 2, 3].indexOf(0).should.equal(-1);
    });
  });
})


function add(args) {
  return args.reduce((prev, curr) => prev + curr, 0);
}

describe('add()', function() {
  const tests = [
    {args: [1, 2], expected: 3},
    {args: [1, 2, 3], expected: 6},
    {args: [1, 2, 3, 4], expected: 10}
  ];

  tests.forEach(({args, expected}) => {
    it(`correctly adds ${args.length} args`, function() {
      const res = add(args);
      assert.strictEqual(res, expected);
    });
  });
});

var cad = 'Don Quijote de la Mancha';

describe('Strings', function() {
  describe('és una cadena', function() {
    it(cad + ': comrpovem si és una cadena...', function() {
      expect(cad).to.be.a('string');;
    });
  });
});

creat per Joan Quintana Compte, setembre 2021

Obtingut de «http://wiki.joanillo.org/index.php?title=Practicar_sintaxi_amb_tests_unitaris_(framework_Mocha)&oldid=297804»