Skip to content

Instantly share code, notes, and snippets.

@elvisgiv
Created July 8, 2019 08:13
Show Gist options
  • Save elvisgiv/78aca6b5165def84e0f6066bd2bb42e2 to your computer and use it in GitHub Desktop.
Save elvisgiv/78aca6b5165def84e0f6066bd2bb42e2 to your computer and use it in GitHub Desktop.

Sinon Stub method which invoke from method after click

export default class Class extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            typeOfNodes: 0,
            lifetimeInYears: 1,
        };
        //
        this.toggleTwo = this.toggleTwo.bind(this);
    }
    
    async toggleTwo(event) {
        await this.setState({
            typeOfNodes: event,
        });
        // invoke another function
        this.getPrice(event);
    }

    async getPrice(event) {
        let lifetimeInYears = event ? event['value'] : this.state.lifetimeInYears;
        let lifetimeInSeconds = parseInt(lifetimeInYears) * 366 * 86400;
        let priceInWei = someLibMethod({
            indexOfType: parseInt(this.state.typeOfNodes), lifetime: lifetimeInSeconds
        });
        let res = await this.fromWei(priceInWei);
        this.setState({
            deposit: res, totalDeposit: res,
            totalDepositInWei: priceInWei, lifetimeInSeconds: lifetimeInSeconds,
            lifetimeInYears: lifetimeInYears, selectedOption: event,
        });
        console.log('price of schain', res);
    }
    
    render() {
        return (
            <div className="marg-30">
                <div className='flex-item marg-top-30 marg-bott-30 marg-ri-15'>
                    <div onClick={() => this.toggleTwo(1)} id={'tiny-schain'}>
                        <div
                            className={"s-chain-item " + (this.state.typeOfNodes === 1 ? "s-chain-item-hover" : "")}>
                               <p className="s-chain-text">
                                   <strong>Tiny</strong>
                               </p>
                        </div>
                    </div>
                </div>
            </div>
        )
    }

in test

import React from 'react';
import {shallow, mount} from 'enzyme';
import {expect} from 'chai';
import Class from '../src/components/pages/CreateSChain';
import sinon from "sinon";
import {Router} from "react-router";
import {createBrowserHistory} from "history";



const componentInstance = wrapper
    .childAt(0) // could also be .find(Foo)
    .instance();
    
describe('<Class/>', function () {
    it('should click on "#tiny-schain" div', function () {
        // stub function
        sinon.stub(CreateSChain.prototype, 'getPrice').resolves(1000);
        // mount
        const wrapper = mount(
            <Router history={history}>
                <Class
                />
            </Router>, {attachTo: Tooltip20452}
        );
        let button = wrapper.find('#tiny-schain');
        expect(componentInstance.state.typeOfNodes).to.equal(0)
        button.simulate('click')
        expect(componentInstance.state.typeOfNodes).to.equal(1)
    });
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment