diff --git a/src/test/FavoriteButton.test.tsx b/src/test/FavoriteButton.test.tsx
new file mode 100644
index 0000000..539dfc0
--- /dev/null
+++ b/src/test/FavoriteButton.test.tsx
@@ -0,0 +1,25 @@
+import { fireEvent, render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import { FavoriteButton } from '../components/FavoriteButton'
+
+describe('FavoriteButton', () => {
+  it('kaller onToggle når knappen klikkes', () => {
+    const onToggle = vi.fn()
+
+    render(<FavoriteButton isFavorite={false} onToggle={onToggle} />)
+
+    fireEvent.click(
+      screen.getByRole('button', { name: 'Legg til favoritt' }),
+    )
+
+    expect(onToggle).toHaveBeenCalledOnce()
+  })
+
+  it('viser riktig knapp når sangen er favoritt', () => {
+    render(<FavoriteButton isFavorite={true} onToggle={vi.fn()} />)
+
+    expect(
+      screen.getByRole('button', { name: 'Fjern fra favoritter' }),
+    ).toBeInTheDocument()
+  })
+})
\ No newline at end of file
diff --git a/src/test/Navigation.test.tsx b/src/test/Navigation.test.tsx
new file mode 100644
index 0000000..faf47d0
--- /dev/null
+++ b/src/test/Navigation.test.tsx
@@ -0,0 +1,33 @@
+import { fireEvent, render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import { Navigation } from '../components/Navigation'
+
+describe('Navigation', () => {
+  it('tester props og brukerinteraksjon', () => {
+    const onNext = vi.fn()
+
+    render(
+      <Navigation
+        isFirst={true}
+        isLast={false}
+        onPrevious={() => {}}
+        onNext={onNext}
+      />,
+    )
+
+    const previousButton = screen.getByRole('button', {
+      name: 'Forrige sang',
+    })
+
+    const nextButton = screen.getByRole('button', {
+      name: 'Neste sang',
+    })
+
+    expect(previousButton).toBeDisabled()
+    expect(nextButton).not.toBeDisabled()
+
+    fireEvent.click(nextButton)
+
+    expect(onNext).toHaveBeenCalled()
+  })
+})
\ No newline at end of file