TestUtils.Simulate.click doesn't bubble to window or document
ken210 opened this issue · comments
Ken Rosaka commented
Possibly a dupe of #4766
test:
import React from "react";
import TestUtils from "react-addons-test-utils";
class TestElement extends React.Component {
render() {
return (
<div onClick={() => {
console.log('clicked on div!');
}}>
<button onClick={() => {
console.log('clicked on button!');
}}>Click me</button>
</div>
);
}
}
describe('Foo', () => {
it('bar', () => {
var element = TestUtils.renderIntoDocument(
<TestElement />
);
window.addEventListener('click', () => {
console.log('click on window');
});
document.addEventListener('click', () => {
console.log('click on document');
});
var button = TestUtils.findRenderedDOMComponentWithTag(element, 'button');
TestUtils.Simulate.click(button);
});
});
Logs:
clicked on button!
clicked on div!
The thing is: both window
and document
click handlers are never called.
Am I doing something wrong in here?
Thanks in advance!
Sophie Alpert commented
Simulate only simulates an event within React's event system. You should use an ordinary .dispatchEvent
or similar if you want to create and dispatch a real browser event.