1
1
import ReactDOM from 'react-dom'
2
- import { Simulate } from 'react-dom/test-utils'
3
2
import { getQueriesForElement , prettyDOM , fireEvent } from 'dom-testing-library'
4
3
5
4
const mountedContainers = new Set ( )
@@ -67,6 +66,25 @@ fireEvent.change = function reactChange(node, init) {
67
66
return originalChange ( node , init )
68
67
}
69
68
69
+ // probably there is a better way to get access to a component instance
70
+ const [
71
+ getInstanceFromNode ,
72
+ ] = ReactDOM . __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED . Events
73
+ const createReactEventSimulator = eventName => ( node , init ) => {
74
+ const propName = `on${ eventName . charAt ( 0 ) . toUpperCase ( ) } ${ eventName . slice ( 1 ) } `
75
+ const simulate = getInstanceFromNode ( node ) . memoizedProps [ propName ]
76
+
77
+ if ( init && init . target && init . target . hasOwnProperty ( 'value' ) ) {
78
+ setNativeValue ( node , init . target . value )
79
+ }
80
+
81
+ return simulate ( {
82
+ target : node ,
83
+ type : eventName ,
84
+ ...init ,
85
+ } )
86
+ }
87
+
70
88
// function written after some investigation here:
71
89
// https://github.com/facebook/react/issues/10135#issuecomment-401496776
72
90
function setNativeValue ( element , value ) {
@@ -88,9 +106,7 @@ function setNativeValue(element, value) {
88
106
// fallback to synthetic events for React events that the DOM doesn't support
89
107
const syntheticEvents = [ 'select' , 'mouseEnter' , 'mouseLeave' ]
90
108
syntheticEvents . forEach ( eventName => {
91
- document . addEventListener ( eventName . toLowerCase ( ) , e => {
92
- Simulate [ eventName ] ( e . target , e )
93
- } )
109
+ fireEvent [ eventName ] = createReactEventSimulator ( eventName )
94
110
} )
95
111
96
112
// just re-export everything from dom-testing-library
0 commit comments