Mocha, Enzima: Unità che verifica le funzioni personalizzate nel componente reattivo utilizzando l'enzima

Question

Sto lavorando alla creazione di test unitari di componenti reattivi utilizzando mocha, enzima. Di seguito è riportato un componente di esempio.

Foo.js

class Foo extends React.Component { 
    customFunction=() => { 
    } 

    render() { 
     return (<div className={this.props.name}/>); 
    } 
} 

E qui è il file di test.

Foo-test.js

import React from 'react'; 
import { expect } from 'chai'; 
import { shallow, mount, render } from 'enzyme'; 
import Foo from '../src/Foo'; 

describe("A suite", function() { 
    it("contains spec with an expectation", function() { 
     expect(shallow(<Foo />).contains(<div className="foo" />)).to.equal(true); 
    }); 

    it("contains spec with an expectation", function() { 
     expect(shallow(<Foo />).is('.foo')).to.equal(true); 
    }); 
}); 

Tutto è buono. ma non ho capito come unità di prova customFunction in Foo.js quando stiamo usando enzima

Answer 1

La migliore risposta a questa domanda in realtà dipende da che cosa è che customFunction sta effettivamente facendo ...

Puoi chiamare la funzione come questa:

wrapper.instance().customFunction('foo', 'bar'); 

Se si tratta di una funzione che imposta lo stato nell'istanza stessa, e quindi colpisce ciò che l'output di rendering sembra, si consiglia di chiamare .update() così

wrapper.instance().customFunction('foo', 'bar'); // uses setState internally 
wrapper.update(); // updates render tree 
// do assertions on the rendered output