jeudi 2 juillet 2015

Testing React components with Jest

I'm trying to get started on TDD on Node.js and React, just installed and made Jest work, however my first test is failing with some error code that I can't understand.

Here is the error I get when I run 'npm test':

Using Jest CLI v0.4.14
 FAIL  __tests__/Search-spec.js (1.714s)
Warning: React.createElement: type should not be null or undefined. It should be a string (for DOM elements) or a ReactClass (for composite components).
Warning: Only functions or strings can be mounted as React components.
● Search › it should exists
  - TypeError: /home/urielbertoche/works/dev-shop/src/components/Search/Search.js: /home/urielbertoche/works/dev-shop/src/utils/Link.js: /home/urielbertoche/works/dev-shop/src/actions/AppActions.js: /home/urielbertoche/works/dev-shop/node_modules/superagent/lib/node/index.js: /home/urielbertoche/works/dev-shop/node_modules/superagent/lib/node/part.js: Object object has no method 'hasOwnProperty'
      at /home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/moduleMocker.js:318:23
      at Array.forEach (native)
      at _getMetadata (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/moduleMocker.js:310:27)
      at /home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/moduleMocker.js:321:27
      at Array.forEach (native)
      at _getMetadata (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/moduleMocker.js:310:27)
      at Object.module.exports.getMetadata (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/moduleMocker.js:430:20)
      at Loader._generateMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:282:56)
      at Loader.requireMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:810:43)
      at Loader.requireModuleOrMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:933:17)
      at /home/urielbertoche/works/dev-shop/node_modules/superagent/lib/node/part.js:7:12
      at Object.runContentWithLocalBindings (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/utils.js:482:17)
      at Loader._execModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:245:9)
      at Loader.requireModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:914:12)
      at Loader._generateMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:276:30)
      at Loader.requireMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:810:43)
      at Loader.requireModuleOrMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:933:17)
      at /home/urielbertoche/works/dev-shop/node_modules/superagent/lib/node/index.js:17:12
      at Object.runContentWithLocalBindings (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/utils.js:482:17)
      at Loader._execModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:245:9)
      at Loader.requireModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:914:12)
      at Loader._generateMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:276:30)
      at Loader.requireMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:810:43)
      at Loader.requireModuleOrMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:933:17)
      at /home/urielbertoche/works/dev-shop/src/actions/AppActions.js:11:19
      at Object.runContentWithLocalBindings (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/utils.js:482:17)
      at Loader._execModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:245:9)
      at Loader.requireModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:914:12)
      at Loader._generateMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:276:30)
      at Loader.requireMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:810:43)
      at Loader.requireModuleOrMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:933:17)
      at /home/urielbertoche/works/dev-shop/src/utils/Link.js:15:26
      at Object.runContentWithLocalBindings (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/utils.js:482:17)
      at Loader._execModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:245:9)
      at Loader.requireModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:914:12)
      at Loader._generateMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:276:30)
      at Loader.requireMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:810:43)
      at Loader.requireModuleOrMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:933:17)
      at /home/urielbertoche/works/dev-shop/src/components/Search/Search.js:27:18
      at Object.runContentWithLocalBindings (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/lib/utils.js:482:17)
      at Loader._execModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:245:9)
      at Loader.requireModule (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:914:12)
      at Loader.requireModuleOrMock (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/src/HasteModuleLoader/HasteModuleLoader.js:935:17)
      at Spec.<anonymous> (/home/urielbertoche/works/dev-shop/__tests__/Search-spec.js:15:14)
      at [object Object].jasmine.Block.execute (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/vendor/jasmine/jasmine-1.3.0.js:1065:17)
      at [object Object].jasmine.Queue.next_ (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/vendor/jasmine/jasmine-1.3.0.js:2098:31)
      at [object Object]._onTimeout (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/vendor/jasmine/jasmine-1.3.0.js:2088:18)
      at Timer.listOnTimeout [as ontimeout] (timers.js:121:15)

  - TypeError: Cannot call method 'toUpperCase' of undefined
        at autoGenerateWrapperClass (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactDefaultInjection.js:53:19)
        at Object.getComponentClassForElement (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactNativeComponent.js:59:49)
        at ReactCompositeComponentMixin._processProps (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactCompositeComponent.js:429:44)
        at ReactCompositeComponentMixin.mountComponent (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactCompositeComponent.js:127:28)
        at wrapper [as mountComponent] (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactPerf.js:70:21)
        at Object.ReactReconciler.mountComponent (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactReconciler.js:38:35)
        at mountComponentIntoNode (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactMount.js:248:32)
        at ReactReconcileTransaction.Mixin.perform (/home/urielbertoche/works/dev-shop/node_modules/react/lib/Transaction.js:134:20)
        at batchedMountComponentIntoNode (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactMount.js:269:15)
        at ReactDefaultBatchingStrategyTransaction.Mixin.perform (/home/urielbertoche/works/dev-shop/node_modules/react/lib/Transaction.js:134:20)
        at Object.ReactDefaultBatchingStrategy.batchedUpdates (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactDefaultBatchingStrategy.js:66:19)
        at Object.batchedUpdates (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactUpdates.js:110:20)
        at Object.ReactMount._renderNewRootComponent (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactMount.js:404:18)
        at Object.wrapper [as _renderNewRootComponent] (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactPerf.js:70:21)
        at Object.ReactMount.render (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactMount.js:493:32)
        at Object.wrapper [as render] (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactPerf.js:70:21)
        at Object.ReactTestUtils.renderIntoDocument (/home/urielbertoche/works/dev-shop/node_modules/react/lib/ReactTestUtils.js:52:18)
        at Spec.<anonymous> (/home/urielbertoche/works/dev-shop/__tests__/Search-spec.js:20:28)
        at jasmine.Block.execute (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/vendor/jasmine/jasmine-1.3.0.js:1065:17)
        at jasmine.Queue.next_ (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/vendor/jasmine/jasmine-1.3.0.js:2098:31)
        at null._onTimeout (/home/urielbertoche/works/dev-shop/node_modules/jest-cli/vendor/jasmine/jasmine-1.3.0.js:2088:18)
        at Timer.listOnTimeout [as ontimeout] (timers.js:121:15)
