P401:[{"_416":91,"_417":95,"_418":419},"app1","app2","diffPatch","diff --git a/src/discount-code-form.browser.test.tsx b/src/discount-code-form.browser.test.tsx\nindex 298285a..e452464 100644\n--- a/src/discount-code-form.browser.test.tsx\n+++ b/src/discount-code-form.browser.test.tsx\n@@ -80,3 +80,24 @@ test('displays an error when fetching the discount fails', async ({\n \t\t.element(page.getByRole('alert'))\n \t\t.toHaveTextContent('Failed to apply the discount code')\n })\n+\n+test('removes the applied discount code', async () => {\n+\trender()\n+\n+\t// 🐨 Locate the `discountInput` element by its text \"Discount code\".\n+\t// Then, fill in any discount code (e.g. 'EPIC2025').\n+\t//\n+\t// 🐨 Locate the `applyDiscountButton` element by its role and name.\n+\t// Click on it to apply the discount code.\n+\t//\n+\t// 🐨 Next, find the `discountText element for the applied discount\n+\t// and make sure that it is visible on the page.\n+\t//\n+\t// 🐨 Now, create a new variable called `removeDiscountButton` and\n+\t// assign it the result of locating a button with the accessible name\n+\t// \"Remove discount\". Click on it to remove the applied code.\n+\t//\n+\t// 🐨 Finally, write an assertion that the `discountText` element\n+\t// is no longer present in the document.\n+\t// 💰 await expect.element(locator).not.toBeInTheDocument()\n+})\ndiff --git a/src/discount-code-form.tsx b/src/discount-code-form.tsx\nindex 5e61df5..5b9d9f1 100644\n--- a/src/discount-code-form.tsx\n+++ b/src/discount-code-form.tsx\n@@ -54,6 +54,17 @@ async function fetchDiscount(code: string): Promise {\n \treturn data\n }\n \n+async function removeDiscount(code: string): Promise {\n+\tconst response = await fetch('https://api.example.com/discount/code', {\n+\t\tmethod: 'DELETE',\n+\t\tbody: code,\n+\t})\n+\n+\tif (!response.ok) {\n+\t\tthrow new Error(`Failed to remove the discount code (${response.status})`)\n+\t}\n+}\n+\n export function DiscountCodeForm() {\n \tconst [state, dispatch] = useReducer(discountFormReducer, {\n \t\tsubmitting: false,\n@@ -88,7 +99,7 @@ export function DiscountCodeForm() {\n \t\t\treturn\n \t\t}\n \n-\t\tfetchDiscount(code)\n+\t\tawait fetchDiscount(code)\n \t\t\t.then((discount) => {\n \t\t\t\tdispatch({ type: 'success', discount })\n \n@@ -96,12 +107,30 @@ export function DiscountCodeForm() {\n \t\t\t\t\tnotify(`\"${code}\" is a legacy code. Discount amount halved.`)\n \t\t\t\t}\n \t\t\t})\n-\t\t\t.catch((error) => {\n+\t\t\t.catch(() => {\n \t\t\t\tnotify('Failed to apply the discount code', 'error')\n \t\t\t\tdispatch({ type: 'idle' })\n \t\t\t})\n \t}\n \n+\tconst handleRemoveDiscount: FormEventHandler = async (\n+\t\tevent,\n+\t) => {\n+\t\tevent.preventDefault()\n+\n+\t\tconst data = new FormData(event.currentTarget)\n+\t\tconst code = data.get('discountCode') as string\n+\n+\t\tawait removeDiscount(code)\n+\t\t\t.catch((error) => {\n+\t\t\t\tconsole.error(error)\n+\t\t\t\tnotify('Failed to remove the discount code', 'error')\n+\t\t\t})\n+\t\t\t.finally(() => {\n+\t\t\t\tdispatch({ type: 'idle' })\n+\t\t\t})\n+\t}\n+\n \treturn (\n \t\t

\n \t\t\t{state.submitting ? (\n@@ -109,10 +138,28 @@ export function DiscountCodeForm() {\n \t\t\t\t\t{'◡'}\n \t\t\t\t

\n \t\t\t) : state.discount ? (\n+\t\t\t\t\n \t\t\t\t\t

\n \t\t\t\t\t\tDiscount: {state.discount.code} (-\n \t\t\t\t\t\t{state.discount.amount}%)\n \t\t\t\t\t

\n+\n+\t\t\t\t\t\n+\t\t\t\t\t\n+\t\t\t\t\t\t✕\n+\t\t\t\t\t\n+\t\t\t\t\n \t\t\t) : (\n \t\t\t\t

\n \t\t\t\t\t

\ndiff --git a/src/main.tsx b/src/main.tsx\nindex b5273ba..7876383 100644\n--- a/src/main.tsx\n+++ b/src/main.tsx\n@@ -6,13 +6,9 @@ import { App } from './app.jsx'\n async function enableMocking() {\n \tif (process.env.NODE_ENV === 'development') {\n \t\tconst { worker } = await import('./mocks/browser.js')\n-\n-\t\tawait worker.start({\n-\t\t\tonUnhandledRequest: 'warn',\n-\t\t})\n+\t\tawait worker.start()\n \t}\n }\n-\n enableMocking().then(() => {\n \tcreateRoot(document.getElementById('root')!).render(\n \t\t\ndiff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts\nindex 9371671..f7acb69 100644\n--- a/src/mocks/handlers.ts\n+++ b/src/mocks/handlers.ts\n@@ -1,5 +1,5 @@\n-import { http, HttpResponse } from 'msw'\n-import type { Discount } from '../discount-code-form'\n+import { delay, http, HttpResponse } from 'msw'\n+import type { Discount } from '../discount-code-form.js'\n \n export const handlers = [\n \thttp.post(\n@@ -13,4 +13,8 @@ export const handlers = [\n \t\t\t})\n \t\t},\n \t),\n+\thttp.delete('https://api.example.com/discount/code', async () => {\n+\t\tawait delay(500)\n+\t\treturn new HttpResponse()\n+\t}),\n ]"]

src/discount-code-form.browser.test.tsx-3+24App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/discount-code-form.tsx-35+82App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/main.tsx-13+9App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/mocks/handlers.ts-9+13App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/discount-code-form.browser.test.tsx-3+24App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/discount-code-form.tsx-35+82App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/main.tsx-13+9App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

src/mocks/handlers.ts-9+13App 1Copy app 2 file to app 1 (Option+Command to sync without opening)Copy app 1 file to app 2 (Option+Command to sync without opening)App 2

App 1
App 2

App 1
App 2

App 1
App 2

App 1
App 2

App 1
App 2

App 1
App 2

App 1
App 2

App 1
App 2