2017-09-25 23 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'的伎倆

相關問題