feat: add Reset button to counter

playwright/app.spec.ts

@@ -9,4 +9,9 @@ test('renders the application', async ({ page }) => {
   await expect(counter).toBeVisible()
   await counter.click()
   await expect(page.getByRole('button', { name: 'Count is 1' })).toBeVisible()
+
+  const reset = page.getByRole('button', { name: 'Reset' })
+  await expect(reset).toBeVisible()
+  await reset.click()
+  await expect(page.getByRole('button', { name: 'Count is 0' })).toBeVisible()
 })

src/App.tsx

@@ -42,6 +42,25 @@ function App() {
         >
           Count is {count}
         </button>
+        <button
+          type="button"
+          className="counter"
+          onClick={() => {
+            const previousCount = count
+            setCount(0)
+            trackEvent(
+              'reset_button_clicked',
+              {
+                component: 'App',
+              },
+              {
+                previousCount,
+              },
+            )
+          }}
+        >
+          Reset
+        </button>
       </section>
 
       <div className="ticks"></div>

src/__tests__/e2e/app.e2e.spec.ts

@@ -53,5 +53,17 @@ describe('App bootstrap', () => {
       { component: 'App' },
       { nextCount: 1 },
     )
+
+    await page.getByRole('button', { name: 'Reset' }).click()
+
+    await expect
+      .element(page.getByRole('button', { name: 'Count is 0' }))
+      .toBeInTheDocument()
+
+    expect(telemetryMocks.telemetry.trackEvent).toHaveBeenCalledWith(
+      'reset_button_clicked',
+      { component: 'App' },
+      { previousCount: 1 },
+    )
   })
 })