facebook/react

TestUtils.Simulate.click doesn't bubble to window or document

ken210 opened this issue · 1 comments

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!

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.