1 test failed, 0 tests passed (1 total)
Run time: 1.892s
npm ERR! Test failed.  See above for more details.
npm ERR! not ok code 0

My Search.js:

/*! React Starter Kit | MIT License | http://ift.tt/1ITr4UN */

import React, { PropTypes } from 'react';
import styles from './Search.less';
import withStyles from '../../decorators/withStyles';
import Link from '../../utils/Link';

@withStyles(styles)
class Search {

  static contextTypes = {
    onSetTitle: PropTypes.func.isRequired
  };

  render() {
    let title = 'Pesquisa de desenvolvedores';
    this.context.onSetTitle(title);
    return (
      <div className="Search">
        <div className="Search-container">
          <a className="Search-brand" href="/" onClick={Link.handleClick}>
            <span className="Search-brandTxt">Dev-Shop</span>
          </a>
          <div className="Search-banner">
            <h1 className="Search-bannerTitle">Loja de desenvolvedores</h1>
          </div>
        </div>
      </div>
    );
  };

}

export default Search;

and my Search-spec.js:

/**
 * Created by urielbertoche on 02/07/15.
 */

jest.dontMock('../src/components/Search');

describe('Search', function() {
  var React = require('react/addons');
  var TestUtils = React.addons.TestUtils;
  var Search;

  beforeEach(function() {
    Search = require('../src/components/Search');
  });

  it('should exists', function() {
    // Render into document
    var search = TestUtils.renderIntoDocument(<Search />);
    expect(TestUtils.isCompositeComponent(search)).toBeTruthy();
  });
});

first off I don't understand the warnings, but since its only a warning I guess that's not the issue. But the TypeError I have really no idea why it's happening. I was using node 0.12, downgraded it, removed my node_modules folder, ran npm install but it didn't change the error messages at all.

Has anyone had this issues before?

Aucun commentaire:

Enregistrer un commentaire