A modern web application probably makes tens of network calls during a typical user flow.

A good end-to-end web test must observe and in some cases mock the network calls to make the test reliable, complete, and easy to debug. I will show some of my tips and tricks for using and controlling network API calls during tests. We will see how Cypress, Playwright, and Vitest implement network spies and stubs, and what we can achieve by writing just a little bit of custom code on top of existing features.

À mesure qu’une base de code React évolue, une composante toute simple peut devenir excessivement complexe. On la connecte à l’API et à des contextes, on ajoute un mode mobile, puis des render functions, on ajoute des propriétés optionnelles, on crée une copie de la composante qui fait presque la même chose mais pas tout à fait pour un autre cas d’utilisation… Cette présentation aborde différentes stratégies comme la composition, les slots, la séparation des responsabilités, et la duplication stratégique.

A modern web application probably makes tens of network calls during a typical user flow.

A good end-to-end web test must observe and in some cases mock the network calls to make the test reliable, complete, and easy to debug. I will show some of my tips and tricks for using and controlling network API calls during tests. We will see how Cypress, Playwright, and Vitest implement network spies and stubs, and what we can achieve by writing just a little bit of custom code on top of existing features.

À mesure qu’une base de code React évolue, une composante toute simple peut devenir excessivement complexe. On la connecte à l’API et à des contextes, on ajoute un mode mobile, puis des render functions, on ajoute des propriétés optionnelles, on crée une copie de la composante qui fait presque la même chose mais pas tout à fait pour un autre cas d’utilisation… Cette présentation aborde différentes stratégies comme la composition, les slots, la séparation des responsabilités, et la duplication stratégique.