File tree 1 file changed +25
-1
lines changed
1 file changed +25
-1
lines changed Original file line number Diff line number Diff line change 1
1
import * as React from 'react'
2
2
import ReactDOM from 'react-dom'
3
- import { render , screen } from '../'
3
+ import ReactDOMServer from 'react-dom/server'
4
+ import { fireEvent , render , screen } from '../'
4
5
5
6
test ( 'renders div into document' , ( ) => {
6
7
const ref = React . createRef ( )
@@ -134,3 +135,26 @@ test('can be called multiple times on the same container', () => {
134
135
135
136
expect ( container ) . toBeEmptyDOMElement ( )
136
137
} )
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
+ } )
You can’t perform that action at this time.
0 commit comments