facebook / react

The library for web and native user interfaces.

Home Page:https://react.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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

ken210 opened this issue · 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.