Artem Zakharchenko - Mock Service Worker

Durée: 57m1s

Date de sortie: 20/01/2025

This week we talk to Artem Zakharchenko, the creator of Mock Service Worker (MSW). MSW is a library that allows you to mock network requests in your tests and demos. We talk about the evolution of MSW, the technical details of how it works, and the future prospects of the library.


Apply to sponsor the podcast: https://devtools.fm/sponsor

Become a paid subscriber our patreon, spotify, or apple podcasts for the ad-free episode.

j'ai essayé d'imaginer l'applicant parfait.
J'ai commencé à démonter ce petit prototype
qui s'appelle Mockery.
J'ai juste fait un week-end, c'était un gros file.
Tout était en service.
J'ai poussé et l'ai oublié pour probablement un an ou deux.
Et ça a été déclaré par Kenzie Dawson sur Twitter.
Bonjour, bienvenue à DevTools FM.
C'est un podcast de Tours de Développement.
Et les gens qui font ça, je suis Andrew et je suis Michael Hoche.
Salut tout le monde, on veut vous présenter notre guest aujourd'hui, Artym.
Artym, vous êtes le créateur de MSW,
qui est un outil fantastique.
J'ai utilisé beaucoup d'oxydants.
C'était un grand partenariat.
Je suis très excité de vous parler de ça.
Vous travaillez à Epic Web Dev,
et nous sommes aussi très excitées à vous parler de ça.
Nous sommes des grands fans de Kent.
Mais avant de nous parler de ça,
Would you like to tell our audience un peu plus sur vous-même ?
Oui, bien sûr.
Hey tout le monde, je m'appelle Artym,
je suis un ingénieur de software et aussi un éducateur de développeur à Epic Web.
Et je me suis trouvé en train de travailler pour les dernières années,
exclusivement sur le dev-tooling.
Je suis très excité de vous parler de ça.
C'est superbe.
Alors, nous allons vous parler de ce qui est le plus important que je sais vous pour.
C'est un workeur de mock service, ou MSW.
Vous pouvez nous expliquer ce que c'est et comment vous avez créé ça ?
Oui, donc, MSW est un library de mock.
Je suis très sûr que les listeners ont mis
des trucs de mock dans le passé,
des trucs comme knock, mirage,
des adapteurs de fetche.
Et le point de MSW est de vous permettre de vous décrire le réseau.
Mais il y avait un peu d'un different approche philosophique
pour le projet,
parce que les gens sont souvent en train de mock pour différentes raisons.
En fait, c'est surtout le test.
Bien sûr, nous devons gagner le contrôle du réseau,
de la récordation, de la récordation,
de la récordation, de la récordation,


de la récordation, de la récordation,




de la récordation, de la récordation,



de la récordation, de la récordation,
de la récordation, de la récordation,
de la récordation, de la récordation,








de la récordation, de la récordation,
de la récordation, de la récordation,
de la récordation, de la récordation,

de la récordation, de la récordation,
de la récordation, de la récordation,


de la récordation, de la récordation,






de la récordation, de la récordation, de la récordation,
de la récordation, de la récordation,
de la récordation, de la récordation,
de la récordation, de la récordation,








de la récordation, de la récordation,
de la récordation, de la récordation,












de la récordation, de la récordation,
de la récordation, de la récordation,
de la récordation, de la récordation,




