3

簡単な冗談のテストを機能させるのに苦労しています。Jest は、私の Ajax 呼び出しが発生していないと主張し、次のエラー メッセージを表示します。

FAIL  authTest.js (1.828s)
● Authentication: Logging In › it Doesn't currently have a logged in user
  - Expected Function to be called with { url : 'api/loggedin', type : 'GET', error :       <jasmine.any(function Function() { [native code] })>, success : <jasmine.any(function Function() { [native code] })> }.
    at Spec.<anonymous> (/Users/ritmatter/reps/spec/authTest.js:13:20)
    at Timer.listOnTimeout [as ontimeout] (timers.js:110:15)

テストされるコードは auth.jsx というファイルにあり、次のようになります。

loggedIn: function() {
  return $.ajax({
    url: 'api/loggedin',
    type: 'GET',
    error: function(xhr, status, err) {
      return false;
    }.bind(this),
    success: function(data) {
      return true;
    }.bind(this),
  });
},

テストは次のようになります。

/** @jsx React.DOM */
"use strict";
var React = require('react/addons');
var TestUtils = React.addons.TestUtils;

describe('Authentication: Logging In', function() {
  it('Doesn\'t currently have a logged in user', function () {
    var $ = require('jquery');
    jest.dontMock('../js/auth.jsx');
    var auth = require('../js/auth.jsx');
    auth.loggedIn();
    expect($.ajax).toBeCalledWith({
      url: 'api/loggedin',
      type: 'GET',
      error: jasmine.any(Function),
      success: jasmine.any(Function)
    });
  });
});

これが呼び出されていないと冗談が思う理由はありますか?調べてみると、dontMock() と mock() に関していくつかのバグがあるようです。

4

2 に答える 2

1

Wagner が述べたように、テストの外で jquery をグローバルに要求する必要があります。コンポーネントは $ のグローバル バージョンを使用しているため、var $ = require('jquery')jquery をグローバル変数 $ に追加するという点では、追加しても何も起こりません。

また、ajax 呼び出しをモックしませんでした。

反応をテストするときは、単に $ を再定義することで、jquery の読み込みに関する問題を回避します。

window.$ = {ajax: jest.genMockFunction()}

したがって、ajax 呼び出し以外で jquery を必要としない限り、この 1 行で jquery ルートをシミュレートし、ajax 呼び出しをモックします。

于 2015-12-18T15:22:34.003 に答える
0

初期化時に ajax を呼び出す React コンポーネントでも同様の問題がありました。私が見つけたのは、メソッドの外で必要な場合expectにのみ機能するということです。$jqueryit

私のReactコンポーネントとテストケースは次のようなものです(ES6ですが、アイデアを得ることができます)

import React from 'react'
import $ from 'jquery'

export default class MyComponent extends React.Component {

  constructor(props) {
    super(props);
    this.state = {things:[]};
  }

  componentWillMount() {
    $.ajax({
      url: 'http://localhost:3000/things',
      success: (result) => this.setState(result),
      error: (ex) => console.log(ex)
    })
  }

  render() {
    //stuff
  }
}

そしてテスト

jest.dontMock('../components/MyComponent')

import React from 'react'
import TestUtils from 'react-addons-test-utils'
import $ from 'jquery'

const Wall = require('../components/MyComponent');

describe('MyComponent', () => {

  it('calls the things end point', () => {
    const myComp = TestUtils.renderIntoDocument(<MyComponent />)

    expect($.ajax).toBeCalledWith({
      url: 'http://localhost:3000/things',
      success: jasmine.any(Function),
      error: jasmine.any(Function)
    })
  });
});
于 2015-10-30T11:43:06.247 に答える