Document

[[oktatas:web:javascript:javascript_teszt:jasmine|< Jasmine]] ====== Jasmine-browser-runner kezdés ====== * **Szerző:** Sallai András * Copyright (c) 2022, Sallai András * Szerkesztve: 2022, 2023 * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC BY-SA 4.0]] * Web: https://szit.hu ===== Jasmine kezdés ===== npm install --save-dev jasmine-browser-runner jasmine-core yarn add --dev jasmine-browser-runner jasmine-core Készítsük elő a Jasmine-t: npx jasmine-browser-runner init A parancs hatására, létrejön egy spec/support/jasmine-browser.json fájl. Itt találhatók a Jasmine alapbeállításai.


{
  "srcDir": "src",
  "srcFiles": [
    "**/*.js"
  ],
  "specDir": "test",
  "specFiles": [
    "**/*[sS]pec.js"
  ],
  "helpers": [
    "helpers/**/*.js"
  ],
  "env": {
    "stopSpecOnExpectationFailure": false,
    "stopOnSpecFailure": false,
    "random": false
  },
  "browser": {
    "name": "firefox"
  }
}

A "specDir" tulajdonság alapértelmezetten a "spec" könyvtárra mutat. Ezt átírtam a mintában "test"-re. A package.json fájlban állítsunk be egy scriptet:


"scripts": [ 
  "test": "jasmine-browser-runner serve" 
  ]

===== Tesztírás =====





    
    
    Document


    Vmi

    
        Alap
        


        Magasság
        


        
        


        Terület


const baseElem = document.querySelector("#base");
const heightElem = document.querySelector("#height");
const calcButton = document.querySelector("#calcButton");
const areaElem = document.querySelector("#area");

if(calcButton) {
    calcButton.addEventListener('click', () => {
        let base = Number(baseElem.value);
        let height = Number(heightElem.value);
        let area = calcTriangleArea(base, height);
        areaElem.value = area;
    });
}

const calcTriangleArea = (base, height) => {
    return base * height / 2;
}


describe("Egy teszt", function() {
    it("Van egy kivétel", function() {
      expect(true).toBe(true);
    });
  });


describe("A suite", function() {
  it("contains spec with an expectation", function() {
    expect(true).toBe(true);
  });

  it("calcTriangleArea tesztélse", function() {
    let area = calcTriangleArea(30, 35);
    expect(525).toEqual(area);
  });
});

===== Indítás ===== ==== Böngészőben ==== A teszt indítása: npm test A böngészőbe írjuk be: * http://localhost:8888 ==== Parancssor ==== Futtatás parancssorból: npx jasmine-browser-runner runSpecs Ideiglenesen így is elindul egy böngésző, de le is áll. Szükség lehet a chromedriver csomagra, ha az aktuális chrome driver régebbi: npm install chromedriver ===== Esetek tiltása =====


xdescribe('Valami', () => {
   //valami kód
});


describe('Valami', () => {
    xit('Más valami', () => {
        //kód
    });
});

===== createTd tesztje =====


function createTd() {
    let td = document.createElement('td');
    let button = document.createElement('button');
    button.textContent = 'valami';
    td.append(button);
    return td;
}



describe('createTd() metódus tesztje', () => {
    it('object típus ad vissza', () => {        
        let actual = typeof createTd() == 'object';
        expect(actual).toBe(true)
    })
    it('A visszaadott elemben egy elem van', () => {
        let actual = createTd().childElementCount == 1
        expect(actual).toBe(true)
    })
    it('A visszadott elem tartalma', () => {
        let actual  = createTd().textContent == 'valami'
        expect(actual).toBe(true)
    })
    it('A gyemek button?', () => {
        let actual;
        createTd().childNodes.forEach(node => {
            actual = node.nodeName == 'BUTTON'
        })
        expect(actual).toBe(true)
    })    
});

===== Linkek ===== * https://jasmine.github.io/setup/browser.html (2023) * https://jasmine.github.io/api/4.5/matchers (2023) * https://howtodoinjava.com/javascript/jasmine-unit-testing-tutorial/ (2023) * https://www.guru99.com/node-js-testing-jasmine.html (2023)