Last week, I finally gave a try to Mock Service Worker on a side project and I must say that I was really glad I did. So, for those who haven’t hear about it yet,
Mock Service Worker (MSW for friends) is a tool that makes it a breeze to intercept requests and provide mock data for testing, without having to change the target URL of the requests; thus it is an API mocking library/tool. The way it works is (as hinted by the name) that it registers a service worker, intercepting requests and replying with test data. This is an interesting idea because it requires less jumping through hoops to provide test data. In the past, for instance with the
Stark project, I’ve used
json-server, which is also a nice API mocking solution, but is a tad mode complicated to integrate. For one, json-server usually requires running a separate server and using different request URLs (even though there are alternatives to that). I’ve read a few articles about it in the past, particularly
one by Tim Deschryver, explaining how to integrate MSW into an Angular application and thus I really wanted to try it out for myself. The opportunity appeared so I jumped on it. Fortunately, Tim has contributed
some examples to the MSW repository, so the steps to integrate MSW in an Angular application are really straightforward now (note that there are also samples for other stacks like React, Storybook, GraphQL/Apollo, etc). Basically, you just need to:
