Question

我在mocha中进行了单元测试，以确定有效的反应组件：

var should = require('should');

require('./testdom')('<html><body></body></html>');

describe('update-button', function () {
  var queryA = {some object};
  var queryB = {some slightly different object};
  var reportA = {currentQuery: JSON.stringify(queryA)};
  var reportB = {currentQuery: JSON.stringify(queryB)};
  var React = require('react/addons');
  var TestUtils = React.addons.TestUtils;
  var UpdateButtons = require('../client/src/js/components/UpdateButtons');

  it('returns apply button', function() {

    var updateButton = TestUtils.renderIntoDocument(
      <UpdateButtons
        query={queryA}
        defaultQuery={JSON.stringify(queryB)}
        report={reportB} />
    );


    var update = TestUtils.findRenderedDOMComponentWithClass(updateButton, 'update');
    should.exist(update.getDOMNode().children);
    update.props.children.should.equal('Apply');

  });

  it('returns default button', function() {
    var updateButton = TestUtils.renderIntoDocument(
      <UpdateButtons
        query={queryB}
        defaultQuery={JSON.stringify(queryA)}
        report={reportB} />
    );

    var update = TestUtils.findRenderedDOMComponentWithClass(updateButton, 'setdefault');
    should.exist(update.getDOMNode().children);
    update.props.children.should.equal('Make Default');
  });

});

Mocha处理得很好，两个测试通过了。

然后我又进行了另一项测试，我只是更改了组件的名称并添加了稍微不同的功能：

var should = require('should');

require('./testdom')('<html><body></body></html>');
var React = require('react/addons');
var TestUtils = React.addons.TestUtils;
var AllocationChart = require('../client/src/js/components/AllocationChart');

function emptyFunction() {
  return "fired";
}

describe('allocation-chart', function () {
  var values = [{"x":0,"y":0.0007445807134429661,"pvalue":0.23962495642627535},{"x":1,"y":0.0017470479717729415,"pvalue":0.06222155778588356},{"x":2,"y":0.001213604360619125,"pvalue":0.3751442982987042},{"x":3,"y":-0.0007938410728732803,"pvalue":0.6306601384568038},{"x":4,"y":-0.0013313112686847983,"pvalue":0.4930399112767866},{"x":5,"y":-0.0002447714978416893,"pvalue":0.906972528582401},{"x":6,"y":0.0008058818608920326,"pvalue":0.6581667787665311}];
  var valueExtent = [-0.5, 0.5];

  it('is created', function() {

    var sparkline = TestUtils.renderIntoDocument(
      <AllocationChart
        key={1}
        highlightbar={emptyFunction}
        newHighlightbar={emptyFunction}
        values={values}
        valueExtent={valueExtent}
        highlightRow={emptyFunction}
        deHighlightRow={emptyFunction} />
    );

    var chart = TestUtils.scryRenderedDOMComponentsWithClass(sparkline, 'allocationChart');
    chart.length.should.equal(1);
    should.exist(chart.getDOMNode());

    var sparklineBins = TestUtils.scryRenderedDOMComponentsWithClass(sparkline, 'sparklineBin');
    sparklineBins.length.should.equal(7);

  });

  it('fires a hover event', function() {
    var sparkline = TestUtils.renderIntoDocument(
      <AllocationChart
        key={1}
        highlightbar={emptyFunction}
        newHighlightbar={emptyFunction}
        values={values}
        valueExtent={valueExtent}
        highlightRow={emptyFunction}
        deHighlightRow={emptyFunction} />
    );

    var sparklineBins = TestUtils.scryRenderedDOMComponentsWithClass(sparkline, 'sparklineBin');

    var responseA = TestUtils.Simulate.mouseover(sparklineBins[0]);
    var responseB = TestUtils.Simulate.mouseout(sparklineBins[0]);

    responseA.should.equal("fired");
    responseB.should.equal("fired");

  });

但不是工作，而是返回以下错误：

      <AllocationChart
      ^
Warning: Unexpected token < Use --force to continue.

Aborted due to warnings.

我不知道如何或为何或如何发生这种情况。

Answer 1

以利亚identified the problem。这是一个解决方案：

将compiler.js移出测试目录，以便Mocha不会将其作为测试文件加载。
在测试目录中创建一个mocha.opts文件。它应该包含：

--compilers .:compiler.js

传递给--compilers的模块路径是相对于Mocha运行的目录。顺便说一下，hammerlab.org清楚地表明要使用--compilers加载编译器。 mocha.opts的使用避免了每次都必须将参数传递给RequireJS。

Answer 2

如hammerlab.org所述编译JSX的方法将compiler.js（通过ReactTools.transform处理JSX转换）放在测试文件夹中以及其他测试。如果React测试在compiler.js之前按字母顺序排列，那么您将收到此错误，因为它在进行该测试时尚未注册。

不一致的意外令牌：＆lt;

2 个答案: