fine
+ } + + const Boundary = catchError((props, { error, reset, retry }) => ( +
+
+ ))
+
+ // React reports every error a boundary catches.
+ const quiet = () => spyOn(console, 'error').mockImplementation(() => {})
+
+ test('renders the fallback, which reset and retry leave', () => {
+ const consoleError = quiet()
+ shouldThrow = true
+ const view = render(
+ + {String(props.label)}: {(error as Error).message} +
+ + +{String(title)}
+ } + const view = render(online
+
',
+ )
+ })
+
+ test('with a class, and eager when preloaded', () => {
+ expect(
+ html(
+ ',
+ )
+ expect(html(',
+ )
+ })
+
+ test('with a blur placeholder', () => {
+ expect(
+ html(
+ 
',
+ )
+ expect(html()).toContain(
+ 'data-nimg="fill"',
+ )
+})
diff --git a/src/__tests__/next-link.test.tsx b/src/__tests__/next-link.test.tsx
new file mode 100644
index 0000000..8ad8c40
--- /dev/null
+++ b/src/__tests__/next-link.test.tsx
@@ -0,0 +1,250 @@
+import { describe, expect, mock, test } from 'bun:test'
+import type { AnchorHTMLAttributes, ButtonHTMLAttributes } from 'react'
+import { fireEvent, render } from '../index.ts'
+import { router, setUrl } from '../next/index.ts'
+import Link, { formatUrl, useLinkStatus } from '../next/link.tsx'
+
+/**
+ * Clicks `element` and reports whether the click was handled in the page
+ * (`defaultPrevented`). The browser's own navigation is cancelled afterwards,
+ * so happy-dom never leaves the page.
+ */
+function click(element: Element, init?: MouseEventInit) {
+ let prevented: boolean | undefined
+ const listener = (event: Event) => {
+ prevented = event.defaultPrevented
+ event.preventDefault()
+ }
+ document.addEventListener('click', listener)
+ fireEvent.click(element, init)
+ document.removeEventListener('click', listener)
+ return prevented
+}
+
+describe('markup', () => {
+ test('matches next/link: props, then href', () => {
+ const { container } = render(
+
+ About
+ ,
+ )
+ expect(container.innerHTML).toBe('About')
+ })
+
+ test('formats a url object, and prefers `as`', () => {
+ const view = render(
+ <>
+
+ search
+
+
+ post
+
+ ,
+ )
+ expect(view.getByText('search').getAttribute('href')).toBe(
+ '/search?q=a+b&tag=x&tag=y#top',
+ )
+ expect(view.getByText('post').getAttribute('href')).toBe('/posts/1')
+ })
+
+ test('useLinkStatus is never pending', () => {
+ expect(useLinkStatus()).toEqual({ pending: false })
+ })
+})
+
+describe('a click', () => {
+ test('navigates through router.push', () => {
+ const view = render(About)
+ expect(click(view.getByText('About'))).toBe(true)
+ expect(router.push).toHaveBeenCalledWith('/about', { scroll: true })
+ })
+
+ test('replaces, and keeps the scroll position, when asked', () => {
+ const view = render(
+
+ About
+ ,
+ )
+ click(view.getByText('About'))
+ expect(router.replace).toHaveBeenCalledWith('/about', { scroll: false })
+ expect(router.push).not.toHaveBeenCalled()
+ })
+
+ test('calls onClick, which can cancel the navigation', () => {
+ const onClick = mock((event: { preventDefault(): void }) => {
+ event.preventDefault()
+ })
+ const view = render(
+
+ About
+ ,
+ )
+ click(view.getByText('About'))
+ expect(onClick).toHaveBeenCalledTimes(1)
+ expect(router.push).not.toHaveBeenCalled()
+ })
+
+ test('onNavigate can cancel the navigation, but not the default', () => {
+ const view = render(
+ event.preventDefault()}>
+ About
+ ,
+ )
+ expect(click(view.getByText('About'))).toBe(true)
+ expect(router.push).not.toHaveBeenCalled()
+ })
+
+ test.each([
+ ['ctrl', { ctrlKey: true }],
+ ['meta', { metaKey: true }],
+ ['shift', { shiftKey: true }],
+ ['alt', { altKey: true }],
+ ['middle button', { button: 1 }],
+ ])('with %s is left to the browser', (_, init) => {
+ const view = render(About)
+ expect(click(view.getByText('About'), init)).toBe(false)
+ expect(router.push).not.toHaveBeenCalled()
+ })
+
+ test.each([
+ ['another window', { target: '_blank' }],
+ ['a download', { download: 'file' }],
+ ])('on a link to %s is left to the browser', (_, props) => {
+ const view = render(
+
+ link
+ ,
+ )
+ expect(click(view.getByText('link'))).toBe(false)
+ expect(router.push).not.toHaveBeenCalled()
+ })
+
+ test('on a link to this window navigates', () => {
+ const view = render(
+
+ About
+ ,
+ )
+ click(view.getByText('About'))
+ expect(router.push).toHaveBeenCalledWith('/about', { scroll: true })
+ })
+
+ test('on a URL of this origin navigates; any other is the browser', () => {
+ setUrl('/current')
+ const view = render(
+ <>
+ same
+ other
+ broken
+ ,
+ )
+ click(view.getByText('same'))
+ expect(router.push).toHaveBeenCalledWith('http://localhost/same', {
+ scroll: true,
+ })
+ expect(click(view.getByText('other'))).toBe(false)
+ expect(click(view.getByText('broken'))).toBe(false)
+ expect(router.push).toHaveBeenCalledTimes(1)
+ })
+})
+
+describe('legacyBehavior', () => {
+ function Button(props: ButtonHTMLAttributes{router?.pathname}
+ } + Page.getInitialProps = () => ({}) + const Wrapped = withRouter(Page) + expect(Wrapped.displayName).toBe('withRouter(Page)') + expect(Wrapped.getInitialProps).toBe(Page.getInitialProps) + setUrl('/wrapped') + expect(render(
+
+
+ {statusCode
+ ? `${statusCode}: ${title}`
+ : 'Application error: a client-side exception has occurred'}
+
+
+
+ )
+ }
+}
+
+export interface ErrorInfo {
+ error: unknown
+ reset: () => void
+ retry: () => void
+}
+
+interface CatchErrorProps {
+ pathname: string
+ renderFallback: (errorInfo: ErrorInfo) => ReactNode
+ children?: ReactNode
+}
+
+interface CatchErrorState {
+ error: { thrownValue: unknown } | null
+ previousPathname: string
+}
+
+// The error boundary `catchError` renders, as the App Router's: redirects and
+// `notFound` pass through, and navigating to another path clears the error.
+class CatchError extends Component
+
+ {statusCode ? (
+
+ + {statusCode} +
+ ) : null} +
+
+