00:00 Hi, hello, and welcome to this new workshop called React Component Testing with Vitest. My name is Artem, and today I will be your guide through the realm of integration testing and component testing in particular. And this will be one journey to remember, as we go through a bunch of different exercises, all following the same goal, to help you write great tests.

00:19 And to do that, we are finally going to bring your component tests to where they belong, to the actual browser. But before that, you will learn the answer to the most important question, why? Why should you even care about this change? Why are your component tests better off in the browser? You will experience first-hand how browser-like environments like GSDOM are letting you down.

00:38 You will see a valid JavaScript code that works in the browser and in Node.js, but fails in GSDOM, undermining the value you're getting from the tests you work so hard to write. Next, we can explore the browser mode in Vitest, from how to install and configure it, to covering some of the most common setup scenarios, like applying global styles to your component tests,

00:57 or configuring your test runner to know the difference between unit tests, integration tests, and component tests on run in the browser. Of course, this material wouldn't be complete without us talking about best practices. You will learn the pillars that make a great component test, from the right way to find elements on the page and interact with them like your users do, to writing meaningful

01:16 assertions and drawing the correct test boundaries, so you are able to focus just on the behaviors you want. And last but not least, we're going to explore debugging, specifically debugging failed component tests. Because your tests bring you value when they fail, but nobody likes a site of a failing test. Well, today we're going to change that.

01:33 I will teach you some of my favorite techniques for debugging component tests in the browser, so the next time you see a failing test, you would know what to do. And all of that is packed into countless exercises waiting for you to tackle them. I hope you're excited and ready to bring your tests to the next level, because our journey starts now.