Skip to content

Instantly share code, notes, and snippets.

@js08 js08/mocha-error.md
Created May 6, 2016

Embed
What would you like to do?

hi,

  • i am trying to fix an error in mocha test case.
  • tried debugging it but not sure why the error is happening.
  • providing the code below
  • anonymous error is pointing to this line shallowRenderer.render();

Error

  1. shallow renderer tests for wcm-disclosure should not render anything when created: TypeError: Cannot read property '_currentElement' of null at [object Object].ReactCompositeComponentMixin._updateRenderedComponent (C:\sports-page-all\node_modules\react\lib\ReactCompositeComponent.js:559:52) at [object Object].ReactCompositeComponentMixin._performComponentUpdate (C:\sports-page-all\node_modules\react\lib\ReactCompositeComponent.js:544:10) at [object Object].ReactCompositeComponentMixin.updateComponent (C:\sports-page-all\node_modules\react\lib\ReactCompositeComponent.js:473:12) at [object Object].wrapper [as updateComponent] (C:\sports-page-all\node_modules\react\lib\ReactPerf.js:66:21) at [object Object].ReactCompositeComponentMixin.performUpdateIfNecessary (C:\sports-page-all\node_modules\react\lib\ReactCompositeComponent.js:421:12) at Object.ReactReconciler.performUpdateIfNecessary (C:\sports-page-all\node_modules\react\lib\ReactReconciler.js:102:22) at runBatchedUpdates (C:\sports-page-all\node_modules\react\lib\ReactUpdates.js:129:21) at ReactReconcileTransaction.Mixin.perform (C:\sports-page-all\node_modules\react\lib\Transaction.js:136:20) at ReactUpdatesFlushTransaction.Mixin.perform (C:\sports-page-all\node_modules\react\lib\Transaction.js:136:20) at ReactUpdatesFlushTransaction.assign.perform (C:\sports-page-all\node_modules\react\lib\ReactUpdates.js:86:38) at Object.flushBatchedUpdates (C:\sports-page-all\node_modules\react\lib\ReactUpdates.js:147:19) at Object.wrapper [as flushBatchedUpdates] (C:\sports-page-all\node_modules\react\lib\ReactPerf.js:66:21) at ReactDefaultBatchingStrategyTransaction.Mixin.closeAll (C:\sports-page-all\node_modules\react\lib\Transaction.js:202:25) at ReactDefaultBatchingStrategyTransaction.Mixin.perform (C:\sports-page-all\node_modules\react\lib\Transaction.js:149:16) at Object.ReactDefaultBatchingStrategy.batchedUpdates (C:\sports-page-all\node_modules\react\lib\ReactDefaultBatchingStrategy.js:62:19) at Object.enqueueUpdate (C:\sports-page-all\node_modules\react\lib\ReactUpdates.js:176:22) at enqueueUpdate (C:\sports-page-all\node_modules\react\lib\ReactUpdateQueue.js:24:16) at Object.ReactUpdateQueue.enqueueSetState (C:\sports-page-all\node_modules\react\lib\ReactUpdateQueue.js:190:5) at [object Object].ReactComponent.setState (C:\sports-page-all\node_modules\react\lib\ReactComponent.js:65:16) at [object Object].componentWillMount (C:/codebase/sports-page-all/src/components/disclosure.jsx:51:18) at [object Object].ReactCompositeComponentMixin.mountComponent (C:\sports-page-all\node_modules\react\lib\ReactCompositeComponent.js:210:12) at [object Object].wrapper [as mountComponent] (C:\sports-page-all\node_modules\react\lib\ReactPerf.js:66:21) at [object Object].ReactShallowRenderer._render (C:\sports-page-all\node_modules\react\lib\ReactTestUtils.js:362:14) at [object Object].ReactShallowRenderer.render (C:\sports-page-all\node_modules\react\lib\ReactTestUtils.js:344:8) at Context. (C:/codebase/sports-page-all/test/components/disclosure-tests.js:21:25) at callFn (C:\sports-page-all\node_modules\mocha\lib\runnable.js:286:21) at Test.Runnable.run (C:\sports-page-all\node_modules\mocha\lib\runnable.js:279:7) at Runner.runTest (C:\sports-page-all\node_modules\mocha\lib\runner.js:421:10) at C:\sports-page-all\node_modules\mocha\lib\runner.js:528:12 at next (C:\sports-page-all\node_modules\mocha\lib\runner.js:341:14) at C:\sports-page-all\node_modules\mocha\lib\runner.js:351:7 at next (C:\sports-page-all\node_modules\mocha\lib\runner.js:283:14) at Immediate._onImmediate (C:\sports-page-all\node_modules\mocha\lib\runner.js:319:5)

