Improve support for email fields (#526)

* Improve support for keyboard template insert in email (and other input types) fields.
* Improve initial popup rendering when auto sync is running.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "briskine",
-  "version": "7.11.2",
+  "version": "7.11.3",
   "description": "Write everything faster.",
   "private": true,
   "type": "module",

src/content/autocomplete.js

@@ -86,7 +86,14 @@ export function getSelectedWord (params) {
         break
     }
   } else {
-    beforeSelection = params.element.value.substring(0, params.element.selectionEnd)
+    // selectionEnd property applies only to inputs of types text, search, URL, tel, and password.
+    // returns null while accessing selectionEnd property on non-text input elements (e.g., email).
+    // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/selectionEnd
+    if (params.element.selectionEnd !== null) {
+      beforeSelection = params.element.value.substring(0, params.element.selectionEnd)
+    } else {
+      beforeSelection = params.element.value
+    }
   }
 
   // all regular and special whitespace chars we want to find.
@@ -102,7 +109,7 @@ export function getSelectedWord (params) {
   ]
 
   // will return -1 from lastIndexOf,
-  // if no whitespace is preset before the word.
+  // if no whitespace is present before the word.
   const lastWhitespace = Math.max(...spaces.map((char) => beforeSelection.lastIndexOf(char)))
 
   // first character is one index away from the last whitespace

src/content/editors/editor-textarea.js

@@ -26,8 +26,14 @@ export function insertTextareaTemplate (params = {}) {
 
   params.element.value = textfieldValue.substr(0, wordStart) + content + textfieldValue.substr(params.word.end)
 
-  // set focus at the end of the added template
-  params.element.setSelectionRange(cursorOffset, cursorOffset)
+  // set focus at the end of the added template.
+  // only supported on inputs of types text, search, URL, tel and password.
+  // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange
+  try {
+    params.element.setSelectionRange(cursorOffset, cursorOffset)
+  } catch (err) {
+    // probably unsupported input type
+  }
 
   // trigger multiple change events,
   // for frameworks and scripts to notice changes to the editable fields.