2017-09-25 24 views
0

林:获取使用此设置为我的应用程序处理的承诺

  • ReactJS
  • KarmaJS
  • Instanbul

在这一点上,我不断收到此错误: Object is not a constructor (evaluating '(0, _whatwgFetch2['default'])')

在检查网页时,它一直告诉我导入whatwg-fetch,这是我的实际上已经这样做了,我有点失去了去哪里。

我的方法执行调用:

import fetch from 'whatwg-fetch'; 

export function authenticateUser(username, password) { 

    return function (dispatch, getState) { 
    dispatch({type: 'LOGIN'}); 

    return fetch(getState().config.components.Authentication.login_endpoint, { 
     method: 'POST', 
     headers: { 
     'Content-Type': 'application/json' 
     }, 
     credentials: 'same-origin', 
     body: JSON.stringify({ 
     username: username, 
     password: password, 
     }) 
    }).then(resp => { 
     if (resp.status === 302) { 
     window.location = resp.url; 
     } else if (resp.status >= 300 && resp.status < 500) { 
     return Promise.resolve(resp); 
     } else { 
     return Promise.reject(resp.statusText); 
     } 
    }).then(resp => resp.json()) 
     .then(resp => { 
     const error = data.errors[0]; 
     dispatch({ type: 'LOGIN_FAILED', payload: error.detail }); 
    }).catch(error => { 
     console.error(error); // I know, still needs to be catched 
    }); 
    }; 
} 

我的测试用例:

import { expect } from 'chai'; 
import configureMockStore from 'redux-mock-store'; 
import thunk from 'redux-thunk'; 
import sinon from 'sinon'; 
import { authenticateUser } from '../../src/actions/index'; 

const initialConfig = { 
    authentication: { 
    loginform_loading: false, 
    loginform_errorMessage: null, 
    forgotpassword_loading: false, 
    forgotpassword_errorMessage: null, 
    forgotpassword_passwordSent: false 
    }, 
    config: { 
    components: { 
     Authentication: { 
     'login_endpoint': '/api/auth/login', 
     'forgotpassword_enabled': true, 
     'forgotpassword_path': '/auth/forgot-password', 
     'forgotpassword_endpoint': '/auth/forgot-password' 
     } 
    } 
    } 
}; 

const middlewares = [ thunk ]; 
const mockStore = configureMockStore(middlewares); 
let store; 

describe('Action/Index/authenticateUser',() => { 

    const testUsername = 'User'; 
    const testPassword = 'Test123'; 
    let sandbox; 

    beforeEach(function() { 
    sandbox = sinon.sandbox.create(); 
    store = mockStore(initialConfig); 
    }); 

    afterEach(function() { 
    sandbox.restore(); 
    }); 

    it('LOGIN is dispatched',() => { 
    var response = mockResponse(400, 'Found', '{"errors": [{ "message": "first" }] }'); 
    sandbox.stub(window, 'fetch') 
     .resolves(response); 

    return store.dispatch(authenticateUser(testUsername, testPassword)) 
     .then(() => { 
     var expectedActions = store.getActions(); 
     expect(expectedActions).to.not.be.empty; 

     var action = expectedActions[0]; 
     expect(action.type).to.equal('LOGIN'); 
     }); 
    }); 
}); 

希望有人可以帮助我什么是错的。也许还就如何改善无极错误处理本身

感谢, 皮姆

+3

试图改变自己的进口线只是'进口“WHATWG-fetch'' – Panther

+0

这是它!在之前的工作上做了些什么改变? – Dirkos

回答

0

豹介绍了这一个正确的答案。

import 'whatwg-fetch'的伎俩

相关问题