Skip to content

Commit

Permalink
Change dragover to dragenter
Browse files Browse the repository at this point in the history
Dragenter is fired only once when the drag first touches the page, whereas dragover fires continuously.

As we’re only toggling the visbility of the dropzone, dragenter will suffice for our needs.
  • Loading branch information
querkmachine authored and romaricpascal committed Jan 9, 2025
1 parent 5458829 commit e7e996e
Showing 1 changed file with 8 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@ export class FileUpload extends GOVUKFrontendComponent {
this.$wrapper.addEventListener('drop', this.onDragLeaveOrDrop.bind(this))

// When a file is dragged over the page (or dragged off the page)
document.addEventListener('dragover', this.onDragOver.bind(this))
document.addEventListener('dragenter', this.onDragEnter.bind(this))
document.addEventListener('dragleave', this.onDragLeaveOrDrop.bind(this))
}

Expand Down Expand Up @@ -176,8 +176,14 @@ export class FileUpload extends GOVUKFrontendComponent {
/**
* When a file is dragged over the container, show a visual indicator that a
* file can be dropped here.
*
* @param {DragEvent} event - the drag event
*/
onDragOver() {
onDragEnter(event) {
// Check if the thing being dragged is a file (and not text or something
// else), we only want to indicate files.
console.log(event)

// eslint-disable-next-line
// @ts-ignore
this.$wrapper.classList.add('govuk-file-upload-wrapper--show-dropzone')
Expand Down

0 comments on commit e7e996e

Please sign in to comment.