Fix drag-n-drop files from Chrome's download bar

closes #6850
- HTML5 drag-n-drop has some weird inconsistencies around the `dragOver` event where it defaults the "drop" behaviour to nothing so you need to cancel the defaults and override
	- http://stackoverflow.com/questions/19526430/drag-and-drop-file-uploads-from-chrome-downloads-bar

ghost/admin/app/components/gh-file-uploader.js

@@ -55,7 +55,18 @@ export default Component.extend({
     }),
 
     dragOver(event) {
+        if (!event.dataTransfer) {
+            return;
+        }
+
+        // this is needed to work around inconsistencies with dropping files
+        // from Chrome's downloads bar
+        let eA = event.dataTransfer.effectAllowed;
+        event.dataTransfer.dropEffect = (eA === 'move' || eA === 'linkMove') ? 'move' : 'copy';
+
+        event.stopPropagation();
         event.preventDefault();
+
         this.set('dragClass', '--drag-over');
     },
 

ghost/admin/app/components/gh-image-uploader.js

@@ -72,6 +72,16 @@ export default Component.extend({
     dragOver(event) {
         let showUploadForm = this.get('showUploadForm');
 
+        if (!event.dataTransfer) {
+            return;
+        }
+
+        // this is needed to work around inconsistencies with dropping files
+        // from Chrome's downloads bar
+        let eA = event.dataTransfer.effectAllowed;
+        event.dataTransfer.dropEffect = (eA === 'move' || eA === 'linkMove') ? 'move' : 'copy';
+
+        event.stopPropagation();
         event.preventDefault();
 
         if (showUploadForm) {

ghost/admin/tests/integration/components/gh-file-uploader-test.js

@@ -78,7 +78,12 @@ describeComponent(
             this.render(hbs`{{gh-file-uploader}}`);
 
             run(() => {
-                this.$('.gh-image-uploader').trigger('dragover');
+                let dragover = Ember.$.Event('dragover', {
+                    dataTransfer: {
+                        files: []
+                    }
+                });
+                this.$('.gh-image-uploader').trigger(dragover);
             });
 
             expect(this.$('.gh-image-uploader').hasClass('--drag-over'), 'has drag-over class').to.be.true;

ghost/admin/tests/integration/components/gh-image-uploader-test.js

@@ -120,7 +120,7 @@ describeComponent(
             expect(formChanged.secondCall.args[0]).to.equal('upload');
         });
 
-        describe('file uploads', function () {
+        describe('file upload form', function () {
             it('renders form with supplied text', function () {
                 this.render(hbs`{{gh-image-uploader image=image text="text test"}}`);
                 expect(this.$('.description').text().trim()).to.equal('text test');
@@ -161,7 +161,12 @@ describeComponent(
                 this.render(hbs`{{gh-image-uploader image=image update=(action update)}}`);
 
                 run(() => {
-                    this.$('.gh-image-uploader').trigger('dragover');
+                    let dragover = Ember.$.Event('dragover', {
+                        dataTransfer: {
+                            files: []
+                        }
+                    });
+                    this.$('.gh-image-uploader').trigger(dragover);
                 });
 
                 expect(this.$('.gh-image-uploader').hasClass('--drag-over'), 'has drag-over class').to.be.true;
@@ -174,7 +179,7 @@ describeComponent(
             });
         });
 
-        describe('URL input', function () {
+        describe('URL input form', function () {
             beforeEach(function () {
                 this.set('configService.fileStorage', false);
             });