Skip to content

Commit 447a85e

Browse files
committed
test: Expected behavior for hydration
1 parent 9185e4c commit 447a85e

File tree

1 file changed

+25
-1
lines changed

1 file changed

+25
-1
lines changed

src/__tests__/render.js

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import * as React from 'react'
22
import ReactDOM from 'react-dom'
3-
import {render, screen} from '../'
3+
import ReactDOMServer from 'react-dom/server'
4+
import {fireEvent, render, screen} from '../'
45

56
test('renders div into document', () => {
67
const ref = React.createRef()
@@ -134,3 +135,26 @@ test('can be called multiple times on the same container', () => {
134135

135136
expect(container).toBeEmptyDOMElement()
136137
})
138+
139+
test('hydrate will make the UI interactive', () => {
140+
function App() {
141+
const [clicked, handleClick] = React.useReducer(n => n + 1, 0)
142+
143+
return (
144+
<button type="button" onClick={handleClick}>
145+
clicked:{clicked}
146+
</button>
147+
)
148+
}
149+
const ui = <App />
150+
const container = document.createElement('div')
151+
document.body.appendChild(container)
152+
container.innerHTML = ReactDOMServer.renderToString(ui)
153+
154+
expect(container).toHaveTextContent('clicked:0')
155+
156+
render(ui, {container, hydrate: true})
157+
fireEvent.click(container.querySelector('button'))
158+
159+
expect(container).toHaveTextContent('clicked:1')
160+
})

0 commit comments

Comments
 (0)