JSPM

react-trigger-change

1.0.2
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 12715
  • Score
    100M100P100Q130694F
  • License MIT

Trigger React's synthetic change events on input, textarea and select elements

Package Exports

  • react-trigger-change

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-trigger-change) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-trigger-change

Library for triggering React's synthetic change events on input, textarea and select elements.

In production builds of React ReactTestUtils.Simulate doesn't work because of dead code elimination. There is no other built-in way to dispatch synthetic change events.

This module is a hack and is tightly coupled with React's implementation details. Not intended for production use. Useful for end-to-end testing and debugging.

Install

With npm:

npm install react-trigger-change --save-dev

From a CDN:

<script src="https://unpkg.com/react-trigger-change/dist/react-trigger-change.js"></script>

Use

reactTriggerChange(DOMElement);

DOMElement - native DOM element, will be the target of change event.

One way to obtain a DOM element in React is to use ref attribute:

let node;
ReactDOM.render(
  <input
    onChange={() => console.log('changed')}
    ref={(input) => { node = input; }}
  />,
  mountNode
);

reactTriggerChange(node); // 'changed' is logged

Test

Build the browser bundle:

npm install
npm run build

Open test/test.html in the browser. Specify React version with a query string, for example:

?version=15.4.2 for React v15.4.2
?version=16.0.0-alpha.6&min=1 for minified React v16.0.0-alpha.6