MSW est la partie-harpite du cleared!
Le nom des stillées factory-ากarnet est en線
bar голash Coffee카
pour comporter la mailbox
et vous avez votre word상
pour Wasnion
que vous avez besoin de cela plus tard.
Ce qui s'étend à l'extérieur est un couple d'autres choses.
Donc, depuis le début, je me suis trouvé assez limité
que vous rencontrez des solutions de mocs
qui étaient très spécifiques à certains clients de request.
Par exemple, vous verrez un moc de fachement.
Et ça fonctionne vraiment bien avec fachement,
mais on peut dire que demain vous migratez à quelque chose d'autre,
surtout si vous n'avez pas de GS,
peut-être que vous migratez à un RAW ou HTTP request.
Et puis, tout de suite, vous devez ajuster votre test,
ce n'est pas quelque chose que j'ai un grand fan de.
Donc, l'une des choses que l'AMSW fait très bien
est d'avoir un request client agnostic.
Et cela signifie que vous pouvez décrire la métro
et que c'est complètement inégal de comment ce request est fait.
Tout ce qui matters est ce que c'est que ce request
et comment vous voulez être détenu.
Et puis, la deuxième chose qui est de la suite
est d'être un environnement agnostic,
ce qui est aussi incroyable,
parce que nous avons ce request-handler,
qui est des fonctions que vous avez utilisées
pour décrire ce contact network.
Et ils sont rétins juste en jouant en JavaScript.
Donc, vous utilisez l'application Fetch,
vous pouvez utiliser l'application Fetch
pour déclencher l'interseptice request.
Vous pouvez utiliser la réponse, la classe,
pour construire la réponse.
Et je tries de créer
ce genre de ressenti naturel,
presque comme un part de l'application native.
Et puis, l'AMSW fait
tout ce qui est de la suite,
pour savoir comment faire de différentes requests
de différents environnements, comme Node.js,
sur ce Fetch API,
et puis, vous interviendrez avec cela.
Donc, être un request-client agnostic
et environnement agnostic est vraiment puissant,
donc vous vous récolter votre contact network,
et tout de suite vous pouvez le faire intergrer.
Et oui, je pense que ce sont les points
qui sont les plus grands pour le set.
Oui, je pense qu'il y a cette notion de la moquine
que ça peut être vraiment fragile
et vraiment expensif.
Si quelqu'un qui a fait l'extensive et la testée,
il a vraiment bien pu accepter ceci.
Et, en mon expérience,
une moque de test,
c'est le meilleur que vous avez
en tant que peu de ces,
et de les mettre en place au niveau le plus bas,
donc, moquer la network,
en lieu d'une moquine
de l'express-handle,
c'est un pouvoir.
Si vous pensez à la fragilité,
la moquine est de deux places.
Vous êtes à l'aide d'une bounte
pour les détails d'implementation.
Donc, comment votre software fait la question,
ou vous êtes bounde à la réponse
d'eux-mêmes.
Je veux cette réponse pour rester en sync.
Donc, ce sont usually deux main factures,
comment votre moque se fait en date
et fragile et puis, vous vous trouvez
en vous en maintenance, moques,
en tant que test de fragilité.
Donc, oui, je l'ai bien fait.
Merci d'avoir regardé
cette vidéo.
Je vous invite à vous abonner
pour ne pas vous abonner
pour ne pas vous abonner








pour ne pas vous abonner
pour ne pas vous abonner













pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner

pour ne pas vous abonner







pour ne pas vous abonner
pour ne pas vous abonner













pour ne pas vous abonner




pour ne pas vous abonner


pour ne pas vous abonner





pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner

pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner


pour ne pas vous abonner




pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner












pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner
pour ne pas vous abonner












