Vitest and Testing Library Component Test

Write a component test plan and the first test file. Test behavior the user sees, not internal state. COMPONENT Name and what the user does: [DESCRIPTION] Props that change behavior: [LIST] Network: [NONE | ONE REQUEST] Library: [VITEST + TESTING LIBRARY] DELIVER 1) The cases: default render, the success interaction, the empty case, the error case, the disabled case. Phrase them as user-visible outcomes. 2) One test file that uses the screen and roles (getByRole), userEvent for the click or typing, and findBy for the async result. Include the mock only if there is a request, and put it at the network boundary, not by mocking the component's hook unless I said the hook is the unit. 3) What not to assert: class names, the call count of a private function, a snapshot of the whole DOM. 4) The script entry in package.json and the jsdom or happy-dom choice, with one reason. 5) A note on act warnings and how this file avoids them. Use the component's accessible name. If it has none, the test fails and the fix is the label, which you should show.