47 lines
1.4 KiB
React
47 lines
1.4 KiB
React
import React from 'react'
|
|
import { hydrateRoot } from 'react-dom/client'
|
|
import { renderToString } from 'react-dom/server'
|
|
import { afterEach, describe, expect, it, vi } from 'vitest'
|
|
|
|
vi.mock('../../artwork/ArtworkGallery', () => ({
|
|
default: () => <div data-testid="mock-artwork-gallery" />,
|
|
}))
|
|
|
|
import TabArtworks from './TabArtworks'
|
|
|
|
describe('TabArtworks SSR hydration formatting', () => {
|
|
afterEach(() => {
|
|
vi.restoreAllMocks()
|
|
})
|
|
|
|
it('hydrates formatted artwork statistics without recoverable mismatches', async () => {
|
|
vi.stubGlobal('fetch', vi.fn(async () => ({ ok: false })))
|
|
const props = {
|
|
artworks: [],
|
|
featuredArtworks: [{
|
|
id: 1,
|
|
name: 'Featured artwork',
|
|
views: 9529106,
|
|
likes: 1216,
|
|
downloads: 12,
|
|
}],
|
|
username: 'alice',
|
|
galleryUrl: '/@alice/artworks',
|
|
}
|
|
const container = document.createElement('div')
|
|
container.innerHTML = renderToString(<TabArtworks {...props} />)
|
|
document.body.appendChild(container)
|
|
const recoverableErrors = []
|
|
|
|
hydrateRoot(container, <TabArtworks {...props} />, {
|
|
onRecoverableError: (error) => recoverableErrors.push(error),
|
|
})
|
|
|
|
await new Promise((resolve) => setTimeout(resolve, 0))
|
|
|
|
expect(recoverableErrors).toHaveLength(0)
|
|
expect(container.textContent).toContain('9,529,106')
|
|
expect(container.textContent).toContain('1,216')
|
|
})
|
|
})
|