pour ne pas vous abonner
pour ne pas vous abonner
C'est comme si il y avait un overlap, une bonne communication toujours aide à l'étranger dans l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de
l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université
de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Univers
de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Univers
de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Univers
de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Université de l'Univers
Un peu de changements ont été faits dans le système d'écosystème et de la JavaScript dans les dernières années.
Qu'est-ce que vous pensez de leur ?
Vous pensez que Justin a disparu à un passeur et que nous devons tous aller au test ?
Ou devons-nous tous être en train de faire tout ?
Oui, il y a beaucoup de développement, beaucoup de progress.
Je suis très stupide d'être un ingénie de JavaScript.
Même si les AI sont considérés comme quelque chose,
et que vous soyez là, c'est généralement le meilleur état.
Nous avons été, et si vous avez été en train de développer 10 ans, 20 ans,
maintenant c'est fantastique, nous avons beaucoup de bons outils,
beaucoup de standards, et ça ne va qu'être qu'un autre.
Je suis très heureux de tester le RELM, en particulier,
je pense que le Cypress, il y a des années,
c'était une bonne introduction à un test plus accessible,
en comparaison à un Selenium, et maintenant il y a des outils de playwright.
Nous suivons un pattern très similaire dans le tooling.
Les gens tentent de venir avec des moyens approachables
pour adopter différentes stratégies de test.
Le playwright est un très bon appareil d'automation,
et j'utilise ça beaucoup et j'adore ça.
Et une chose similaire, c'est que j'étais absolument astonnée
quand j'ai découvert de faire un test, 6 ans plus tard,
je ne sais pas ce que c'était.
Maintenant, je comprends que ça a des shortcomings,
c'est un peu plus tard,
il n'y a pas de support pour ESM,
mais le fait que tu fais ça, c'est pas quelque chose que je veux faire.
Comme un ingénieur, je veux avoir un test,
je veux avoir un test dans la langue qui est supportée,
et je veux avoir le test, je ne veux pas avoir de configuration.
Tu peux me faire compte de ça,
parce qu'il y a beaucoup plus de choses à configurer dans les zones qui font le travail.
Les supports ESM, les supports touchscrew,
ces choses doivent être natives, c'est juste un moment.
C'est là où beaucoup de grands improvements
sont dans le système de vue,
et surtout dans Vitas,
c'est juste fantastique.
La toute idée de construire un type de vite
et de avoir cet aspect de compilation,
et de avoir une expérience de test,
qui est très familiale à Juste.
Je suis négatif à deux projets,
comme des tests de Vitas,
c'était une grande expérience, c'était rapide,
les tests ont été plus rapides,
ce que j'aime,
et il y a beaucoup de choses qui font que Vitas fait mieux
dans les zones et plus apparemment,
que je te le fais juste,
et ça me clique, et c'est pourquoi je vous ai dit
tout ce que vous trouvez en appui web
en utilisant Vitas, parce que c'est un tool fantastique.
Et maintenant, avec l'admission avec la mode browser,
ça se fait encore mieux.
J'ai été excité et acheté dans la mode browser,
et j'ai été en train de parler avec la team
avec la Vitas, c'était vraiment génial.
Maintenant, j'ai eu la chance de essayer,
d'intégrer ça, d'essayer le workshop,
d'essayer quelque chose avec ça.
Et je pense que plus de gens devraient essayer de l'utiliser.
C'est vraiment une bonne idée,
d'être combiné avec la compilation de vites,
donc vous avez tous les syntaxes modernes,
tous les types de script,
vous avez tout,
pas seulement ça,
mais aussi vous vous construisrez votre app.
Vous vous construisrez votre test
de la même manière que vous construisrez votre app,
qui est le point de vendre des choses sur le top de vites,
qui je n'ai pas connu,
je parle avec Anthony
du vite ecosystem,
et il m'a expliqué,
et j'ai été impressionné,
ça fait du sens.
Vous voulez avoir un contexte comme possible,
vous voulez avoir la même net record,
vous voulez avoir la même compilation,
même si il y a des différences
sous la vite,
mais c'est toujours...
Vous pouvez désirer ces détails
parce que ces détails d'implementation sont de vites.
J'aime que vous avez cette compilation consistante,
vous avez Vites on top,
qui vous permet de tester
votre expérience de test,
vous avez des blocs,
chaque hook,
tout ce qui vous êtes occupé,
et puis vous avez,
sur le top de ce,
un automatique browser,
vous pouvez hook votre browser,
qui peut être un playwright,
je crois qu'ils apportent des différents browsers,
des providers,
il peut être un autre type d'abri,
et vous pouvez avoir
tous ces trois components
travaillés ensemble.
Vous pouvez avoir votre code,
un code isolé,
ce n'est pas un entourant test,
c'est juste votre component,
compilé avec Vites,
et puis,
pardon, compilé avec Vites,
et puis servi dans le browser,
et puis vous avez Vites
comme un layer
qui interface avec un browser.
C'est similaire à un playwright,
mais un peu différent.
Et c'est là que je vois
beaucoup d'intégration,
de test,
de la vite.
Je veux que nous puissions
se faire des choses comme
gsdom,
environnement de browser,
et d'embrasser l'automation de browser,
parce que je sais que
beaucoup de gens ont le stigma,
c'est lourd,
c'est pas sympa,
il va prendre beaucoup de temps,
il sera plus lourd que les tests d'intégration.
Bien sûr,
personne ne veut dire
que c'est pas,
mais c'est
à la plus vite
les plus accessibles
de l'état qu'il y a.
C'est pas un salinien
depuis 10 ans,
c'est un truc complètement nouveau,
et,
à moins de mes expériences,
et tout le monde que je parle,
ils ont vraiment un test
et c'est un truc très important.
Il y a des éléments
que vous devez être
aware de,
quelque chose que vous pouvez
contribuer
pour le gréer
ou pour l'expérience,
mais les outils eux-mêmes
sont vraiment très vite.
Je pense qu'il n'y a pas d'excuse
pour payer
assez de gros prix,
en utilisant un browser
comme environnement,
quand le prix
de la vente
de l'automation
de browser
est beaucoup plus lourd,
comme j'ai
pensé pour ça
longtemps,
comme
des discussions
sur la performance
en testant,
et peut-être que c'est
une chose de la même chose,
mais je vois
cette phrase
que la performance
ne devrait pas être
votre considération
en testant,
parce que la plus performante
test est la personne
qui n'existe,
la personne que vous n'avez pas
pas faite.
C'est le plus rapide.
Donc, pour moi,
bien sûr, je veux que
vous puissiez être rapide.
Je veux que le rapide
de la vente de l'automation
soit rapide,
mais ça ne devrait pas
venir à la coste
de compromiser mon environnement,
de compromiser le code
que je teste.
Je veux tester
la même code,
et les outils,
comme la mode de browser,
permettent de me faire ça.
Rien que la mode de browser,
j'ai mon expérience
d'experience d'experience,
c'est vraiment cool.
Je suis excité
à ça.
Oui, le riz de JS Dom
est un riz de barbes
qui
n'a jamais été
donné de valeur
et qui m'a
donné seulement de paix.
Donc, je le suis.
Oh, oui.
Je pense que
ça a bien joué
dans la conversation
de la conversation
de la vente,
c'est comme si vous voulez
faire moins de choses
ou pushing
plus loin du stack,
comme s'attendre à la
vraie environnement
que vous voulez tester.
Parce que les choses
comme
JS Dom,
et ces environnements
sont
en train de mâcher
votre appui de browser,
les polyfills,
les implementations,
mais c'est un mâch.
Et si je peux
faire contre la vraie chose,
ce serait probablement
un bon cas de utilisation.
Vous n'avez pas envie
de mettre un actual
sur le test,
mais je veux mettre
un actual environnement.
C'est un bon
topic
de contraste.
Oui, absolument.
C'est bien
de entendre
votre histoire
et tout le travail
que vous avez fait
sur MSW
et ce que vous êtes
en train de faire.

