Live data from Hacker News

MSW 2.0 – Mock Service Worker

mswjs.io

31–40 of 61 posts

Re: MSW 2.0 – Mock Service Worker

#31
post #21

At my job we've found working with MSW + OpenAPI to be near miraculous. I work on a web frontend and do most of my development against a mock API powered by MSW. This live preview runs against the mock API running fully in-browser. https://oxide-console-preview.vercel.app More details: https://github.com/oxidecomputer/oxide.ts https://github.com/oxidecomputer/console https://oxide.computer/podcasts/oxide-and-friends/…

Is it ok if I see I am logged in as as Hannah and can launch new instances after clicking the first link?

It's all mocked, so you're not really Hannah, and you're not really launching instances. Their console is open source, and when you run it in dev mode locally this is also what you see.

Re: MSW 2.0 – Mock Service Worker

#33

What is the benefit of using MSW over mocking a service with a small express server?

You can generate TS from an OpenAPI spec and then create type-safe mocks of network calls.

Basic mocks and fake servers run the risk of falling out of sync and giving false positives, or just being outright wrong to short-cut some of the work. It's also less code to maintain when a service worker can intercept the call, instead of orchestrating a load of mock APIs.

It won't stop you making breaking changes on the API but it will keep you honest on consuming the API on the client.

Re: MSW 2.0 – Mock Service Worker

#34

Earlier quoted context omitted.

Is it ok if I see I am logged in as as Hannah and can launch new instances after clicking the first link?

It's all mocked, so you're not really Hannah, and you're not really launching instances. Their console is open source, and when you run it in dev mode locally this is also what you see.

Just when I think I get the whacky web kids, hell, that maybe I've even one of them, an article like this and functionality like this comes along.

I don't know how a mock library enables a revolution of having test data.

I don't know why the library couldn't change it's favorite method signature because a subset of versions of one JS framework couldn't...fetch?

or why the mock library can only have one dependency...

...and I feel _really_ out of the loop because I can't understand the tone, hinting at years of sweat and though that I'm more used to from a consumer product launch.

But that's why I respect the web more than ever. The reaction is real, and it means something, even if I don't understand it. People put _years_ into making (gestures) this work, so millions of developers can benefits, so billions, hell, _humanity_ can benefit. All in the open.

Shine on, you crazy diamonds. https://www.youtube.com/watch?v=54W8kktFE_o

Re: MSW 2.0 – Mock Service Worker

#35
post #21

At my job we've found working with MSW + OpenAPI to be near miraculous. I work on a web frontend and do most of my development against a mock API powered by MSW. This live preview runs against the mock API running fully in-browser. https://oxide-console-preview.vercel.app More details: https://github.com/oxidecomputer/oxide.ts https://github.com/oxidecomputer/console https://oxide.computer/podcasts/oxide-and-friends/…

Amazing. At Step CI we’re currently working on a tool that will do the conversion automatically (OpenAPI > MSW)

Feel free to email me at mish@stepci.com if you want to hear more!

Re: MSW 2.0 – Mock Service Worker

#36

Earlier quoted context omitted.

Is it ok if I see I am logged in as as Hannah and can launch new instances after clicking the first link?

It's all mocked, so you're not really Hannah, and you're not really launching instances. Their console is open source, and when you run it in dev mode locally this is also what you see.

Also, worth pointing out that Hannah Arendt (the name that shows up as the logged in user) is a famous historian and philosopher (https://en.wikipedia.org/wiki/Hannah_Arendt)

Re: MSW 2.0 – Mock Service Worker

#37

Earlier quoted context omitted.

It's all mocked, so you're not really Hannah, and you're not really launching instances. Their console is open source, and when you run it in dev mode locally this is also what you see.

Just when I think I get the whacky web kids, hell, that maybe I've even one of them, an article like this and functionality like this comes along. I don't know how a mock library enables a revolution of having test data. I don't know why the library couldn't change it's favorite method signature because a subset of versions of one JS framework couldn't...fetch? or why the mock library can only have one dependency...…

> I don't know how a mock library enables a revolution of having test data.

From my understanding this isn’t (just) mock data, it’s an entire mock backend that runs inside the browser. To be able to simulate that with zero dependencies outside the browser does simplify a lot of testing scenarios.

Re: MSW 2.0 – Mock Service Worker

#38
post #35
post #21

At my job we've found working with MSW + OpenAPI to be near miraculous. I work on a web frontend and do most of my development against a mock API powered by MSW. This live preview runs against the mock API running fully in-browser. https://oxide-console-preview.vercel.app More details: https://github.com/oxidecomputer/oxide.ts https://github.com/oxidecomputer/console https://oxide.computer/podcasts/oxide-and-friends/…

Amazing. At Step CI we’re currently working on a tool that will do the conversion automatically (OpenAPI > MSW) Feel free to email me at mish@stepci.com if you want to hear more!

We more or less did that too. We generate typed wrappers for every handler, and then we manually implement the internal logic for each endpoint. I doubt reliably generating 100% of the logic is possible, but even if it is, I would guess it's more work to do that than to do it manually.

Generator: https://github.com/oxidecomputer/oxide.ts/blob/64401fa2/gene...

Generated output: https://github.com/oxidecomputer/console/blob/8e74accf/libs/...

Manually implemented endpoint behavior: https://github.com/oxidecomputer/console/blob/8e74accf/libs/...

Re: MSW 2.0 – Mock Service Worker

#39

Earlier quoted context omitted.

It's all mocked, so you're not really Hannah, and you're not really launching instances. Their console is open source, and when you run it in dev mode locally this is also what you see.

Just when I think I get the whacky web kids, hell, that maybe I've even one of them, an article like this and functionality like this comes along. I don't know how a mock library enables a revolution of having test data. I don't know why the library couldn't change it's favorite method signature because a subset of versions of one JS framework couldn't...fetch? or why the mock library can only have one dependency...…

Worth noting that in my experience it's the combination of MSW and code generated from an OpenAPI spec that really makes it special, not just MSW alone.

The other reply covers it but I want to slice it slightly differently. I see two things that are different here. One is mocking at the HTTP boundary rather than mocking, e.g., function return values or modules or whatever. That's certainly not revolutionary (I know people do it with rspec and I'm sure plenty of test frameworks do it too), and in theory you could build your mock server with any tool that lets you build a server. But people don't usually do this, and when they do they tend to do it bit by bit for each test rather than thinking about it as mocking the entire API. So for example, in my mock API, my POST creating a project actually creates a project in a mock database, and then when I list projects, I can see what I just created. So I can test the UI by doing exactly what you would do manually — create the thing and see that it shows up where it's supposed to. All of that is built independently of my test for that feature, and it works for all the tests I write — I don't have to think about mocking API bits for a particular test.

Worth a read: https://kentcdodds.com/blog/stop-mocking-fetch

The other thing that's unusual is running this mock in a Service Worker, which means it can run in the browser. That's pretty cool and pretty unique to this tool. But the Mock part is about running the same server outside of the browser i.e., in Node (or now Deno or Bun), which means you can use it for unit tests. So I think the thing you have to see here is the synthesis of all that in one thing — it's one mock server that (because it's written in JS) can run both in the browser and on the server. I admit it doesn't sound that great until you try it, but it enables some cool and surprisingly useful stuff like the live preview I linked.

Re: MSW 2.0 – Mock Service Worker

#40

Why does the site need us to allow ads? On the getting started page I see this: "Please enable ads on this website. Thank you."

They're probably trying to make some money for their work that people take for granted. I don't like ads, but I can't blame them.
Post reply on HN