diff --git var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.problem.remix-stub/flq8snn26ke/app/routes/users+/$username.test.tsx var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.solution.remix-stub/flq8snn26ke/app/routes/users+/$username.test.tsx
index 23160e4..3fd2146 100644
--- var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.problem.remix-stub/flq8snn26ke/app/routes/users+/$username.test.tsx
+++ var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.solution.remix-stub/flq8snn26ke/app/routes/users+/$username.test.tsx
@@ -2,9 +2,11 @@
 * @vitest-environment jsdom
 */
 import { faker } from '@faker-js/faker'
+import { json } from '@remix-run/node'
+import { unstable_createRemixStub as createRemixStub } from '@remix-run/testing'
 import { render, screen } from '@testing-library/react'
 import { test } from 'vitest'
-import { default as UsernameRoute } from './$username.tsx'
+import { default as UsernameRoute, type loader } from './$username.tsx'
 
 function createFakeUser() {
 	const user = {
@@ -21,11 +23,21 @@ function createFakeUser() {
 
 test('The user profile when not logged in as self', async () => {
 	const user = createFakeUser()
-	// 🐨 create the stub here
-	// TODO: write better instructions
+	const App = createRemixStub([
+		{
+			path: '/users/:username',
+			element: <UsernameRoute />,
+			loader(): Awaited<ReturnType<typeof loader>> {
+				return json({
+					user,
+					userJoinedDisplay: user.createdAt.toLocaleDateString(),
+				})
+			},
+		},
+	])
 
-	// 🐨 render the App instead
-	render(<UsernameRoute />)
+	const routeUrl = `/users/${user.username}`
+	render(<App initialEntries={[routeUrl]} />)
 
 	await screen.findByRole('heading', { level: 1, name: user.name })
 	await screen.findByRole('img', { name: user.name })

{
 "type": "GitDiff",
 "files": [
 {
 "type": "ChangedFile",
 "chunks": [
 {
 "type": "Chunk",
 "toFileRange": {
 "start": 2,
 "lines": 11
 },
 "fromFileRange": {
 "start": 2,
 "lines": 9
 },
 "changes": [
 {
 "type": "UnchangedLine",
 "lineBefore": 2,
 "lineAfter": 2,
 "content": " * @vitest-environment jsdom"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 3,
 "lineAfter": 3,
 "content": " */"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 4,
 "lineAfter": 4,
 "content": "import { faker } from '@faker-js/faker'"
 },
 {
 "type": "AddedLine",
 "lineAfter": 5,
 "content": "import { json } from '@remix-run/node'"
 },
 {
 "type": "AddedLine",
 "lineAfter": 6,
 "content": "import { unstable_createRemixStub as createRemixStub } from '@remix-run/testing'"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 5,
 "lineAfter": 7,
 "content": "import { render, screen } from '@testing-library/react'"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 6,
 "lineAfter": 8,
 "content": "import { test } from 'vitest'"
 },
 {
 "type": "DeletedLine",
 "lineBefore": 7,
 "content": "import { default as UsernameRoute } from './$username.tsx'"
 },
 {
 "type": "AddedLine",
 "lineAfter": 9,
 "content": "import { default as UsernameRoute, type loader } from './$username.tsx'"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 8,
 "lineAfter": 10,
 "content": ""
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 9,
 "lineAfter": 11,
 "content": "function createFakeUser() {"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 10,
 "lineAfter": 12,
 "content": "\tconst user = {"
 }
 ]
 },
 {
 "context": "function createFakeUser() {",
 "type": "Chunk",
 "toFileRange": {
 "start": 23,
 "lines": 21
 },
 "fromFileRange": {
 "start": 21,
 "lines": 11
 },
 "changes": [
 {
 "type": "UnchangedLine",
 "lineBefore": 21,
 "lineAfter": 23,
 "content": ""
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 22,
 "lineAfter": 24,
 "content": "test('The user profile when not logged in as self', async () => {"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 23,
 "lineAfter": 25,
 "content": "\tconst user = createFakeUser()"
 },
 {
 "type": "DeletedLine",
 "lineBefore": 24,
 "content": "\t// 🐨 create the stub here"
 },
 {
 "type": "DeletedLine",
 "lineBefore": 25,
 "content": "\t// TODO: write better instructions"
 },
 {
 "type": "AddedLine",
 "lineAfter": 26,
 "content": "\tconst App = createRemixStub(["
 },
 {
 "type": "AddedLine",
 "lineAfter": 27,
 "content": "\t\t{"
 },
 {
 "type": "AddedLine",
 "lineAfter": 28,
 "content": "\t\t\tpath: '/users/:username',"
 },
 {
 "type": "AddedLine",
 "lineAfter": 29,
 "content": "\t\t\telement: <UsernameRoute />,"
 },
 {
 "type": "AddedLine",
 "lineAfter": 30,
 "content": "\t\t\tloader(): Awaited<ReturnType<typeof loader>> {"
 },
 {
 "type": "AddedLine",
 "lineAfter": 31,
 "content": "\t\t\t\treturn json({"
 },
 {
 "type": "AddedLine",
 "lineAfter": 32,
 "content": "\t\t\t\t\tuser,"
 },
 {
 "type": "AddedLine",
 "lineAfter": 33,
 "content": "\t\t\t\t\tuserJoinedDisplay: user.createdAt.toLocaleDateString(),"
 },
 {
 "type": "AddedLine",
 "lineAfter": 34,
 "content": "\t\t\t\t})"
 },
 {
 "type": "AddedLine",
 "lineAfter": 35,
 "content": "\t\t\t},"
 },
 {
 "type": "AddedLine",
 "lineAfter": 36,
 "content": "\t\t},"
 },
 {
 "type": "AddedLine",
 "lineAfter": 37,
 "content": "\t])"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 26,
 "lineAfter": 38,
 "content": ""
 },
 {
 "type": "DeletedLine",
 "lineBefore": 27,
 "content": "\t// 🐨 render the App instead"
 },
 {
 "type": "DeletedLine",
 "lineBefore": 28,
 "content": "\trender(<UsernameRoute />)"
 },
 {
 "type": "AddedLine",
 "lineAfter": 39,
 "content": "\tconst routeUrl = `/users/${user.username}`"
 },
 {
 "type": "AddedLine",
 "lineAfter": 40,
 "content": "\trender(<App initialEntries={[routeUrl]} />)"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 29,
 "lineAfter": 41,
 "content": ""
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 30,
 "lineAfter": 42,
 "content": "\tawait screen.findByRole('heading', { level: 1, name: user.name })"
 },
 {
 "type": "UnchangedLine",
 "lineBefore": 31,
 "lineAfter": 43,
 "content": "\tawait screen.findByRole('img', { name: user.name })"
 }
 ]
 }
 ],
 "path": "var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.solution.remix-stuflq8snn26ke/app/routes/users+/$username.test.tsx"
 }
 ]
}

+ var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.solution.remix-stub/flq8snn26ke/app/routes/users+/$username.test.tsx
- var/folders/kt/zd3bfncd0c3gjx25hbcq483c0000gn/T/kcdshop/diff/full-stack-testing/exercises__sep__07.remix-component__sep__01.solution.remix-stuflq8snn26ke/app/routes/users+/$username.test.tsx