improved component composition and added tests.

src/routes/Profile.test.ts

@@ -0,0 +1,27 @@
+import { act, render } from '@testing-library/svelte'
+import { describe, expect, it, vi } from 'vitest'
+import { APP_SERVICES } from '$lib/app-services'
+import type { Account } from '$lib/api/types'
+import { account, deferred, session, testServices, theme } from '$test/fixtures'
+import Profile from './Profile.svelte'
+
+describe('Profile', () => {
+  it('does not apply profile CSS after it has unmounted', async () => {
+    const lookup = deferred<Account>()
+    const applyProfileCss = vi.fn()
+    const services = testServices({
+      session: session(),
+      theme: theme({ applyProfileCss }),
+      endpoints: { lookupAccount: vi.fn(() => lookup.promise) },
+    })
+    const view = render(Profile, {
+      props: { acct: 'alice' },
+      context: new Map([[APP_SERVICES, services]]),
+    })
+
+    view.unmount()
+    await act(() => lookup.resolve(account({ fields: [{ name: 'css', value: '.x { color: red }' }] })))
+
+    expect(applyProfileCss).not.toHaveBeenCalled()
+  })
+})