react-event-listener - npm Package Compare versions

Comparing version 0.0.2 to 0.1.0

package.json

 {
   "name": "react-event-listener",
-  "version": "0.0.2",
-  "description": "A React mixin that enable components to bind events",
-  "main": "index.js",
+  "version": "0.1.0",
+  "description": "A React component that allow to bind events on the global scope",
+  "main": "lib/index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "clean": "rimraf lib",
+    "prebuild": "npm run lint && npm run clean",
+    "build": "babel src --out-dir lib",
+    "lint": "eslint src",
+    "pretest:cov": "npm run lint",
+    "pretest": "npm run lint",
+    "test:cov": "babel-node ./node_modules/.bin/isparta cover --report lcov _mocha -- $npm_package_config_mocha",
+    "test:watch": "npm test -- --watch",
+    "test": "mocha $npm_package_config_mocha"
   },
+  "config": {
+    "mocha": "--compilers js:babel-core/register ./src/**/__tests__/*.spec.js --require ./src/__tests__/setup.js"
+  },
   "repository": {
@@ -24,3 +35,23 @@ "type": "git",
     "url": "https://github.com/oliviertassinari/react-event-listener/issues"
+  },
+  "devDependencies": {
+    "babel-cli": "^6.4.5",
+    "babel-core": "^6.4.5",
+    "babel-eslint": "^4.1.3",
+    "babel-preset-es2015": "^6.3.13",
+    "babel-preset-react": "^6.3.13",
+    "babel-preset-stage-1": "^6.3.13",
+    "codeclimate-test-reporter": "^0.3.0",
+    "eslint": "^1.7.3",
+    "eslint-plugin-react": "^3.6.3",
+    "expect": "^1.12.2",
+    "isparta": "^4.0.0",
+    "istanbul": "^0.4.0",
+    "jsdom": "^7.0.2",
+    "mocha": "^2.3.3",
+    "react": "^0.14.1",
+    "react-addons-test-utils": "^0.14.1",
+    "react-dom": "^0.14.1",
+    "rimraf": "^2.4.3"
   }
 }

README.md

@@ -1,12 +0,16 @@
-# React-Event-Listener [![npm version](https://badge.fury.io/js/react-event-listener.svg)](http://badge.fury.io/js/react-event-listener)
+# React event listener
 
-> A React mixin that enable components to bind events
+> A React component that allow to bind events on the global scope.
 
+[![npm version](https://img.shields.io/npm/v/react-event-listener.svg?style=flat-square)](https://www.npmjs.com/package/react-event-listener)
+[![npm downloads](https://img.shields.io/npm/dm/react-event-listener.svg?style=flat-square)](https://www.npmjs.com/package/react-event-listener)
+[![Build Status](https://travis-ci.org/oliviertassinari/react-event-listener.svg?branch=master)](https://travis-ci.org/oliviertassinari/react-event-listener)
 
+[![Dependencies](https://img.shields.io/david/oliviertassinari/react-event-listener.svg?style=flat-square)](https://david-dm.org/oliviertassinari/react-event-listener)
+[![DevDependencies](https://img.shields.io/david/dev/oliviertassinari/react-event-listener.svg?style=flat-square)](https://david-dm.org/oliviertassinari/react-event-listener#info=devDependencies&view=list)
+
 ## Getting Started
 
-Install via [npm](http://npmjs.org/react-event-listener)
-
 ```sh
-npm install react-event-listener --save-dev
+npm install react-event-listener
 ```
@@ -17,27 +21,43 @@
 ```js
-var React = require('react');
-var EventListener = require('react-event-listener');
+import React from 'react';
+import EventListener from 'react-event-listener';
 
-React.createClass({
-  mixins: [EventListener],
-  listeners: {
-    window: {
-      resize: 'onResize',
-    },
-    document: {
-      mousemove: 'onMouseMove',
-    },
-  },
-  onResize: function() {
-    // the variable this refers to the window object
-  },
-  onMouseMove: function() {
-    // the variable this refers to the document object
-  },
-});
+class MyComponent extends React.Component {
+  handleResize = () => {
+    console.log('resize');
+  };
 
+  handleMouseMove = () => {
+    console.log('mousemove');
+  };
+
+  render() {
+    return (
+      <div>
+        <EventListener elementName="document" onMouseMove={this.handleMouseMove} />
+        <EventListener elementName="window" onResize={this.handleResize} />
+      </div>
+    );
+  }
+}
 ```
 
+### Note on Testing
+
+In [this](https://github.com/facebook/react/issues/5043) issue from React, `TestUtils.Simulate.` methods won't bubble up to `window` or `document`. As a result, you must use [`document.dispatchEvent`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent) or simulate event using [native DOM api](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click).
+
+See our [test cases](https://github.com/oliviertassinari/react-event-listener/blob/master/src/__tests__/index.spec.js) for more information.
+
+
+## Contributing
+
+1. Fork it
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create new Pull Request
+
+
 ## License
 
 MIT

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

42517

increased by1495.38%

Number of package files

13

increased by333.33%

Lines of code

93

increased by132.5%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

63

increased by46.51%

Worsened metrics

Dev dependency count

18

increased byInfinity%

Number of downloads

340831

decreased by-1.31%

No dependency changes