react-dropzone 5.0.0 → 5.1.1

package/.eslintignore

@@ -0,0 +1,3 @@
+dist/
+coverage/
+typings/*

package/.eslintrc

@@ -1,24 +1,8 @@
 {
-  "extends": [
-    "okonet",
-    "prettier"
-  ],
-  "plugins": [
-    "prettier"
-  ],
+  "extends": ["okonet/node"],
   "rules": {
-    // React
-    "react/forbid-prop-types": [
-      2,
-      {
-        "forbid": [
-          "any",
-          "array"
-        ]
-      }
-    ],
-    "react/require-default-props": 0,
-
+    "strict": 0,
+    "node/no-unpublished-require": 0,
     // Import
     "import/no-extraneous-dependencies": [
       2,
@@ -26,6 +10,7 @@
         "devDependencies": [
           "webpack*.js",
           "**/*.spec.js",
+          "**/*.config.js",
           "**/testSetup.js"
         ]
       }

package/.travis.yml

@@ -6,8 +6,7 @@ node_js:
   - '8'
 after_success:
   - 'bash <(curl -s https://codecov.io/bash)'
-  - yarn global add travis-deploy-once
-  - travis-deploy-once "yarn global add semantic-release@13 && semantic-release"
+  - npx semantic-release
 branches:
   except:
     - /^v\d+\.\d+\.\d+$/

package/README.md

@@ -92,6 +92,37 @@ See https://react-dropzone.netlify.com/#proptypes
 
 *Important*: `react-dropzone` doesn't manage dropped files. You need to destroy the object URL yourself whenever you don't need the `preview` by calling `window.URL.revokeObjectURL(file.preview);` to avoid memory leaks.
 
+### Testing
+
+*Important*: `react-dropzone` makes its drag'n'drop callbacks asynchronous to enable promise based getDataTransfer functions. In order to properly test this, you may want to utilize a helper function to run all promises like this:
+```js
+const flushPromises = () => new Promise(resolve => setImmediate(resolve));
+```
+
+Example with enzyme 3:
+```js
+
+it('tests drag state', async () => {
+  const flushPromises = () => new Promise(resolve => setImmediate(resolve));
+  const DummyChildComponent = () => null
+  const dropzone = mount(
+    <Dropzone>{props => <DummyChildComponent {...props} />}</Dropzone>
+  )
+  dropzone.simulate('dragEnter', {
+    dataTransfer: { files: files.concat(images) }
+  })
+  await flushPromises(dropzone)
+  dropzone.update()
+  
+  const child = updatedDropzone.find(DummyChildComponent)
+  expect(child).toHaveProp('isDragActive', true)
+  expect(child).toHaveProp('isDragAccept', false)
+  expect(child).toHaveProp('isDragReject', true)
+})
+```
+
+Remember to update your mounted component before asserting any props. A complete example for this can be found in `react-dropzone`s own test suite.
+
 ## Support
 
 ### Backers

package/dist/es/index.js

@@ -12,6 +12,7 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
+/* global process */
 /* eslint prefer-template: 0 */
 
 import React from 'react';
@@ -73,7 +74,9 @@ var Dropzone = function (_React$Component) {
         document.addEventListener('dragover', onDocumentDragOver, false);
         document.addEventListener('drop', this.onDocumentDrop, false);
       }
-      this.fileInputEl.addEventListener('click', this.onInputElementClick, false);
+      if (this.fileInputEl != null) {
+        this.fileInputEl.addEventListener('click', this.onInputElementClick, false);
+      }
       window.addEventListener('focus', this.onFileDialogCancel, false);
     }
   }, {
@@ -128,6 +131,8 @@ var Dropzone = function (_React$Component) {
         this.dragTargets.push(evt.target);
       }
 
+      evt.persist();
+
       Promise.resolve(this.props.getDataTransferItems(evt)).then(function (draggedFiles) {
         _this2.setState({
           isDragActive: true, // Do not rely on files for the drag state. It doesn't work in Safari.
@@ -201,6 +206,9 @@ var Dropzone = function (_React$Component) {
 
       evt.preventDefault();
 
+      // Persist event for later usage
+      evt.persist();
+
       // Reset the counter along with the drag on a drop.
       this.dragTargets = [];
       this.isFileDialogActive = false;
@@ -253,6 +261,11 @@ var Dropzone = function (_React$Component) {
         if (acceptedFiles.length > 0 && onDropAccepted) {
           onDropAccepted.call(_this4, acceptedFiles, evt);
         }
+
+        // Update `acceptedFiles` and `rejectedFiles` state
+        // This will make children render functions receive the appropriate
+        // values
+        _this4.setState({ acceptedFiles: acceptedFiles, rejectedFiles: rejectedFiles });
       });
     }
   }, {
@@ -431,6 +444,7 @@ var Dropzone = function (_React$Component) {
       }
 
       // Destructure custom props away from props used for the div element
+      /* eslint-disable no-unused-vars */
 
       var acceptedFiles = props.acceptedFiles,
           preventDropOnDocument = props.preventDropOnDocument,
@@ -443,13 +457,19 @@ var Dropzone = function (_React$Component) {
           minSize = props.minSize,
           getDataTransferItems = props.getDataTransferItems,
           divProps = _objectWithoutProperties(props, ['acceptedFiles', 'preventDropOnDocument', 'disablePreview', 'disableClick', 'onDropAccepted', 'onDropRejected', 'onFileDialogCancel', 'maxSize', 'minSize', 'getDataTransferItems']);
+      /* eslint-enable no-unused-vars */
+
+      /* eslint-disable jsx-a11y/no-static-element-interactions */
+      /* eslint-disable jsx-a11y/click-events-have-key-events */
+
 
       return React.createElement(
         'div',
         _extends({
           className: className,
           style: appliedStyle
-        }, divProps /* expand user provided props first so event handlers are never overridden */, {
+        }, divProps /* expand user provided props first so event handlers are never overridden */
+        , {
           onClick: this.composeHandlers(this.onClick),
           onDragStart: this.composeHandlers(this.onDragStart),
           onDragEnter: this.composeHandlers(this.onDragEnter),
@@ -460,7 +480,8 @@ var Dropzone = function (_React$Component) {
           'aria-disabled': disabled
         }),
         this.renderChildren(children, isDragActive, isDragAccept, isDragReject),
-        React.createElement('input', _extends({}, inputProps /* expand user provided inputProps first so inputAttributes override them */, inputAttributes))
+        React.createElement('input', _extends({}, inputProps /* expand user provided inputProps first so inputAttributes override them */
+        , inputAttributes))
       );
     }
   }]);