diff --git a/package-lock.json b/package-lock.json index b4997cd..5bb2faf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@github/file-attachment-element", - "version": "2.0.1", + "version": "3.0.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@github/file-attachment-element", - "version": "2.0.1", + "version": "3.0.0", "license": "MIT", "devDependencies": { "@github/prettier-config": "0.0.4", diff --git a/package.json b/package.json index 12de877..0db9814 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@github/file-attachment-element", - "version": "2.0.1", + "version": "3.0.0", "description": "Attach files via drag and drop or file input.", "main": "dist/index.umd.js", "module": "dist/index.js", diff --git a/src/attachment.ts b/src/attachment.ts index 892c2cb..1c8c6ab 100644 --- a/src/attachment.ts +++ b/src/attachment.ts @@ -43,6 +43,10 @@ export default class Attachment { return ['image/gif', 'image/png', 'image/jpg', 'image/jpeg'].indexOf(this.file.type) > -1 } + isVideo(): boolean { + return ['video/mp4', 'video/quicktime'].indexOf(this.file.type) > -1 + } + saving(percent: number): void { if (this.state !== 'pending' && this.state !== 'saving') { throw new Error(`Unexpected transition from ${this.state} to saving`) diff --git a/src/file-attachment-element.ts b/src/file-attachment-element.ts index 119b027..286b0af 100644 --- a/src/file-attachment-element.ts +++ b/src/file-attachment-element.ts @@ -73,6 +73,7 @@ function onDragenter(event: DragEvent) { if (dragging) { clearTimeout(dragging) } + dragging = window.setTimeout(() => target.removeAttribute('hover'), 200) const transfer = event.dataTransfer @@ -81,7 +82,6 @@ function onDragenter(event: DragEvent) { transfer.dropEffect = 'copy' target.setAttribute('hover', '') - event.stopPropagation() event.preventDefault() } diff --git a/test/test.js b/test/test.js index 411092c..1b27583 100644 --- a/test/test.js +++ b/test/test.js @@ -39,6 +39,24 @@ describe('file-attachment', function () { assert(attachment.isImage()) }) + it('detects mp4 video types', function () { + const file = new File(['hubot'], 'test.mp4', {type: 'video/mp4'}) + const attachment = new Attachment(file) + assert(attachment.isVideo()) + }) + + it('detects quicktime video types', function () { + const file = new File(['hubot'], 'test.mov', {type: 'video/quicktime'}) + const attachment = new Attachment(file) + assert(attachment.isVideo()) + }) + + it('detects non video types', function () { + const file = new File(['hubot'], 'test.txt', {type: 'text/plain'}) + const attachment = new Attachment(file) + assert(!attachment.isVideo()) + }) + it('transitions through save states', function () { const file = new File(['hubot'], 'test.txt', {type: 'text/plain'}) const attachment = new Attachment(file) @@ -124,6 +142,36 @@ describe('file-attachment', function () { assert.equal('test.png', event.detail.attachments[0].file.name) assert.equal(0, input.files.length) }) + + it('bubbles the dragenter event after cancelling its default behavior', async function () { + const dataTransfer = new DataTransfer() + const file = new File(['hubot'], 'test.txt', {type: 'text/plain'}) + dataTransfer.items.add(file) + + const dragEvent = new DragEvent('dragenter', {bubbles: true, cancelable: true, dataTransfer}) + + const listener = once('dragenter') + input.dispatchEvent(dragEvent) + + const event = await listener + assert.equal(dragEvent, event) + assert.equal(true, event.defaultPrevented) + }) + + it('bubbles the dragover event after cancelling its default behavior', async function () { + const dataTransfer = new DataTransfer() + const file = new File(['hubot'], 'test.txt', {type: 'text/plain'}) + dataTransfer.items.add(file) + + const dragEvent = new DragEvent('dragover', {bubbles: true, cancelable: true, dataTransfer}) + + const listener = once('dragover') + input.dispatchEvent(dragEvent) + + const event = await listener + assert.equal(dragEvent, event) + assert.equal(true, event.defaultPrevented) + }) }) })