- Attempting to create a test case for my jsx file...
- Took a sample test case from another jsx file...
- The other file does not have the connect method...
- But this new file contains the connect method...
- Believe this is causing issues with my test case...
- Any suggestions on how to resolve this would be appreciated...
- Providing my code below...
- Find the code here: https://gist.github.com/js08/d590e78e8923e68b191a
SyntaxError: C:/codebase/sports/test/sports-tests.js: Unexpected token (20:73) 18 | 19 | it('should render correctly', () => {
20 | shallowRenderer.render(); | ^ 21 | /*let renderedElement = shallowRenderer.getRenderOutput(); 22 |
test case
import {expect} from 'chai';
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import sportsPageDefault from '../src/sports-Page-Default';
import initializeJsDom from './test-utils/dom.js';
import {getGridLayoutClasses} from 'sports-css-grids';
//import _difference from 'lodash/array/difference';
describe('shallow renderer tests for sports-Page-Default ', function() {
let shallowRenderer = TestUtils.createRenderer();
console.log("shallowRenderer" + JSON.stringify(shallowRenderer));
it('should render correctly', () => {
shallowRenderer.render(<sportsPageDefault headerClass='8887' layout= {id: 100, text: 'hello world'} sidebar= {id: 100, text: 'hello world'} title="Demo" />);
let renderedElement = shallowRenderer.getRenderOutput();
console.log(renderedElement);
/* let actualTitleEl = renderedElement.props.children[0].props.children[0];
let expectedTitleEl = <h1 className="transactionalPageHeader-appName font-serif">Demo</h1>;
expect(actualTitleEl).to.deep.equal(expectedTitleEl);*/
});
});
actual code
import './css/sports-bottom-layout.css';
import './css/sports-Page.css';
import './css/sports-leftCornerLayout.css';
import React from 'react';
import PageHeader from './components/page-header/page-header';
import MainContent from './components/main-content';
import sports-bottom-layout from './components/sports-bottom-layout/sports-bottom-layout';
import {getPanelLayoutState} from './util/PageLayout';
import {getGridLayoutClasses} from 'sports-css-grids/lib/js/gridLayout';
import PagePureRenderMixin from './util/PagePureRenderMixin';
import {connect} from 'react-redux';
import {setHeaderPanelState, setRightPanelState} from './redux/layout/layout-actions';
console.log("inside");
let customMixin = PagePureRenderMixin({
state: {
mainPanelGridClassList: function(classArray) {
return classArray.length;
console.log("classArray.length" + classArray.length);
}
}
});
let PT = React.PropTypes;
let sportsPageDefault = React.createClass({
propTypes: {
headerClass: React.PropTypes.string,
layout: PT.object.isRequired,
sports-leftCornerLayout: PT.oneOfType([
PT.func,
PT.object
]),
title: PT.string.isRequired
},
//component mount code
});
function sportsShallow(itemA, itemB) {
for (let i in itemA) {
if (itemA[i] !== itemB[i]) {
return false;
}
}
return true;
}
export default connect(state => ({
layout: state.Page.layout
}))(sportsPageDefault);
Error: ts throwing an error since not sure how to pass in one-off types for function....
shallowRenderer.render(<sportsPageDefault headerClass='8887' layout= {{id: 100, text: 'hello world'}} sidebar= {[{onAppExit},{id: 100, text: 'hello world'}]} title={"Demo"} />);
propTypes: {
headerClass: React.PropTypes.string,
layout: PT.object.isRequired,
sports-leftCornerLayout: PT.oneOfType([
PT.func,
PT.object
]),
title: PT.string.isRequired
},
TypeError: Cannot read property 'propTypes' of undefined
at [object Object].ReactCompositeComponentMixin._processProps (\node_modules\react\lib\ReactCompositeComponent.js:352:20)
at [object Object].ReactCompositeComponentMixin.mountComponent (\node_modules\react\lib\ReactCompositeComponent.js:129:28)
at [object Object].wrapper as mountComponent
at [object Object].ReactShallowRenderer._render (\node_modules\react\lib\ReactTestUtils.js:362:14)
at [object Object].ReactShallowRenderer.render (\node_modules\react\lib\ReactTestUtils.js:344:8)
at Context. (C:/codebase/usaa-template-standard/test/usaa-template-standard-tests.js:23:25)