Test the register() method 

Before writing the test code, let's talk about the behavior of the registrationService.register() method so that we can decide what to test. Essentially, this method will send an HTTP POST request to the backend and then hand the result back to its caller. The dependency of this method is axios, which needs to be mocked so that we can isolate the register() method and test its logic without being affected by the dependency.

Let's install axios and moxios, which mocks axios requests, with the following commands:

npm install axios --save 
npm install moxios --save-dev

Once it is done, let's create frontend/test/unit/services.registration.spec.js, which looks like the following:

1.  import moxios from 'moxios'
2. import registrationService from '@/services/registration'
3.
4. describe('services/registration', () => {
5. beforeEach(() => {
6. moxios.install()
7. })
8.
9. afterEach(() => {
10. moxios.uninstall()
11. })
12.
13. it('should pass the response to caller when request succeeded',
()=>{
14. expect.assertions(2)
15. moxios.wait(() => {
16. let request = moxios.requests.mostRecent()
17. expect(request).toBeTruthy()
18. request.respondWith({
19. status: 200,
20. response: {result: 'success'}
21. })
22. })
23. return registrationService.register().then(data => {
24. expect(data.result).toEqual('success')
25. })
26. })
27.})

As you can see, in line 1 to line 2, we import moxios and registrationService. From line 4 to line 11, we call moxios.install() to create the mock for each test and use moxios.uninstall() to destroy it afterward.

In the test method, we verify that the service will return the server's response to its caller. In line 14, we use Jest's API, expect.assertions(), to make sure the exact number of assertions should be made, which is useful when the method that we're testing against returns a promise.

From line 15 to line 22, the moxios.wait() method is to wait for the request to be made before proceeding. Its implementation is based on setTimeout(). When the waiting is over, as you can see in line 16, we get the most recent request and verify its existence by using the Jest's toBeTruthy() API. This is to ensure that an axios request has actually been issued. After that, we specify the response of the request using the respondWith() moxios method. In this way, we can be sure that the register() method will get a success response. 

In line 23, we invoke the register() method and then do a verification to make sure the value of the result property returned by the register() method is success. Since we're using promises here, we need to return a promise as the result of the test method itself so that Jest can wait for it to resolve. When the promise is rejected, the test will automatically fail. 

The Promise.prototype.then(onFulfilled[, onRejected]) method also returns a promise. And that's why you can chain other then() methods or catch() methods after it.

Now, let's create a test for the scenario in which the HTTP request fails. Here is how it looks:

it('should propagate the error to caller when request failed', () => {
expect.assertions(2)
moxios.wait(() => {
let request = moxios.requests.mostRecent()
expect(request).toBeTruthy()
request.reject({
status: 400,
response: {message: 'Bad request'}
})
})
return registrationService.register().catch(error => {
expect(error.response.message).toEqual('Bad request')
})
})

As you can see, this test is very similar to the previous one, except that instead of using respondWith(), we use the request.reject() moxios API to send a failed response, and we chain the register() method with a catch(onRejected) method. Inside of this  onRejected handler, we make an assertion of the error response to make sure the error propagates to the caller. 

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.138.204.186