2016-10-19 2 views
0

내 질문 제목 충분히 이해되기를 바랍니다. 나는 그것을 실제로 표현하는 더 좋은 방법을 생각할 수 없었고, 문자 수 제한으로 인해 내 공을 파멸 시켰습니다.반환 된 JSON 가져 오기 요청에서 테스트 및 dev에 다릅니다

내가 겪고있는 문제는 반응 - 라우터 - 리 덕스 (React-Router-Redex) 및 리덕스 - 레프트 - 래퍼 (Replx-auth-wrapper)와 같은 패키지를 사용하는 프로젝트에서 발생합니다.

테스트를 위해 저는 Enzyme, Sinon 및 Chai와 함께 카르마 테스트 러너를 사용하고 있습니다. 테스트 내에서 나는 사용하고있는 API에 대한 모든 요청을 모의하기 위해 fetchMock을 사용하고있다. Webpack을 사용하여 모든 것을 번들로 제공합니다.

내가 직면 한 문제는 내가 작성한 코드 (수정 된 this 시작 템플릿보다 다소 엄격함)가 작동하지만, 내가 작성한 코드가 올바른 결과를 산출하지 못한다는 것입니다. 이상하게 작동하는 비트는 인증 API에서 토큰을 가져 오는 작업을 전달할 때입니다. 내가 파견하고있어

돌아 오는 동작은 다음 중 하나입니다 :

export function fetchToken(data) { 
    return function(dispatch) { 
    dispatch(requestTokenCreate(data)) 

    // Let's fetch this user a token, shall we? 
    var headers = new Headers() 
    headers.append("Content-Type", "application/json") 
    headers.append("Accept", "application/json") 

    let requestParams = { 
     method: 'POST', 
     headers: headers, 
     mode: 'cors', 
     cache: 'default', 
     body: JSON.stringify({ 
     subdomain: data.subdomain, 
     login: data.username, 
     password: data.password 
     }) 
    } 
    data = { 
     subdomain: data.subdomain, 
     username: data.username 
    } 
    var serverUrl = (__DEV__ || __TEST__) ? "http://subdomain.easyposonline.dev:3000/api/v1" : "https://subdomain.easyposonline.nl/api/v1" 
    serverUrl = serverUrl.replace("subdomain", data.subdomain) 
    return fetch(serverUrl + "/auth_tokens/create", requestParams) 
     .then(response => response.json()) 
     .then(json => { 
     return dispatch(receiveTokenCreate(json, data)) 
     } 
    ) 
    } 
} 

내 질문에 관련된 비트는 이것이다 :

return fetch(serverUrl + "/auth_tokens/create", requestParams) 
    .then(response => response.json()) 
    .then(json => { 
     return dispatch(receiveTokenCreate(json, data)) 
    } 
) 

내 개발 코드에서이 작업을 파견, 그것은 잘 작동합니다!

액션이 문제의 시험에서 전달되는
{success: true, token: "a3PC6y6nx1f63o2b13YWz7LYUHdidYui"} 

는하지만, 난 다시 다음과 같은 응답 얻을 :

{type: 'RECEIVE_USER_TOKEN_CREATE', json: Object{success: true, token: 'qicXyn6BhYhyoBuA_SFoZtTDN'}, payload: Object{subdomain: 'test-teun', username: '[email protected]', token: 'qicXyn6BhYhyoBuA_SFoZtTDN'}} 

을 그래서 대신에 적절한 응답을 반환 코드 이것은 다음과 같은 응답을 반환 Redux 액션 전체를 반환합니다.

{type: 'RECEIVE_USER_TOKEN_CREATE', response: Object{type: 'RECEIVE_USER_TOKEN_CREATE', json: Object{success: ..., token: ...}, payload: Object{subdomain: ..., username: ..., token: ...}}, payload: Object{subdomain: 'test-teun', username: '[email protected]'}} 

여기 손실에 있어요 : 나는 코드의 재귀의 비트와 함께 결국 때문에 내가 테스트 해요 내 테스트 실패로 이어집니다. 아마도 나는 무언가 놀랍도록 단순한 것을 간과 할 것이지만, 지금 이것을 몇 시간 동안보고 있었고, 내 마음을 잃어 가기 시작했습니다!

내가 쓴 테스트 파일 다음, 어쩌면 내가 테스트 길을 잘못 설정 해요 :