test case


import {expect} from 'chai';
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import {BottomContainerComponent} from '../../src/components/bottom-container';

console.log("BottomContainerComponent");
describe('shallow renderer tests for ball-bottom-container ', function() {
    let shallowRenderer = TestUtils.createRenderer();
    let bottom-containers = [
        {
            'sports-user': 'bottom-container1',
            'sports-representation': 'BottomContainer Text',
            'sports-signal': 'BelowFootnotes'
        }
    ];

    it('should not render anything when created', () => {
        console.log("BottomContainerComponent--->");
        console.log(BottomContainerComponent);
         console.log("BottomContainerComponent--->");
        shallowRenderer.render(<BottomContainerComponent ballKey='bottom-container' bottom-containers={bottom-containers}/>);

        let renderedElement = shallowRenderer.getRenderOutput();

        expect(renderedElement).to.be.null;
    });
});

functionality code


import React from 'react';
//import ReactDOMServer from 'react-dom/server';
import {connect} from 'react-redux';
import * as bottom-containerActions from '../redux/bottom-containers/bottom-containers-actions';
import ballRetriever from 'sports-ball-utils/lib/ball-retriever';




let _dispatch;

let success = function (data) {
    let content = data[0];
    //TODO: Get WCM REST service to return sports-signal as well
    _dispatch(bottom-containerActions.addBottomContainer({
        sports-user: content.key,
        sports-representation: content.markup,
        sports-signal: content.sports-signal
    }));
};

//TODO: named export so I can get IDE docs
//TODO: turn this into a redux-thunk
/**
 * Helper to add a bottom-container from WCM to the Standard Template footer
 * @param bottom-containerWcmKey
 * @param dispatch
 */
export function addWcmBottomContainer(bottom-containerWcmKey, dispatch) {
    _dispatch = dispatch;

    ballRetriever(bottom-containerWcmKey, success);
}

let customIdCounter = 0;

let BottomContainerComponent = React.createClass({
    propTypes: {
        sports-representation: React.PropTypes.string,
        ballKey: React.PropTypes.string
    },

    getInitialState() {
        return {
            sports-user: ''
        };
    },

    componentWillMount() {
        if (this.props.ballKey) {
            this.setState({sports-user: this.props.ballKey});
        } else {
            this.setState({sports-user: `customBottomContainer-${++customIdCounter}`});
        }
    },

    componentDsports-userMount() {
        if (this.props.ballKey) {
            ballRetriever(this.state.sports-user, ([data]) => {
                let content = data[0];
                //TODO: Get WCM REST service to return sports-signal as well
                _dispatch(bottom-containerActions.addBottomContainer({
                    sports-user: content.key,
                    sports-representation: content.markup,
                    sports-signal: content.sports-signal
                }));
            });

        } else if (this.props.sports-representation) {
            let {sports-representation} = this.props;

            if (typeof sports-representation !== 'string') {
                console.log('bottom-container not using string - discarding bottom-container!'); //eslint-disable-line
                return;
            }

            this.props.dispatch(bottom-containerActions.addBottomContainer({
                sports-user: this.state.sports-user,
                sports-representation
            }));
        }
    },

    componentWillUnmount() {
        this.props.dispatch(bottom-containerActions.removeBottomContainer(this.state.sports-user));
    },

    render() {
        return false;
    }
});


// empty connect to get access to dispatch()
export default connect()(BottomContainerComponent);

// Export non-connected BottomContainerComponent for testing
export {BottomContainerComponent};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.