From ab63f028eb672e46cbd8ef21cdfdac5110546a06 Mon Sep 17 00:00:00 2001
From: Jeremy Schomery <jeremy.schomery@yahoo.com>
Date: Sun, 14 May 2017 15:56:51 +0430
Subject: [PATCH] a few Firefox related compatibility fixes

---
 backup/fileSaveLoad.js | 12 ++++++++----
 dom.js                 |  7 +++++--
 edit.js                |  5 +++--
 popup.css              |  4 +++-
 4 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/backup/fileSaveLoad.js b/backup/fileSaveLoad.js
index 0051ff2e..23ab0de5 100644
--- a/backup/fileSaveLoad.js
+++ b/backup/fileSaveLoad.js
@@ -321,14 +321,18 @@ Object.assign(document.body, {
     }
   },
   ondragend(event) {
-    animateElement(this, {className: 'fadeout'}).then(() => {
+    animateElement(this, {className: 'fadeout', removeExtraClasses: ['dropzone']}).then(() => {
       this.style.animationDuration = '';
-      this.classList.remove('dropzone');
     });
   },
   ondragleave(event) {
-    // Chrome sets screen coords to 0 on Escape key pressed or mouse out of document bounds
-    if (!event.screenX && !event.screenX) {
+    try {
+      // in Firefox event.target could be XUL browser and hence there is no permission to access it
+      if (event.target === this) {
+        this.ondragend();
+      }
+    }
+    catch (e) {
       this.ondragend();
     }
   },
diff --git a/dom.js b/dom.js
index d2475415..598cd3f8 100644
--- a/dom.js
+++ b/dom.js
@@ -34,11 +34,14 @@ function scrollElementIntoView(element) {
 }
 
 
-function animateElement(element, {className, remove = false}) {
+function animateElement(element, {className, removeExtraClasses = [], remove = false}) {
   return new Promise(resolve => {
     element.addEventListener('animationend', function _() {
       element.removeEventListener('animationend', _);
-      element.classList.remove(className);
+      element.classList.remove(
+        className,
+        ...removeExtraClasses // In Firefox, `resolve()` might be called one frame later. This is helpful to clean-up on the same frame
+      );
       // TODO: investigate why animation restarts if the elements is removed in .then()
       if (remove) {
         element.remove();
diff --git a/edit.js b/edit.js
index b9575c18..7603c7f6 100644
--- a/edit.js
+++ b/edit.js
@@ -1872,7 +1872,7 @@ function getComputedHeight(el) {
 
 function getCodeMirrorThemes() {
 	if (!chrome.runtime.getPackageDirectoryEntry) {
-		const themes = Promise.resolve([
+		const themes = [
 			chrome.i18n.getMessage('defaultTheme'),
 			'3024-day',
 			'3024-night',
@@ -1922,8 +1922,9 @@ function getCodeMirrorThemes() {
 			'xq-light',
 			'yeti',
 			'zenburn',
-		]);
+		];
 		localStorage.codeMirrorThemes = themes.join(' ');
+		return Promise.resolve(themes);
 	}
 	return new Promise(resolve => {
 		chrome.runtime.getPackageDirectoryEntry(rootDir => {
diff --git a/popup.css b/popup.css
index 529a544f..9124fa3e 100644
--- a/popup.css
+++ b/popup.css
@@ -4,6 +4,9 @@ body {
   font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
   margin: 0;
 }
+.firefox body {
+  background-color: #fff;
+}
 
 body > div:not(#installed) {
   margin-left: 0.75em;
@@ -119,7 +122,6 @@ body.blocked > DIV {
 
 .entry .main-controls {
   display: flex;
-  flex: 1;
   width: calc(100% - 20px);
   align-items: center;
 }