import configureMockStore from 'redux-mock-store' 
import thunk from 'redux-thunk' 
// import nock from 'nock' 
import 'isomorphic-fetch' 
import fetchMock from 'fetch-mock' 

import SignInView from 'routes/SignIn' 
import * as constants from 'constants' 
import { fetchToken, destroyToken } from 'actions/user' 
import _ from 'underscore' 

describe('(Route) SignIn',() => { 
    let _route = SignInView({}) 

    // Auth token request 
    const authTokenCreateSuccessfulRequest = { 
    subdomain: 'test-teun', 
    username: '[email protected]', 
    password: 'psv4teun' 
    } 
    const authTokenCreateFailedRequest = { 
    subdomain: 'test-teun', 
    username: '[email protected]', 
    password: 'teun4psv' 
    } 
    const authTokenCreateSuccessfulResponse = { 
    type: constants.RECEIVE_USER_TOKEN_CREATE, 
    json: { 
     success: true, 
     token: 'qicXyn6BhYhyoBuA_SFoZtTDN' 
    }, 
    payload: { 
     subdomain: 'test-teun', 
     username: '[email protected]', 
     token: 'qicXyn6BhYhyoBuA_SFoZtTDN' 
    } 
    } 
    const authTokenCreateFailedResponse = { 
    type: constants.RECEIVE_USER_TOKEN_CREATE, 
    json: { 
     success: false, 
     reason: "Ongeldige gebruikersnaam of wachtwoord!" 
    }, 
    payload: { 
     subdomain: 'test-teun', 
     username: '[email protected]' 
    } 
    } 

    beforeEach(() => { 
    fetchMock.mock('http://test-teun.easyposonline.dev:3000/api/v1/auth_tokens/create', authTokenCreateSuccessfulResponse) 
    }) 

    afterEach(() => { 
    fetchMock.restore() 
    }) 

    it('Should return a route configuration object',() => { 
    expect(typeof _route).to.equal('object') 
    }) 

    it('Should define a route component',() => { 
    expect(_route.path).to.equal('sign_in') 
    }) 

    const middlewares = [ thunk ] 
    const mockStore = configureMockStore(middlewares) 

    it('Should trigger RECEIVE_USER_TOKEN_CREATE action containing a token on a successful login attempt',() => { 
    //fetchMock.mock('http://test-teun.easyposonline.dev:3000/api/v1/auth_tokens/create', authTokenCreateSuccessfulResponse) 
    const expectedActions = [ 
     { 
     type: constants.REQUEST_USER_TOKEN_CREATE, 
     payload: authTokenCreateSuccessfulRequest 
     }, 
     authTokenCreateSuccessfulResponse 
    ] 
    const store = mockStore({ user: { isFetching: false } }) 

    return store.dispatch(fetchToken(authTokenCreateSuccessfulRequest)) 
     .then((data) => { 
     console.log(store.getActions()[1]) 
     // console.log(expectedActions[1]) 
     expect(_.isEqual(store.getActions(), expectedActions)).to.equal(true) 
     }) 
    }) 
}) 

내가주의 수있는 또 다른 것은 어제 작업이 테스트를했다하지만 난 구조를 수정 한 것입니다 그 이후로 내 Redux 상태에 빠졌고, 길을 따라 무언가를 망가 뜨린 것처럼 보입니다. (내 Git 역사를 되돌아 보면이 성가신 일로 나를 도왔습니다.

누군가가 올바른 방향으로 나를 가리킬 수 있기를 바랍니다. , 그것은 정말로 나와 내 마음의 평화를 도울 것입니다. 미리 감사드립니다.

+0

한숨해야한다. 'fetchMock.mock ('http://test-teun.easyposonline.dev:3000/api/v1/auth_tokens/create', authTokenCreateSuccessfulResponse)'은 fetchMock.mock ('http : //test-teun.easyposonline. dev : 3000/api/v1/auth_tokens/create ', authTokenCreateSuccessfulResponse.payload)' –

답변

0

한숨 ... 나는 나의 벙어리 오류를 발견했다. fetchMock.mock('http://test-teun.easyposonline.dev:3000/api/‌​v1/auth_tokens/creat‌​e', authTokenCreateSuccessfulResponse) 나는 나의 바보 같은 오류를 발견 ... fetchMock.mock('http://test-teun.easyposonline.dev:3000/api/‌​v1/auth_tokens/creat‌​e', authTokenCreateSuccessfulResponse.payload)