When upgrading to React 19 and NextJS 15, jest snapshots that had header changes via `next/head` break

Question

In our tests, we had several snapshots that included content wrapped in next/head. We had previously followed the below pattern for the mock, which allowed us to see all the header tags like meta, link, title, etc in the snapshot for the component being tested.

jest.mock('next/head', () => {
    return {
        __esModule: true,
        default: ({ children }: { children: Array<ReactElement> }) => {
            return children
        }
    }
})

However, after upgrading, we see these tests fail and all the header-specific fields like meta, link, etc are all absent from the component fragment. We were testing the snapshot like the below.

const { container } = render()
expect(container).toMatchSnapshot()

No matter how we update the mock, we're unable to get the header tags to appear in the component fragment snapshot.

GotDibbs · Accepted Answer · 2025-11-10 14:22:04Z

0

It turns out that in React 19, header components are automatically hoisted to the header itself. Accordingly, we had to update the the tests to do a diff of the header as well like the below.

const { container } = render()
expect(container).toMatchSnapshot()
expect(document.head).toMatchSnapshot('headers')

answered Nov 10 at 14:22

GotDibbs

3,1571 gold badge25 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

When upgrading to React 19 and NextJS 15, jest snapshots that had header changes via `next/head` break

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related