changer la conversation
un peu
et parler de l'avenir.
Vous avez
fait un peu de travail
avec MSW
pendant les années.
Il y a été
beaucoup de travail
très cool
qui a été rendu
en plus tard.
Vous parlez
de websockets,
websockets
sont incroyablement
intéressants.
Qu'est-ce que
2025
aura pour MSW?
Qu'est-ce que vous avez
plané?
Oh, oui.
Ce sera très
difficile
de mettre
des supports websockets,
au moins
dans mes yeux.
C'était un travail
extensible.
Mais il y a
une chose
que je suis très
excité
de faire.
Je pense que
nous allons
le faire
cette année.
Peut-être
plus tard
que je le réalise.
Ce sera
une interception

Ce sera
quelque chose
complètement
nouveau.
Mais
dans le lit
de la

modernes
qui sont
en train de

ce modèle mental
où nous colloquons
un client,
nous avons ces
components de réaction
de réaction
on tend
à les garder
tous ensemble
parce qu'on n'a pas
de GS,
on peut avoir
un JavaScript
tout le monde.
Je pense que
dans le lit de
ce développement
il y a
un besoin
de
contrôler
un métier
différent.
Par exemple,
beaucoup de gens
m'ont
un app
et je teste
un
test
en un test
et je
jette un
page
et ça
a un component

