2017-03-06 16 views
7

Để nhận được mức độ phù hợp 100% của các tệp Saga của tôi, tôi đang tìm cách kiểm tra người xem.Điểm kiểm tra đơn vị bộ theo dõi redux-saga là gì?

Tôi đã googling xung quanh, có một số câu trả lời như thế nào để kiểm tra người xem. Đó là, saga làm điều đó takeEvery hoặc takeLatest.

Tuy nhiên, tất cả các phương pháp thử nghiệm dường như về cơ bản sao chép triển khai. Vì vậy, điểm của việc viết một bài kiểm tra nếu nó là như nhau?

Ví dụ:

// saga.js 

import { delay } from 'redux-saga' 
import { takeEvery, call, put } from 'redux-saga/effects' 
import { FETCH_RESULTS, FETCH_COMPLETE } from './actions' 

import mockResults from './tests/results.mock' 

export function* fetchResults() { 
    yield call(delay, 1000) 
    yield put({ type: FETCH_COMPLETE, mockResults }) 
} 

export function* watchFetchResults() { 
    yield takeEvery(FETCH_RESULTS, fetchResults) 
} 

phương pháp thử nghiệm 1:

import { takeEvery } from 'redux-saga/effects' 
import { watchFetchResults, fetchResults } from '../sagas' 
import { FETCH_RESULTS } from '../actions' 

describe('watchFetchResults()',() => { 
    const gen = watchFetchResults() 
    // exactly the same as implementation 
    const expected = takeEvery(FETCH_RESULTS, fetchResults) 
    const actual = gen.next().value 

    it('Should fire on FETCH_RESULTS',() => { 
     expect(actual).toEqual(expected) 
    }) 
    }) 

phương pháp thử nghiệm 2: với một helper, như Redux Saga Test Plan
Đó là một cách khác nhau của văn bản, nhưng một lần nữa chúng ta làm cơ bản giống nhau khi triển khai.

import testSaga from 'redux-saga-test-plan' 
import { watchFetchResults, fetchResults } from '../sagas' 
import { FETCH_RESULTS } from '../actions' 

it('fire on FETCH_RESULTS',() => { 
    testSaga(watchFetchResults) 
    .next() 
    .takeEvery(FETCH_RESULTS, fetchResults) 
    .finish() 
    .isDone() 
}) 

Thay vào đó, tôi chỉ muốn biết nếu watchFestchResults nhận mọi FETCH_RESULTS. Hoặc thậm chí chỉ khi nó bắn takeEvery(). Không có vấn đề làm thế nào nó theo dõi.

Hoặc đây thực sự là cách để làm điều đó?

+0

Yeah, tôi đang bối rối bởi điều này, quá. Các thử nghiệm mẫu là tất cả so sánh kết quả với người tạo hiệu ứng saga. Đó không phải là điều tôi quan tâm. Tôi quan tâm đến việc liệu họ có đặt cửa hàng ở trạng thái đúng hay không. Thử nghiệm bởi các ví dụ có vẻ rất giòn và không chứng minh bất cứ điều gì. –

Trả lời

4

Có vẻ như điểm kiểm tra chúng là đạt được phạm vi kiểm tra 100%.

Có một số điều bạn có thể kiểm tra đơn vị, nhưng điều đó là vấn đề nếu bạn cần.

Dường như với tôi rằng tình huống này có thể là một ứng viên tốt hơn cho thử nghiệm 'tích hợp'. Một cái gì đó mà không kiểm tra chỉ đơn giản là một phương pháp duy nhất, nhưng làm thế nào một số phương pháp làm việc với nhau như một toàn thể. Có lẽ bạn có thể gọi một hành động kích hoạt một bộ giảm tốc sử dụng câu chuyện của bạn, sau đó kiểm tra cửa hàng để biết thay đổi kết quả? Điều này sẽ có ý nghĩa hơn nhiều so với thử nghiệm saga một mình.

2

Tôi đồng ý với John Meyer answer rằng điều này phù hợp hơn cho thử nghiệm tích hợp hơn cho thử nghiệm đơn vị. Điều này issue là phổ biến nhất trong GitHub dựa trên phiếu bầu. Tôi sẽ khuyên bạn nên đọc nó.

Một trong những gợi ý là sử dụng gói redux-saga-tester được tạo bởi trình mở của sự cố. Nó giúp tạo trạng thái ban đầu, bắt đầu các trình trợ giúp saga (takeEvery, takeLatest), gửi các hành động mà saga đang lắng nghe, quan sát trạng thái, truy xuất lịch sử các hành động và lắng nghe các hành động cụ thể xảy ra.

Tôi đang sử dụng nó với axios-mock-adapter, nhưng có một số ví dụ trong codebase sử dụng nock.

Saga

import { takeLatest, call, put } from 'redux-saga/effects'; 
import { actions, types } from 'modules/review/reducer'; 
import * as api from 'api'; 

export function* requestReviews({ locale }) { 
    const uri = `/reviews?filter[where][locale]=${locale}`; 
    const response = yield call(api.get, uri); 
    yield put(actions.receiveReviews(locale, response.data[0].services)); 
} 

// Saga Helper 
export default function* watchRequestReviews() { 
    yield takeLatest(types.REVIEWS_REQUEST, requestReviews); 
} 

thử ví dụ sử dụng jest

import { takeLatest } from 'redux-saga/effects'; 
import { types } from 'modules/review/reducer'; 
import SagaTester from 'redux-saga-tester'; 
import MockAdapter from 'axios-mock-adapter'; 
import axios from 'axios'; 

import watchRequestReviews, { requestReviews } from '../reviews'; 

const mockAxios = new MockAdapter(axios); 

describe('(Saga) Reviews',() => { 
    afterEach(() => { 
    mockAxios.reset(); 
    }); 

    it('should received reviews', async() => { 
    const services = [ 
     { 
     title: 'Title', 
     description: 'Description', 
     }, 
    ]; 
    const responseData = [{ 
     id: '595bdb2204b1aa3a7b737165', 
     services, 
    }]; 

    mockAxios.onGet('/api/reviews?filter[where][locale]=en').reply(200, responseData); 

    // Start up the saga tester 
    const sagaTester = new SagaTester({ initialState: { reviews: [] } }); 

    sagaTester.start(watchRequestReviews); 

    // Dispatch the event to start the saga 
    sagaTester.dispatch({ type: types.REVIEWS_REQUEST, locale: 'en' }); 

    // Hook into the success action 
    await sagaTester.waitFor(types.REVIEWS_RECEIVE); 

    expect(sagaTester.getLatestCalledAction()).toEqual({ 
     type: types.REVIEWS_RECEIVE, 
     payload: { en: services }, 
    }); 
    }); 
});