react-dropzone - npm Package Compare versions

Comparing version 6.2.3 to 6.2.4

dist/es/index.js

@@ -119,2 +119,3 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
     value: function onDragStart(evt) {
+      evt.persist();
       if (this.props.onDragStart && isDragDataWithFiles(evt)) {
@@ -140,2 +141,6 @@ this.props.onDragStart.call(this, evt);
         Promise.resolve(this.props.getDataTransferItems(evt)).then(function (draggedFiles) {
+          if (evt.isPropagationStopped()) {
+            return;
+          }
+
           _this2.setState({
@@ -158,3 +163,4 @@ draggedFiles: draggedFiles,
       evt.preventDefault();
-      evt.stopPropagation();
+      evt.persist();
+
       try {
@@ -181,2 +187,3 @@ // The file dialog on Chrome allows users to drag files from the dialog onto
       evt.preventDefault();
+      evt.persist();
 
@@ -240,2 +247,6 @@ // Only deactivate once the dropzone and all children have been left.
 
+          if (evt.isPropagationStopped()) {
+            return;
+          }
+
           fileList.forEach(function (file) {
@@ -242,0 +253,0 @@ if (!disablePreview) {

package.json

@@ -146,3 +146,3 @@ {
   },
-  "version": "6.2.3",
+  "version": "6.2.4",
   "engines": {
@@ -149,0 +149,0 @@ "node": ">= 6"

src/index.js

@@ -88,2 +88,3 @@ /* eslint prefer-template: 0 */
   onDragStart(evt) {
+    evt.persist()
     if (this.props.onDragStart && isDragDataWithFiles(evt)) {
@@ -106,2 +107,6 @@ this.props.onDragStart.call(this, evt)
       Promise.resolve(this.props.getDataTransferItems(evt)).then(draggedFiles => {
+        if (evt.isPropagationStopped()) {
+          return
+        }
+
         this.setState({
@@ -123,3 +128,4 @@ draggedFiles,
     evt.preventDefault()
-    evt.stopPropagation()
+    evt.persist()
+
     try {
@@ -143,2 +149,3 @@ // The file dialog on Chrome allows users to drag files from the dialog onto
     evt.preventDefault()
+    evt.persist()
 
@@ -197,2 +204,6 @@ // Only deactivate once the dropzone and all children have been left.
 
+        if (evt.isPropagationStopped()) {
+          return
+        }
+
         fileList.forEach(file => {
@@ -199,0 +210,0 @@ if (!disablePreview) {

src/index.spec.js

@@ -30,3 +30,3 @@ /* eslint jsx-a11y/click-events-have-key-events: 0 */
 
-const createDtWithFiles = files => {
+const createDtWithFiles = (files = []) => {
   return {
@@ -388,2 +388,3 @@ dataTransfer: {
       const eventProxy = {
+        persist() {},
         preventDefault() {},
@@ -795,2 +796,3 @@ stopPropagation() {},
       preventDefault() {},
+      isPropagationStopped: () => false,
       persist() {}
@@ -1244,2 +1246,43 @@ }
       })
+
+      it('does not invoke any drag event cbs on parent if child stopped event propagation', async () => {
+        const parentProps = {
+          onDragEnter: jest.fn(),
+          onDragOver: jest.fn(),
+          onDragLeave: jest.fn(),
+          onDrop: jest.fn()
+        }
+
+        const InnerDropzone = () => (
+          <Dropzone
+            onDragEnter={evt => evt.stopPropagation()}
+            onDragOver={evt => evt.stopPropagation()}
+            onDragLeave={evt => evt.stopPropagation()}
+            onDrop={(accepted, rejected, evt) => evt.stopPropagation()}
+          />
+        )
+
+        const outerDropzone = mount(
+          <Dropzone {...parentProps}>
+            <InnerDropzone />
+          </Dropzone>
+        )
+
+        outerDropzone.find(InnerDropzone).simulate('dragEnter', createDtWithFiles())
+        await flushPromises(outerDropzone)
+
+        outerDropzone.find(InnerDropzone).simulate('dragOver', createDtWithFiles())
+        await flushPromises(outerDropzone)
+
+        outerDropzone.find(InnerDropzone).simulate('dragLeave', createDtWithFiles())
+        await flushPromises(outerDropzone)
+
+        outerDropzone.find(InnerDropzone).simulate('drop', createDtWithFiles(images))
+        await flushPromises(outerDropzone)
+
+        expect(parentProps.onDragEnter).not.toHaveBeenCalled()
+        expect(parentProps.onDragOver).not.toHaveBeenCalled()
+        expect(parentProps.onDragLeave).not.toHaveBeenCalled()
+        expect(parentProps.onDrop).not.toHaveBeenCalled()
+      })
     })
@@ -1246,0 +1289,0 @@ })

styleguide.config.js

@@ -41,2 +41,6 @@ /* eslint import/no-extraneous-dependencies: 0 */
         {
+          name: 'Nested Dropzone',
+          content: 'examples/Nesting/Readme.md'
+        },
+        {
           name: 'Opening File Dialog Programmatically',
@@ -43,0 +47,0 @@ content: 'examples/FileDialog/Readme.md'

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

Improved metrics

Total package byte prevSize

232483

increased by2.16%

Number of package files

45

increased by2.27%

Lines of code

3718

increased by1.53%

Published versions last week

2

increased byInfinity%

No dependency changes