qui
a un
part
et je
jette un
data
maintenant.
Mais
ce que
beaucoup de gens
ne réalisent
ce genre de
comportement
n'existe pas
maintenant.
C'est pas possible
parce que
on parle de différents processus.
Tu as un processus
de test
qui est un processus
de no GS
qui s'étend
un processus
d'autre
et un serveur
qui est un troisième.
Tu as un processus
de crosse
pour communiquer
la métier.
Je pense que
on a trouvé
une solution

intéressante
qui est
cette

de crosse
de crosse
de réception
de réaction
de réaction
de réaction
de réaction de réaction
de réaction
de réaction





Et c'est quelque chose que nous avons déjà dans l'APR, et je pense que c'est un bon état,
il y a encore quelque chose à poli, mais c'est déjà le main-junk de l'APR,
et ça va permettre aux gens de contrôler la chaine des tests, où que la chaine est.
C'est assez cool, je ne sais pas si ça fait du processus agnostic,
je ne sais pas, et je ne m'en occupe pas beaucoup en termes de ces phrases,
mais j'aime l'obligation de donner plus de contrôle aux gens,
et surtout depuis que c'est un peu de ces cas de utilisation.
Les gens sont face à ces problèmes, ils veulent contrôler un processus,
sans réaliser que c'est probablement un processus différent,
et je suis excité de poursuivre cet API, ce setup remote server API,
pour ne pas juste aider à unblogger ces choses,
mais je voudrais aussi l'utiliser et repurpose-en,
et essayer de faire des tests pour les gens, des components de réactes server,
qui sont encore très en sol, comme comment tu testes,
mais personne ne sait, les gens tentent de venir avec des utilités, des frameworks,
je ne pense pas que c'est le moyen, c'est assez fortement couplé,
et j'aimerais expérimenter avec un peu différent,
et j'ai déjà des concepts de preuves qui sont très promis,
et c'est quelque chose que je vais explorer plus tard, cette année.
C'est un moment d'excité pour être un engineer JavaScript,
avec tous les différents tests qui se passent,
de vous et de la communauté.
Merci pour les podcasts et les parler, c'est un temps vraiment fun,
d'aller en train de la gaffe de MSW, et de toutes les topics.
Merci pour ce qui s'est passé.
Merci beaucoup pour me faire avancer, c'est incroyable.
Merci.
Merci Arnam, et ton travail est fantastique.
Honnêtement, MSW est vraiment un changement de jeu.
C'est l'une des outils où je commence chaque projet.
C'est l'une des premières choses que je installe,
donc merci beaucoup pour votre travail.
C'est très beau.
J'espère que ce ne sera pas le plus grand changement de jeu.

Les infos glanées

Je suis une fonctionnalité encore en dévelopement

Signaler une erreur

devtools.fm:DeveloperTools,OpenSource,SoftwareDevelopment

A podcast about developer tools and the people who make them. Join us as we embark on a journey to explore modern developer tooling and interview the people who make it possible. We love talking to the creators front-end frameworks (React, Solid, Svelte, Vue, Angular, etc), JavaScript and TypeScript runtimes (Node, Deno, Bun), Languages (Unison, Elixor, Rust, Zig), web tech (WASM, Web Containers, WebGPU, WebGL), database providers (Turso, Planetscale, Supabase, EdgeDB), and platforms (SST, AWS, Vercel, Netlify, Fly.io).
Tags
Card title

Lien du podcast

[{'term': 'Technology', 'label': None, 'scheme': 'http://www.itunes.com/'}]

Go somewhere