冗談/酵素：.thenと私は小道具として注入します私のreactJSコンポーネントで非同期関数、のためにいくつかの酵素/冗談ユニットテストをやろうとしているネストされた非同期関数

Question

の.catchをテストする方法。

私の問題は、機能の一部のthen()の値をテストし、エラーが発生した場合はcatch()をテストすることです。

これは以下のように私のコンポーネントの機能（<CreateAccount />）がどのように見えるかです：

it('_onSubmit() should throw error if data is missing',() => { 
    const createUserMutation =() => { 
    return Promise.resolve({}) 
    } 
    const wrapper = shallow(<CreateAccount createUserMutation={createUserMutation} />) 
    wrapper.update().find(Form).simulate('submit', { 
    preventDefault:() => {} 
    }) 
    const state = wrapper.instance().state 
    expect(wrapper).toThrow() // <-- How to do it correctly? 
}) 

そして、第二の試験は、チェックする必要があります。データが定義されていないとして、最初のテストは.catch(error => {})をチェックする必要があり

_onSubmit = (event) => { 
    event.preventDefault() 
    const { username, password } = this.state 

    this.props.createUserMutation({ 
    variables: { username, password } 
    }).then(response => { 
    const token = response.data.createUser.token 
    if (token) { 
     Cookies.set('auth-token', token, { expires: 1 }) 
    } 
    }).catch(error => { 
    console.warn(error) 
    }) 
} 

クッキーが正しく設定されているかどうか。ここで私はそれを行う方法を知らない？私はなぜあなたはエラーのためconsole.warnを使用しているCookie

it('_onSubmit() should get token',() => { 
    const createUserMutation =() => { 
    return Promise.resolve({ 
     data: { 
     createUser: { token: 'token' } 
     } 
    }) 
    } 
    const wrapper = shallow(<CreateAccount createUserMutation={createUserMutation} />) 
    wrapper.find(Form).simulate('submit', { 
    preventDefault:() => {} 
    }) 
    // How to check for token value and Cookies? 
}) 

Answer 1

模擬する必要があると思いますか？代わりにconsole.errorを使用してください。あなたはそれをテストするためにもスパイにそれをモックする必要があります。

まずテスト：

it('_onSubmit() should throw error if data is missing', (done) => { 
    const createUserMutation =() => new Promise(); 
    const wrapper = shallow(<CreateAccount createUserMutation={createUserMutation} />) 
    wrapper.update().find(Form).simulate('submit', { 
    preventDefault:() => {} 
    }) 

    const state = wrapper.instance().state 

    createUserMutation.resolve().then(() => { 
    expect(console.warn).toHaveBeenCalled(); 
    done(); 
    }); 
}) 

あなたはモックブラウザ環境ではなく、実際のブラウザでこれを実行している場合、あなたはCookies.setをモック必要があります。

第二テスト：私はスパイが、その後のキャッチに働いていたかどうかを確認したいとき、私は通常、何をすべきか

it('_onSubmit() should get token', (done) => { 
    const createUserMutation =() => new Promise(); 
    const wrapper = shallow(<CreateAccount createUserMutation={createUserMutation} />) 

    wrapper.find(Form).simulate('submit', { 
    preventDefault:() => {} 
    }); 

    jest.spyOn(window.Cookies, 'set'); 

    const response = { 
     data: { 
     createUser: { token: 'token' } 
     } 
    } 

    createUserMutation.resolve(response).then(() => { 
    expect(window.Cookies.set).toHaveBeenCalled(); 
    done(); 
    }); 
}) 

afterEach(() => { 
    // Reset the spies so that they don't leak to other tests 
    jest.restoreAllMocks(); 
}); 

Answer 2

、テストに（）その後、別のものを追加することです。たとえば：

it('_onSubmit() should throw error if data is missing',() => { 
    const createUserMutation = jest.fn(() => Promise.reject(new Error())); 
    const spy = jest.spyOn(console,"warn"); 
    const wrapper = shallow(<CreateAccount createUserMutation={createUserMutation} />) 
    wrapper.update().find(Form).simulate('submit', { 
    preventDefault:() => {} 
    }); 
    return createUserMutation.catch(() => { 
    expect(wrapper).toMatchSnapshot(); 
}) 
.then(() => { 
    expect(spy).toHaveBeenCalledTimes(1); 
}); 
}) 

私は、それが何らかの形で内部的に、NodeJSはキュー、約束、ダニなどを処理する方法に関連していると思います。

拒否/キャッチブランチです。あなたはIFパスをテストしたい場合は、単にPromise.resolveを使用して、代わりにキャッチの）（promise.thenを返します。