@inboxsdk/core 0.2.28-alpha.5 → 0.2.28

package/src/platform-implementation-js/dom-driver/gmail/views/gmail-compose-view.js

@@ -1,90 +1,151 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _autoHtml = _interopRequireDefault(require("auto-html"));
-var _transducers = _interopRequireDefault(require("transducers.js"));
-var _once = _interopRequireDefault(require("lodash/once"));
-var _escape = _interopRequireDefault(require("lodash/escape"));
-var _includes = _interopRequireDefault(require("lodash/includes"));
-var _constant = _interopRequireDefault(require("lodash/constant"));
-var _find = _interopRequireDefault(require("lodash/find"));
-var _asap = _interopRequireDefault(require("asap"));
-var _pdelay = _interopRequireDefault(require("pdelay"));
-var Kefir = _interopRequireWildcard(require("kefir"));
-var ud = _interopRequireWildcard(require("ud"));
-var _closestNg = _interopRequireDefault(require("closest-ng"));
-var _kefirBus = _interopRequireDefault(require("kefir-bus"));
-var _kefirStopper = _interopRequireDefault(require("kefir-stopper"));
-var _delayAsap = _interopRequireDefault(require("../../../lib/delay-asap"));
-var _simulateMouseEvent = require("../../../lib/dom/simulate-mouse-event");
-var _simulateKey = _interopRequireDefault(require("../../../lib/dom/simulate-key"));
-var _querySelectorOrFail = _interopRequireDefault(require("../../../lib/dom/querySelectorOrFail"));
-var _isElementVisible = _interopRequireDefault(require("../../../../common/isElementVisible"));
-var _makeElementChildStream = _interopRequireDefault(require("../../../lib/dom/make-element-child-stream"));
-var _simulateDragAndDrop = require("../../../lib/dom/simulate-drag-and-drop");
-var GmailResponseProcessor = _interopRequireWildcard(require("../gmail-response-processor"));
-var _gmailElementGetter = _interopRequireDefault(require("../gmail-element-getter"));
-var _setCss = _interopRequireDefault(require("../../../lib/dom/set-css"));
-var _waitFor = _interopRequireDefault(require("../../../lib/wait-for"));
-var _streamWaitFor = _interopRequireDefault(require("../../../lib/stream-wait-for"));
-var _makeMutationObserverChunkedStream = _interopRequireDefault(require("../../../lib/dom/make-mutation-observer-chunked-stream"));
-var _handleComposeLinkChips = _interopRequireDefault(require("../../../lib/handle-compose-link-chips"));
-var _insertLinkChipIntoBody = _interopRequireDefault(require("../../../lib/insert-link-chip-into-body"));
-var _addComposeNotice = _interopRequireDefault(require("./gmail-compose-view/add-compose-notice"));
-var _addStatusBar = _interopRequireDefault(require("./gmail-compose-view/add-status-bar"));
-var _insertHtmlAtCursor = _interopRequireDefault(require("../../../lib/dom/insert-html-at-cursor"));
-var _ensureGroupingIsOpen = _interopRequireDefault(require("./gmail-compose-view/ensure-grouping-is-open"));
-var _ensureAppButtonToolbarsAreClosed = _interopRequireDefault(require("./gmail-compose-view/ensure-app-button-toolbars-are-closed"));
-var _sizeFixer = _interopRequireDefault(require("./gmail-compose-view/size-fixer"));
-var _addTooltipToButton = _interopRequireDefault(require("./gmail-compose-view/add-tooltip-to-button"));
-var _addRecipientRow = _interopRequireDefault(require("./gmail-compose-view/add-recipient-row"));
-var _addButton = _interopRequireDefault(require("./gmail-compose-view/add-button"));
-var _setRecipients = _interopRequireDefault(require("./gmail-compose-view/set-recipients"));
-var _focus = _interopRequireDefault(require("./gmail-compose-view/focus"));
-var _monitorSelectionRange = _interopRequireDefault(require("./gmail-compose-view/monitor-selection-range"));
-var _manageButtonGrouping = _interopRequireDefault(require("./gmail-compose-view/manage-button-grouping"));
-var _getSelection = require("../../../lib/dom/get-selection");
-var _getMinimizedStream = _interopRequireDefault(require("./gmail-compose-view/get-minimized-stream"));
-var _censorHTMLstring = _interopRequireDefault(require("../../../../common/censorHTMLstring"));
-var _insertLinkIntoBody = _interopRequireDefault(require("./gmail-compose-view/insert-link-into-body"));
-var _getAddressChangesStream = _interopRequireDefault(require("./gmail-compose-view/get-address-changes-stream"));
-var _getBodyChangesStream = _interopRequireDefault(require("./gmail-compose-view/get-body-changes-stream"));
-var _getRecipients = _interopRequireDefault(require("./gmail-compose-view/get-recipients"));
-var _getResponseTypeChangesStream = _interopRequireDefault(require("./gmail-compose-view/get-response-type-changes-stream"));
-var _getPresendingStream = _interopRequireDefault(require("../../../driver-common/compose/getPresendingStream"));
-var _getDiscardStream = _interopRequireDefault(require("../../../driver-common/compose/getDiscardStream"));
-var _updateInsertMoreAreaLeft = _interopRequireDefault(require("./gmail-compose-view/update-insert-more-area-left"));
-var _setupLinkPopovers = _interopRequireDefault(require("./gmail-compose-view/setupLinkPopovers"));
-var _getFormattingAreaOffsetLeft = _interopRequireDefault(require("./gmail-compose-view/get-formatting-area-offset-left"));
-var _overrideEditSubject = _interopRequireDefault(require("./gmail-compose-view/override-edit-subject"));
-var _detectClassicRecipientsArea = _interopRequireDefault(require("./gmail-compose-view/detectClassicRecipientsArea"));
-var _censorHTMLtree = _interopRequireDefault(require("../../../../common/censorHTMLtree"));
-var _pageParser = require("./gmail-compose-view/page-parser");
-var _pageParserTree = _interopRequireDefault(require("page-parser-tree"));
-var _tagTree = require("tag-tree");
-var fromManager = _interopRequireWildcard(require("./gmail-compose-view/from-manager"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/* @flow */
+
+import autoHtml from 'auto-html';
+import t from 'transducers.js';
+import once from 'lodash/once';
+import escape from 'lodash/escape';
+import includes from 'lodash/includes';
+import constant from 'lodash/constant';
+import find from 'lodash/find';
+import asap from 'asap';
+import delay from 'pdelay';
+import * as Kefir from 'kefir';
+import * as ud from 'ud';
+import closest from 'closest-ng';
+import kefirBus from 'kefir-bus';
+import type { Bus } from 'kefir-bus';
+import kefirStopper from 'kefir-stopper';
+import type { Stopper } from 'kefir-stopper';
+
+import delayAsap from '../../../lib/delay-asap';
+import { simulateClick } from '../../../lib/dom/simulate-mouse-event';
+import simulateKey from '../../../lib/dom/simulate-key';
+import querySelector from '../../../lib/dom/querySelectorOrFail';
+import isElementVisible from '../../../../common/isElementVisible';
+import makeElementChildStream from '../../../lib/dom/make-element-child-stream';
+import {
+  simulateDragOver,
+  simulateDrop,
+  simulateDragEnd,
+} from '../../../lib/dom/simulate-drag-and-drop';
+import * as GmailResponseProcessor from '../gmail-response-processor';
+import GmailElementGetter from '../gmail-element-getter';
+import setCss from '../../../lib/dom/set-css';
+
+import waitFor from '../../../lib/wait-for';
+import streamWaitFor from '../../../lib/stream-wait-for';
+import makeMutationObserverChunkedStream from '../../../lib/dom/make-mutation-observer-chunked-stream';
+import handleComposeLinkChips from '../../../lib/handle-compose-link-chips';
+import insertLinkChipIntoBody from '../../../lib/insert-link-chip-into-body';
+import addComposeNotice from './gmail-compose-view/add-compose-notice';
+import addStatusBar from './gmail-compose-view/add-status-bar';
+import insertHTMLatCursor from '../../../lib/dom/insert-html-at-cursor';
+import ensureGroupingIsOpen from './gmail-compose-view/ensure-grouping-is-open';
+import ensureAppButtonToolbarsAreClosed from './gmail-compose-view/ensure-app-button-toolbars-are-closed';
+import sizeFixer from './gmail-compose-view/size-fixer';
+import addTooltipToButton from './gmail-compose-view/add-tooltip-to-button';
+import addRecipientRow from './gmail-compose-view/add-recipient-row';
+import addButton from './gmail-compose-view/add-button';
+import setRecipients from './gmail-compose-view/set-recipients';
+import focus from './gmail-compose-view/focus';
 // import addOuterSidebar from './gmail-compose-view/add-outer-sidebar';
+import monitorSelectionRange from './gmail-compose-view/monitor-selection-range';
+import manageButtonGrouping from './gmail-compose-view/manage-button-grouping';
+import type { TooltipDescriptor } from '../../../views/compose-button-view';
+import {
+  getSelectedHTMLInElement,
+  getSelectedTextInElement,
+} from '../../../lib/dom/get-selection';
+import getMinimizedStream from './gmail-compose-view/get-minimized-stream';
+import censorHTMLstring from '../../../../common/censorHTMLstring';
+
+import insertLinkIntoBody from './gmail-compose-view/insert-link-into-body';
+import getAddressChangesStream from './gmail-compose-view/get-address-changes-stream';
+import getBodyChangesStream from './gmail-compose-view/get-body-changes-stream';
+import getRecipients from './gmail-compose-view/get-recipients';
+import getResponseTypeChangesStream from './gmail-compose-view/get-response-type-changes-stream';
+import getPresendingStream from '../../../driver-common/compose/getPresendingStream';
+import getDiscardStream from '../../../driver-common/compose/getDiscardStream';
+import updateInsertMoreAreaLeft from './gmail-compose-view/update-insert-more-area-left';
+import setupLinkPopOvers from './gmail-compose-view/setupLinkPopovers';
+import getFormattingAreaOffsetLeft from './gmail-compose-view/get-formatting-area-offset-left';
+import overrideEditSubject from './gmail-compose-view/override-edit-subject';
+import detectClassicRecipientsArea from './gmail-compose-view/detectClassicRecipientsArea';
+import censorHTMLtree from '../../../../common/censorHTMLtree';
+import {
+  makePageParser,
+  getRecipientRowElements,
+} from './gmail-compose-view/page-parser';
+import PageParserTree from 'page-parser-tree';
+import { TagTree } from 'tag-tree';
+
+import * as fromManager from './gmail-compose-view/from-manager';
+
+import type {
+  ComposeNotice,
+  ComposeViewDriver,
+  StatusBar,
+} from '../../../driver-interfaces/compose-view-driver';
+import type Logger from '../../../lib/logger';
+import type GmailDriver from '../gmail-driver';
+
 let hasReportedMissingBody = false;
+
 class GmailComposeView {
-  // Set only after the message is sent.
+  _element: HTMLElement;
+  _seenBodyElement: HTMLElement;
+  _isInlineReplyForm: boolean;
+  _isFullscreen: boolean;
+  _isStandalone: boolean;
+  _emailWasSent: boolean;
+  _driver: GmailDriver;
+  _managedViewControllers: Array<{ destroy(): void }>;
+  _eventStream: Bus<any>;
+  _isTriggeringADraftSavePending: boolean;
+  _buttonViewControllerTooltipMap: WeakMap<Object, Object>;
+  _composeID: string;
+  _messageIDElement: HTMLInputElement;
+  _messageId: ?string;
+  _finalMessageId: ?string; // Set only after the message is sent.
+  _initialMessageId: ?string;
+  _targetMessageID: ?string;
+  _draftSaving: boolean;
+  _draftIDpromise: ?Promise<?string>;
+  _threadID: ?string;
+  _stopper: Stopper;
+  _lastSelectionRange: ?Range;
+  _requestModifiers: {
+    [key: string]: (composeParams: { body: string }) =>
+      | { body: string }
+      | Promise<{ body: string }>,
+  };
+  _isListeningToAjaxInterceptStream: boolean;
+  _formattingArea: ?HTMLElement;
+  _closedProgrammatically: boolean = false;
+  _destroyed: boolean = false;
+  _removedFromDOMStopper: Stopper;
+  _hasSetupLinkPopOvers: boolean = false;
+  _page: PageParserTree;
+  tagTree: TagTree<HTMLElement>;
+  ready: () => Kefir.Observable<GmailComposeView>;
 
-  constructor(element, xhrInterceptorStream, driver, options) {
-    (0, _defineProperty2.default)(this, "_closedProgrammatically", false);
-    (0, _defineProperty2.default)(this, "_destroyed", false);
-    (0, _defineProperty2.default)(this, "_hasSetupLinkPopOvers", false);
-    this;
+  constructor(
+    element: HTMLElement,
+    xhrInterceptorStream: Kefir.Observable<*>,
+    driver: GmailDriver,
+    options: {
+      isInlineReplyForm: boolean,
+      isStandalone: boolean,
+    }
+  ) {
+    (this: ComposeViewDriver);
     this._element = element;
     this._element.classList.add('inboxsdk__compose');
+
     if (options.isInlineReplyForm) {
       this._element.classList.add('inboxsdk__compose_inlineReply');
     }
+
     this._isInlineReplyForm = options.isInlineReplyForm;
     this._isStandalone = options.isStandalone;
     this._isFullscreen = false;
@@ -94,64 +155,69 @@ class GmailComposeView {
     this._draftSaving = false;
     this._draftIDpromise = null;
     this._driver = driver;
-    this._stopper = (0, _kefirStopper.default)();
+    this._stopper = kefirStopper();
     this._managedViewControllers = [];
     this._requestModifiers = {};
     this._isListeningToAjaxInterceptStream = false;
-    this._eventStream = (0, _kefirBus.default)();
-    this._removedFromDOMStopper = (0, _kefirStopper.default)();
+
+    this._eventStream = kefirBus();
+    this._removedFromDOMStopper = kefirStopper();
+
     this._isTriggeringADraftSavePending = false;
-    this._page = (0, _pageParser.makePageParser)(element, driver.getLogger());
+
+    this._page = makePageParser(element, driver.getLogger());
     this.tagTree = this._page.tree;
+
     let saveAndSendStream;
     if (this._driver.isUsingSyncAPI()) {
       saveAndSendStream = xhrInterceptorStream
-      // we know _getDraftIDfromForm will work because by the time we're
-      // getting an ajax event Gmail's JS has generated an ID and added it to the DOM.
-      .filter(event => event.draftID === this._getDraftIDfromForm()).map(event => {
-        switch (event.type) {
-          case 'emailSending':
-            {
-              return {
-                eventName: 'sending'
-              };
+        // we know _getDraftIDfromForm will work because by the time we're
+        // getting an ajax event Gmail's JS has generated an ID and added it to the DOM.
+        .filter((event) => event.draftID === this._getDraftIDfromForm())
+        .map((event) => {
+          switch (event.type) {
+            case 'emailSending': {
+              return { eventName: 'sending' };
             }
-          case 'emailSent':
-            {
+            case 'emailSent': {
               let syncThreadID = event.threadID;
               let syncMessageID = event.messageID;
+
               if (event.oldMessageID) this._messageId = event.oldMessageID;
               if (event.oldThreadID) this._threadID = event.oldThreadID;
+
               driver.removeCachedGmailMessageIdForSyncMessageId(syncMessageID);
               driver.removeCachedOldGmailThreadIdFromSyncThreadId(syncThreadID);
+
               return {
                 eventName: 'sent',
                 data: {
-                  getThreadID: (0, _once.default)(async () => {
+                  getThreadID: once(async (): Promise<string> => {
                     if (event.oldThreadID) {
                       return event.oldThreadID;
                     }
-                    return await driver.getOldGmailThreadIdFromSyncThreadId(syncThreadID);
+                    return await driver.getOldGmailThreadIdFromSyncThreadId(
+                      syncThreadID
+                    );
                   }),
-                  getMessageID: (0, _once.default)(async () => {
+                  getMessageID: once(async (): Promise<string> => {
                     if (event.oldMessageID) {
                       return event.oldMessageID;
                     }
-                    return await driver.getGmailMessageIdForSyncMessageId(syncMessageID);
-                  })
-                }
+                    return await driver.getGmailMessageIdForSyncMessageId(
+                      syncMessageID
+                    );
+                  }),
+                },
               };
             }
-          case 'emailSendFailed':
-            {
-              return {
-                eventName: 'sendCanceled'
-              };
+            case 'emailSendFailed': {
+              return { eventName: 'sendCanceled' };
             }
-          case 'emailDraftReceived':
-            {
+            case 'emailDraftReceived': {
               this._messageId = event.oldMessageID;
               this._threadID = event.oldThreadID;
+
               return {
                 eventName: 'draftSaved',
                 data: {
@@ -160,32 +226,31 @@ class GmailComposeView {
                   },
                   getMessageID() {
                     return Promise.resolve(event.oldMessageID);
-                  }
-                }
+                  },
+                },
               };
             }
-          default:
-            {
+            default: {
               return null;
             }
-        }
-      }).filter(Boolean);
+          }
+        })
+        .filter(Boolean);
     } else {
-      saveAndSendStream = xhrInterceptorStream.filter(event => event.composeId === this.getComposeID()).map(event => {
-        switch (event.type) {
-          case 'emailSending':
-            {
-              return [{
-                eventName: 'sending'
-              }];
+      saveAndSendStream = xhrInterceptorStream
+        .filter((event) => event.composeId === this.getComposeID())
+        .map((event) => {
+          switch (event.type) {
+            case 'emailSending': {
+              return [{ eventName: 'sending' }];
             }
-          case 'emailSent':
-            {
-              const response = GmailResponseProcessor.interpretSentEmailResponse(event.response);
-              if ((0, _includes.default)(['tr', 'eu'], response.messageID)) {
-                return [{
-                  eventName: 'sendCanceled'
-                }];
+            case 'emailSent': {
+              const response =
+                GmailResponseProcessor.interpretSentEmailResponse(
+                  event.response
+                );
+              if (includes(['tr', 'eu'], response.messageID)) {
+                return [{ eventName: 'sendCanceled' }];
               }
               this._emailWasSent = true;
               if (response.messageID) {
@@ -193,49 +258,56 @@ class GmailComposeView {
               }
               this._messageId = null;
               const data = {
-                getThreadID: () => Promise.resolve(response.threadID),
-                getMessageID: () => Promise.resolve(response.messageID)
+                getThreadID: (): Promise<string> =>
+                  Promise.resolve(response.threadID),
+                getMessageID: (): Promise<string> =>
+                  Promise.resolve(response.messageID),
               };
-              ['threadID', 'gmailThreadId'].forEach(prop => {
+              ['threadID', 'gmailThreadId'].forEach((prop) => {
                 // These properties are nonenumerable.
-                Object.defineProperty(data, prop, {
+                Object.defineProperty((data: any), prop, {
                   get: () => {
-                    this._driver.getLogger().deprecationWarning(`composeView sent event.${prop}`, 'composeView sent event.getThreadID()');
+                    this._driver
+                      .getLogger()
+                      .deprecationWarning(
+                        `composeView sent event.${prop}`,
+                        'composeView sent event.getThreadID()'
+                      );
                     return response.threadID;
-                  }
+                  },
                 });
               });
-              ['messageID', 'gmailMessageId'].forEach(prop => {
-                Object.defineProperty(data, prop, {
+              ['messageID', 'gmailMessageId'].forEach((prop) => {
+                Object.defineProperty((data: any), prop, {
                   get: () => {
-                    this._driver.getLogger().deprecationWarning(`composeView sent event.${prop}`, 'composeView sent event.getMessageID()');
+                    this._driver
+                      .getLogger()
+                      .deprecationWarning(
+                        `composeView sent event.${prop}`,
+                        'composeView sent event.getMessageID()'
+                      );
                     return response.messageID;
-                  }
+                  },
                 });
               });
-              return [{
-                eventName: 'sent',
-                data
-              }];
+              return [{ eventName: 'sent', data }];
             }
-          case 'emailDraftSaveSending':
-            {
+            case 'emailDraftSaveSending': {
               this._draftSaving = true;
-              return [{
-                eventName: 'draftSaving'
-              }];
+              return [{ eventName: 'draftSaving' }];
             }
-          case 'emailDraftReceived':
-            {
+            case 'emailDraftReceived': {
               this._draftSaving = false;
               let response;
               try {
-                response = GmailResponseProcessor.interpretSentEmailResponse(event.response);
+                response = GmailResponseProcessor.interpretSentEmailResponse(
+                  event.response
+                );
               } catch (err) {
                 if (this._driver.getAppId() === 'sdk_streak_21e9788951') {
                   this._driver.getLogger().error(err, {
                     connectionDetails: event.connectionDetails,
-                    response: event.response
+                    response: event.response,
                   });
                   throw err;
                 } else {
@@ -245,102 +317,158 @@ class GmailComposeView {
               if (response.messageID === 'eu') {
                 return []; // save was canceled
               }
-
-              const events = [{
-                eventName: 'draftSaved',
-                data: response
-              }];
+              const events = [{ eventName: 'draftSaved', data: response }];
               if (!response.messageID) {
-                this._driver.getLogger().error(new Error('Missing message id from emailDraftReceived'));
-              } else if (response.messageID && this._messageId !== response.messageID) {
+                this._driver
+                  .getLogger()
+                  .error(
+                    new Error('Missing message id from emailDraftReceived')
+                  );
+              } else if (
+                response.messageID &&
+                this._messageId !== response.messageID
+              ) {
                 if (/^[0-9a-f]+$/i.test(response.messageID)) {
                   this._messageId = response.messageID;
                   events.push({
                     eventName: 'messageIDChange',
-                    data: this._messageId
+                    data: this._messageId,
                   });
                 } else {
-                  this._driver.getLogger().error(new Error('Invalid message id from emailDraftReceived'), {
-                    value: response.messageID
-                  });
+                  this._driver
+                    .getLogger()
+                    .error(
+                      new Error('Invalid message id from emailDraftReceived'),
+                      {
+                        value: response.messageID,
+                      }
+                    );
                 }
               }
               return events;
             }
-          default:
-            return [];
-        }
-      }).flatten().map(event => {
-        if (this._driver.getLogger().shouldTrackEverything()) {
-          driver.getLogger().eventSite('compose.debug.xhr', {
-            eventName: event.eventName
-          });
-        }
-        return event;
-      });
+            default:
+              return [];
+          }
+        })
+        .flatten()
+        .map((event) => {
+          if (this._driver.getLogger().shouldTrackEverything()) {
+            driver
+              .getLogger()
+              .eventSite('compose.debug.xhr', { eventName: event.eventName });
+          }
+
+          return event;
+        });
     }
-    this._eventStream.plug(Kefir.merge([saveAndSendStream, Kefir.fromEvents(this._element, 'buttonAdded').map(() => {
-      return {
-        eventName: 'buttonAdded'
-      };
-    }), Kefir.fromEvents(this._element, 'resize').map(() => ({
-      eventName: 'resize'
-    })), Kefir.fromEvents(this._element, 'composeFullscreenStateChanged').map(() => {
-      this._updateComposeFullscreenState();
-      return {
-        eventName: 'fullscreenChanged',
-        data: {
-          fullscreen: this._isFullscreen
-        }
-      };
-    })]));
-    Kefir.fromEvents(this._element, 'closedProgrammatically').takeUntilBy(this._stopper).onValue(() => {
-      this._closedProgrammatically = true;
-    });
+
+    this._eventStream.plug(
+      Kefir.merge([
+        saveAndSendStream,
+
+        Kefir.fromEvents(this._element, 'buttonAdded').map(() => {
+          return {
+            eventName: 'buttonAdded',
+          };
+        }),
+
+        Kefir.fromEvents(this._element, 'resize').map(() => ({
+          eventName: 'resize',
+        })),
+
+        Kefir.fromEvents(this._element, 'composeFullscreenStateChanged').map(
+          () => {
+            this._updateComposeFullscreenState();
+            return {
+              eventName: 'fullscreenChanged',
+              data: { fullscreen: this._isFullscreen },
+            };
+          }
+        ),
+      ])
+    );
+
+    Kefir.fromEvents(this._element, 'closedProgrammatically')
+      .takeUntilBy(this._stopper)
+      .onValue(() => {
+        this._closedProgrammatically = true;
+      });
+
     this._buttonViewControllerTooltipMap = new WeakMap();
+
     const initialBodyElement = this.getMaybeBodyElement();
-    this.ready = (0, _constant.default)((initialBodyElement ? Kefir.constant(initialBodyElement) : (0, _streamWaitFor.default)(() => this.getMaybeBodyElement(), 3 * 60 * 1000 //timeout
-    )).takeUntilBy(this._stopper).map(bodyElement => {
-      this._seenBodyElement = bodyElement;
-      this._composeID = this._element.querySelector('input[name="composeid"]').value;
-      this._messageIDElement = this._element.querySelector('input[name="draft"]');
-      if (!this._messageIDElement) {
-        driver.getLogger().error(new Error('Could not find compose message id field'));
-        // stub so other things don't fail
-        this._messageIDElement = document.createElement('input');
-      }
-      this._setupIDs();
-      this._setupStreams();
-      this._setupConsistencyCheckers();
-      this._updateComposeFullscreenState();
-      {
-        // try and handle the case where the user types in a bad email address
-        // we get the presending event but then no other events will pass because
-        // a modal comes up informing the user of the bad email address
-        this.getEventStream().filter(_ref => {
-          let {
-            eventName
-          } = _ref;
-          return eventName === 'presending';
-        }).takeUntilBy(this._stopper).onValue(() => {
-          (0, _makeElementChildStream.default)(document.body).map(event => event.el).filter(node => node.getAttribute && node.getAttribute('role') === 'alertdialog').takeUntilBy(Kefir.merge([this.getEventStream().filter(_ref2 => {
-            let {
-              eventName
-            } = _ref2;
-            return eventName === 'sendCanceled' || eventName === 'sending';
-          }), Kefir.later(15)])).onValue(() => {
-            this._eventStream.emit({
-              eventName: 'sendCanceled'
-            });
-          });
-        });
-      }
-      return this;
-    }).toProperty());
-    this.ready().onError(errorObject => {
+    this.ready = constant(
+      (initialBodyElement
+        ? Kefir.constant(initialBodyElement)
+        : streamWaitFor(
+            () => this.getMaybeBodyElement(),
+            3 * 60 * 1000 //timeout
+          )
+      )
+        .takeUntilBy(this._stopper)
+        .map((bodyElement) => {
+          this._seenBodyElement = bodyElement;
+
+          this._composeID = ((this._element.querySelector(
+            'input[name="composeid"]'
+          ): any): HTMLInputElement).value;
+          this._messageIDElement = (this._element.querySelector(
+            'input[name="draft"]'
+          ): any);
+          if (!this._messageIDElement) {
+            driver
+              .getLogger()
+              .error(new Error('Could not find compose message id field'));
+            // stub so other things don't fail
+            this._messageIDElement = document.createElement('input');
+          }
+
+          this._setupIDs();
+          this._setupStreams();
+          this._setupConsistencyCheckers();
+          this._updateComposeFullscreenState();
+
+          {
+            // try and handle the case where the user types in a bad email address
+            // we get the presending event but then no other events will pass because
+            // a modal comes up informing the user of the bad email address
+            this.getEventStream()
+              .filter(({ eventName }) => eventName === 'presending')
+              .takeUntilBy(this._stopper)
+              .onValue(() => {
+                makeElementChildStream(((document.body: any): HTMLElement))
+                  .map((event) => event.el)
+                  .filter(
+                    (node) =>
+                      node.getAttribute &&
+                      node.getAttribute('role') === 'alertdialog'
+                  )
+                  .takeUntilBy(
+                    Kefir.merge([
+                      this.getEventStream().filter(
+                        ({ eventName }) =>
+                          eventName === 'sendCanceled' ||
+                          eventName === 'sending'
+                      ),
+                      Kefir.later(15),
+                    ])
+                  )
+                  .onValue(() => {
+                    this._eventStream.emit({ eventName: 'sendCanceled' });
+                  });
+              });
+          }
+
+          return this;
+        })
+        .toProperty()
+    );
+
+    this.ready().onError((errorObject) => {
       driver.getLogger().error(errorObject, {
         hasForm: !!this.getElement().querySelector('form'),
-        class: this.getElement().getAttribute('class')
+        class: this.getElement().getAttribute('class'),
       });
     });
 
@@ -349,48 +477,52 @@ class GmailComposeView {
     // send to come back, so we have to handle that difference
     if (this._driver.isUsingSyncAPI()) {
       Kefir.merge([
-      // if we get a presending then we let the other stream wait for
-      // sent. But if we get a sendCanceled, then a regular destroy can
-      // pass through
-      this._removedFromDOMStopper.filterBy(this._eventStream.filter(_ref3 => {
-        let {
-          eventName
-        } = _ref3;
-        return eventName === 'presending' || eventName === 'sendCanceled';
-      }).map(_ref4 => {
-        let {
-          eventName
-        } = _ref4;
-        return eventName === 'sendCanceled';
-      }).toProperty(() => true)), Kefir.combine([this._removedFromDOMStopper, this._eventStream.filter(_ref5 => {
-        let {
-          eventName
-        } = _ref5;
-        return eventName === 'sent';
-      })])]).take(1)
-      // we delay asap here so that the event stream is not destroyed before listeners here the sent event
-      .flatMap(() => (0, _delayAsap.default)(null)).onValue(() => this._destroy());
+        // if we get a presending then we let the other stream wait for
+        // sent. But if we get a sendCanceled, then a regular destroy can
+        // pass through
+        this._removedFromDOMStopper.filterBy(
+          this._eventStream
+            .filter(
+              ({ eventName }) =>
+                eventName === 'presending' || eventName === 'sendCanceled'
+            )
+            .map(({ eventName }) => eventName === 'sendCanceled')
+            .toProperty(() => true)
+        ),
+
+        Kefir.combine([
+          this._removedFromDOMStopper,
+          this._eventStream.filter(({ eventName }) => eventName === 'sent'),
+        ]),
+      ])
+        .take(1)
+        // we delay asap here so that the event stream is not destroyed before listeners here the sent event
+        .flatMap(() => delayAsap(null))
+        .onValue(() => this._destroy());
     } else {
       this._removedFromDOMStopper.onValue(() => this._destroy());
     }
-    (0, _detectClassicRecipientsArea.default)();
+
+    detectClassicRecipientsArea();
   }
+
   destroy() {
     // this gets called when the element gets removed from the DOM
     // however we don't want to pass through that destroy event right away
     this._removedFromDOMStopper.destroy();
     this._page.dump();
   }
+
   _destroy() {
     this._eventStream.emit({
       eventName: 'destroy',
       data: {
         messageID: this.getMessageID(),
-        closedByInboxSDK: this._closedProgrammatically
-      }
+        closedByInboxSDK: this._closedProgrammatically,
+      },
     });
     this._eventStream.end();
-    this._managedViewControllers.forEach(vc => {
+    this._managedViewControllers.forEach((vc) => {
       vc.destroy();
     });
     this._requestModifiers = {};
@@ -398,103 +530,155 @@ class GmailComposeView {
     this._stopper.destroy();
     this._destroyed = true;
   }
-  getStopper() {
+
+  getStopper(): Kefir.Observable<null> {
     return this._stopper;
   }
-  getEventStream() {
+
+  getEventStream(): Kefir.Observable<Object> {
     return this._eventStream;
   }
-  getGmailDriver() {
+
+  getGmailDriver(): GmailDriver {
     return this._driver;
   }
-  isDestroyed() {
+
+  isDestroyed(): boolean {
     return this._destroyed;
   }
+
   _setupStreams() {
-    this._eventStream.plug((0, _getAddressChangesStream.default)(this));
-    this._eventStream.plug((0, _getBodyChangesStream.default)(this));
-    this._eventStream.plug((0, _getResponseTypeChangesStream.default)(this));
-    this._eventStream.plug((0, _getPresendingStream.default)({
-      element: this.getElement(),
-      sendButton: this.getSendButton(),
-      sendAndArchive: this.getSendAndArchiveButton()
-    }));
+    this._eventStream.plug(getAddressChangesStream(this));
+    this._eventStream.plug(getBodyChangesStream(this));
+    this._eventStream.plug(getResponseTypeChangesStream(this));
+    this._eventStream.plug(
+      getPresendingStream({
+        element: this.getElement(),
+        sendButton: this.getSendButton(),
+        sendAndArchive: this.getSendAndArchiveButton(),
+      })
+    );
+
     let discardButton;
     try {
       discardButton = this.getDiscardButton();
     } catch (err) {
       // handle failures of this.getDiscardButton()
-      this._driver.getLogger().errorSite(new Error('Failed to find discard button'), {
-        html: (0, _censorHTMLstring.default)(this._element.outerHTML)
-      });
+      this._driver
+        .getLogger()
+        .errorSite(new Error('Failed to find discard button'), {
+          html: censorHTMLstring(this._element.outerHTML),
+        });
     }
     if (discardButton) {
-      this._eventStream.plug((0, _getDiscardStream.default)({
-        element: this.getElement(),
-        discardButton
-      }));
+      this._eventStream.plug(
+        getDiscardStream({
+          element: this.getElement(),
+          discardButton,
+        })
+      );
     }
-    this._eventStream.plug(Kefir.fromEvents(this.getElement(), 'inboxSDKsendCanceled').map(() => ({
-      eventName: 'sendCanceled'
-    })));
-    this._eventStream.plug(Kefir.fromEvents(this.getElement(), 'inboxSDKdiscardCanceled').map(() => ({
-      eventName: 'discardCanceled'
-    })));
-    this._eventStream.plug(Kefir.later(10).flatMap(() => (0, _getMinimizedStream.default)(this)).changes().map(minimized => ({
-      eventName: minimized ? 'minimized' : 'restored'
-    })));
+
+    this._eventStream.plug(
+      Kefir.fromEvents(this.getElement(), 'inboxSDKsendCanceled').map(() => ({
+        eventName: 'sendCanceled',
+      }))
+    );
+
+    this._eventStream.plug(
+      Kefir.fromEvents(this.getElement(), 'inboxSDKdiscardCanceled').map(
+        () => ({ eventName: 'discardCanceled' })
+      )
+    );
+
+    this._eventStream.plug(
+      Kefir.later(10)
+        .flatMap(() => getMinimizedStream(this))
+        .changes()
+        .map((minimized) => ({
+          eventName: minimized ? 'minimized' : 'restored',
+        }))
+    );
+
     if (!this._driver.isUsingSyncAPI()) {
-      (0, _makeMutationObserverChunkedStream.default)(this._messageIDElement, {
+      makeMutationObserverChunkedStream(this._messageIDElement, {
         attributes: true,
-        attributeFilter: ['value']
-      }).takeUntilBy(this._eventStream.filter(() => false).beforeEnd(() => null)).map(() => this._getMessageIDfromForm()).filter(messageID => messageID && !this._emailWasSent && this._messageId !== messageID).onValue(messageID => {
-        this._messageId = messageID;
-        this._eventStream.emit({
-          eventName: 'messageIDChange',
-          data: this._messageId
+        attributeFilter: ['value'],
+      })
+        .takeUntilBy(
+          this._eventStream.filter(() => false).beforeEnd(() => null)
+        )
+        .map(() => this._getMessageIDfromForm())
+        .filter(
+          (messageID) =>
+            messageID && !this._emailWasSent && this._messageId !== messageID
+        )
+        .onValue((messageID) => {
+          this._messageId = messageID;
+          this._eventStream.emit({
+            eventName: 'messageIDChange',
+            data: this._messageId,
+          });
         });
-      });
     }
   }
+
   _setupConsistencyCheckers() {
     try {
-      (0, _handleComposeLinkChips.default)(this);
-      (0, _monitorSelectionRange.default)(this);
-      (0, _manageButtonGrouping.default)(this);
-      (0, _sizeFixer.default)(this._driver, this);
+      handleComposeLinkChips(this);
+      monitorSelectionRange(this);
+      manageButtonGrouping(this);
+      sizeFixer(this._driver, this);
     } catch (err) {
       this._driver.getLogger().error(err);
     }
   }
+
   _setupIDs() {
     if (this._driver.isUsingSyncAPI()) {
       const syncTargetMessageID = this._getTargetMessageID();
       if (syncTargetMessageID) {
-        this._driver.getGmailMessageIdForSyncMessageId(syncTargetMessageID).then(gmailMessageId => this._targetMessageID = gmailMessageId);
+        this._driver
+          .getGmailMessageIdForSyncMessageId(syncTargetMessageID)
+          .then((gmailMessageId) => (this._targetMessageID = gmailMessageId));
       }
+
       const syncMessageId = this._getMessageIDfromForm();
       if (syncMessageId) {
-        this._driver.getGmailMessageIdForSyncDraftId(syncMessageId).then(gmailMessageId => {
-          this._initialMessageId = gmailMessageId;
-          this._messageId = gmailMessageId;
-        }).catch(() => {
-          //do nothing because this means the message hasn't been saved yet
-        });
+        this._driver
+          .getGmailMessageIdForSyncDraftId(syncMessageId)
+          .then((gmailMessageId) => {
+            this._initialMessageId = gmailMessageId;
+            this._messageId = gmailMessageId;
+          })
+          .catch(() => {
+            //do nothing because this means the message hasn't been saved yet
+          });
+
         this._driver.reportRecentSyncDraftId(syncMessageId);
         this._stopper.onValue(() => {
           this._driver.reportDraftClosed(syncMessageId);
         });
       } else {
-        this._driver.getLogger().error(new Error('Draft is missing sync draft id'));
+        this._driver
+          .getLogger()
+          .error(new Error('Draft is missing sync draft id'));
       }
-      const legacyThreadIdElement = this._element.querySelector('input[name="lts"]');
-      if (legacyThreadIdElement && typeof legacyThreadIdElement.value === 'string') this._threadID = legacyThreadIdElement.value;
+
+      const legacyThreadIdElement: ?HTMLInputElement =
+        (this._element.querySelector('input[name="lts"]'): any);
+      if (
+        legacyThreadIdElement &&
+        typeof legacyThreadIdElement.value === 'string'
+      )
+        this._threadID = legacyThreadIdElement.value;
     } else {
       this._targetMessageID = this._getTargetMessageID();
       this._messageId = this._initialMessageId = this._getMessageIDfromForm();
       this._threadID = this._getThreadID();
     }
   }
+
   _updateComposeFullscreenState() {
     if (this._isInlineReplyForm) {
       this._isFullscreen = false;
@@ -502,7 +686,8 @@ class GmailComposeView {
       if (this._isStandalone) {
         this._isFullscreen = true;
       } else {
-        const fullScreenContainer = _gmailElementGetter.default.getFullscreenComposeWindowContainer();
+        const fullScreenContainer =
+          GmailElementGetter.getFullscreenComposeWindowContainer();
         if (!fullScreenContainer) {
           this._isFullscreen = false;
         } else {
@@ -511,305 +696,465 @@ class GmailComposeView {
       }
     }
   }
+
   focus() {
-    (0, _focus.default)(this);
+    focus(this);
   }
-  insertBodyTextAtCursor(text) {
-    return this.insertBodyHTMLAtCursor((0, _escape.default)(text).replace(/\n/g, '<br>'));
+
+  insertBodyTextAtCursor(text: string): ?HTMLElement {
+    return this.insertBodyHTMLAtCursor(escape(text).replace(/\n/g, '<br>'));
   }
-  insertBodyHTMLAtCursor(html) {
-    var retVal = (0, _insertHtmlAtCursor.default)(this.getBodyElement(), html, this.getLastSelectionRange());
+
+  insertBodyHTMLAtCursor(html: string): ?HTMLElement {
+    var retVal = insertHTMLatCursor(
+      this.getBodyElement(),
+      html,
+      this.getLastSelectionRange()
+    );
     this._triggerDraftSave();
 
     // sometimes the html inserted can be quite large, so we need ot make sure that GMail resizes the compose window
     // triggering an enter press forces Gmail to resize compose
-    (0, _simulateKey.default)(this.getBodyElement(), 13, 13);
+    simulateKey(this.getBodyElement(), 13, 13);
+
     return retVal;
   }
-  insertLinkIntoBody(text, href) {
-    var retVal = (0, _insertLinkIntoBody.default)(this, text, href);
+
+  insertLinkIntoBody(text: string, href: string): ?HTMLElement {
+    var retVal = insertLinkIntoBody(this, text, href);
+
     this._triggerDraftSave();
     return retVal;
   }
-  insertLinkChipIntoBody(options) {
-    var retVal = (0, _insertLinkChipIntoBody.default)(this, options);
+
+  insertLinkChipIntoBody(options: {
+    iconUrl?: string,
+    url: string,
+    text: string,
+  }): HTMLElement {
+    var retVal = insertLinkChipIntoBody(this, options);
     this._triggerDraftSave();
     return retVal;
   }
-  setSubject(text) {
-    this._element.querySelector('input[name=subjectbox]').value = text;
+
+  setSubject(text: string) {
+    (this._element.querySelector('input[name=subjectbox]'): any).value = text;
+
     this._triggerDraftSave();
   }
-  setBodyHTML(html) {
+
+  setBodyHTML(html: string) {
     this.getBodyElement().innerHTML = html;
+
     this._triggerDraftSave();
   }
-  setBodyText(text) {
+
+  setBodyText(text: string) {
     this.getBodyElement().textContent = text;
+
     this._triggerDraftSave();
   }
-  setToRecipients(emails) {
-    (0, _setRecipients.default)(this, 'to', emails);
+
+  setToRecipients(emails: string[]) {
+    setRecipients(this, 'to', emails);
+
     this._triggerDraftSave();
   }
-  setCcRecipients(emails) {
-    (0, _setRecipients.default)(this, 'cc', emails);
+
+  setCcRecipients(emails: string[]) {
+    setRecipients(this, 'cc', emails);
+
     this._triggerDraftSave();
   }
-  setBccRecipients(emails) {
-    (0, _setRecipients.default)(this, 'bcc', emails);
+
+  setBccRecipients(emails: string[]) {
+    setRecipients(this, 'bcc', emails);
+
     this._triggerDraftSave();
   }
-  addRecipientRow(options) {
-    return (0, _addRecipientRow.default)(this, options);
+
+  addRecipientRow(options: Kefir.Observable<?Object>): () => void {
+    return addRecipientRow(this, options);
   }
-  forceRecipientRowsOpen() {
+
+  forceRecipientRowsOpen(): () => void {
     this._element.classList.add('inboxsdk__compose_forceRecipientsOpen');
+
     return () => {
       this._element.classList.remove('inboxsdk__compose_forceRecipientsOpen');
     };
   }
-  hideNativeRecipientRows() {
-    const nativeRecipientRows = (0, _pageParser.getRecipientRowElements)(this._element);
-    nativeRecipientRows.forEach(row => {
+
+  hideNativeRecipientRows(): () => void {
+    const nativeRecipientRows = getRecipientRowElements(this._element);
+
+    nativeRecipientRows.forEach((row) => {
       row.classList.add('inboxsdk__compose_forceRecipientRowHidden');
     });
+
     return () => {
-      nativeRecipientRows.forEach(row => {
+      nativeRecipientRows.forEach((row) => {
         row.classList.remove('inboxsdk__compose_forceRecipientRowHidden');
       });
     };
   }
-  hideRecipientArea() {
+
+  hideRecipientArea(): () => void {
     this._element.classList.add('inboxsdk__compose_hideRecipientArea');
+
     return () => {
       this._element.classList.remove('inboxsdk__compose_hideRecipientArea');
     };
   }
+
   getFromContact() {
     return fromManager.getFromContact(this._driver, this);
   }
+
   getFromContactChoices() {
     return fromManager.getFromContactChoices(this._driver, this);
   }
-  setFromEmail(email) {
+
+  setFromEmail(email: string) {
     fromManager.setFromEmail(this._driver, this, email);
   }
-  addButton(buttonDescriptor, groupOrderHint, extraOnClickOptions) {
-    return (0, _addButton.default)(this, buttonDescriptor, groupOrderHint, extraOnClickOptions);
+
+  addButton(
+    buttonDescriptor: Kefir.Observable<?Object>,
+    groupOrderHint: string,
+    extraOnClickOptions: Object
+  ): Promise<?Object> {
+    return addButton(
+      this,
+      buttonDescriptor,
+      groupOrderHint,
+      extraOnClickOptions
+    );
   }
-  addTooltipToButton(buttonViewController, buttonDescriptor, tooltipDescriptor) {
-    var tooltip = (0, _addTooltipToButton.default)(this, buttonViewController, buttonDescriptor, tooltipDescriptor);
+
+  addTooltipToButton(
+    buttonViewController: Object,
+    buttonDescriptor: Object,
+    tooltipDescriptor: TooltipDescriptor
+  ) {
+    var tooltip = addTooltipToButton(
+      this,
+      buttonViewController,
+      buttonDescriptor,
+      tooltipDescriptor
+    );
     this._buttonViewControllerTooltipMap.set(buttonViewController, tooltip);
   }
-  closeButtonTooltip(buttonViewController) {
+
+  closeButtonTooltip(buttonViewController: Object) {
     if (!this._buttonViewControllerTooltipMap) {
       return;
     }
-    var tooltip = this._buttonViewControllerTooltipMap.get(buttonViewController);
+
+    var tooltip =
+      this._buttonViewControllerTooltipMap.get(buttonViewController);
     if (tooltip) {
       tooltip.destroy();
       this._buttonViewControllerTooltipMap.delete(buttonViewController);
     }
   }
-  addComposeNotice() {
-    let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    const composeNotice = (0, _addComposeNotice.default)(this, options);
-    this._element.dispatchEvent(new CustomEvent('resize', {
-      bubbles: false,
-      cancelable: false,
-      detail: null
-    }));
-    Kefir.fromEvents(composeNotice, 'destroy').flatMap(_delayAsap.default).takeUntilBy(this._stopper).onValue(() => {
-      this._element.dispatchEvent(new CustomEvent('resize', {
+
+  addComposeNotice(
+    options: {
+      orderHint?: number,
+    } = {}
+  ): ComposeNotice {
+    const composeNotice = addComposeNotice(this, options);
+
+    this._element.dispatchEvent(
+      new CustomEvent('resize', {
         bubbles: false,
         cancelable: false,
-        detail: null
-      }));
-    });
+        detail: null,
+      })
+    );
+
+    Kefir.fromEvents(composeNotice, 'destroy')
+      .flatMap(delayAsap)
+      .takeUntilBy(this._stopper)
+      .onValue(() => {
+        this._element.dispatchEvent(
+          new CustomEvent('resize', {
+            bubbles: false,
+            cancelable: false,
+            detail: null,
+          })
+        );
+      });
+
     return composeNotice;
   }
-  addStatusBar() {
-    let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    const statusBar = (0, _addStatusBar.default)(this, options);
-    this._element.dispatchEvent(new CustomEvent('resize', {
-      bubbles: false,
-      cancelable: false,
-      detail: null
-    }));
-    Kefir.fromEvents(statusBar, 'destroy').flatMap(_delayAsap.default).takeUntilBy(this._stopper).onValue(() => {
-      this._element.dispatchEvent(new CustomEvent('resize', {
+
+  addStatusBar(
+    options: {
+      height?: number,
+      orderHint?: number,
+      addAboveNativeStatusBar?: boolean,
+    } = {}
+  ): StatusBar {
+    const statusBar = addStatusBar(this, options);
+
+    this._element.dispatchEvent(
+      new CustomEvent('resize', {
         bubbles: false,
         cancelable: false,
-        detail: null
-      }));
-    });
+        detail: null,
+      })
+    );
+
+    Kefir.fromEvents(statusBar, 'destroy')
+      .flatMap(delayAsap)
+      .takeUntilBy(this._stopper)
+      .onValue(() => {
+        this._element.dispatchEvent(
+          new CustomEvent('resize', {
+            bubbles: false,
+            cancelable: false,
+            detail: null,
+          })
+        );
+      });
+
     return statusBar;
   }
-  hideNativeStatusBar() {
+
+  hideNativeStatusBar(): () => void {
     const statusArea = this.getStatusArea();
-    const nativeStatusBar = (0, _querySelectorOrFail.default)(statusArea, 'table');
+    const nativeStatusBar = querySelector(statusArea, 'table');
     const formattingToolbar = this.getFormattingToolbar();
-    const isFormattingToolbarOpen = formattingToolbar && formattingToolbar.style.display !== 'none';
+    const isFormattingToolbarOpen =
+      formattingToolbar && formattingToolbar.style.display !== 'none';
+
     nativeStatusBar.style.display = 'none';
+
     if (formattingToolbar && isFormattingToolbarOpen) {
       formattingToolbar.style.display = 'none';
     }
+
     return () => {
       nativeStatusBar.style.display = '';
+
       if (formattingToolbar && isFormattingToolbarOpen) {
         formattingToolbar.style.display = '';
       }
     };
   }
-  replaceSendButton(el) {
+
+  replaceSendButton(el: HTMLElement): () => void {
     const sendButton = this.getSendButtonGroup();
     const sendAndArchive = this.getSendAndArchiveButton();
+
     sendButton.style.display = 'none';
+
     const sendAndArchiveParent = sendAndArchive && sendAndArchive.parentElement;
     if (sendAndArchiveParent instanceof HTMLElement) {
       sendAndArchiveParent.style.display = 'none';
     }
+
     const container = document.createElement('div');
     container.classList.add('inboxsdk__compose_customSendContainer');
     container.appendChild(el);
+
     sendButton.insertAdjacentElement('afterend', container);
     this._element.setAttribute('data-inboxsdk-send-replaced', '');
-    const removalStopper = (0, _kefirStopper.default)();
-    Kefir.fromEvents(this.getBodyElement(), 'keydown').takeUntilBy(this._stopper).takeUntilBy(removalStopper).filter(domEvent => (domEvent.which === 9 || domEvent.keyCode === 9) && !domEvent.shiftKey).onValue(domEvent => {
-      // Because of the way the compose DOM is structured, the natural
-      // tab order does not flow from the compose body to the status bar.
-      // Gmail modifies this flow programatically by focusing the send button,
-      // so we have replicate this behavior when the native send button isn't
-      // visible.
-      const statusArea = this.getStatusArea();
-      const focusableEls = statusArea.querySelectorAll('[tabindex]');
-      if (focusableEls.length === 0) return;
-      const firstVisibleEl = Array.from(focusableEls).find(el => el.offsetParent !== null);
-      if (!firstVisibleEl) return;
-      domEvent.preventDefault();
-      domEvent.stopPropagation();
-      domEvent.stopImmediatePropagation();
-      firstVisibleEl.focus();
-    });
+
+    const removalStopper = kefirStopper();
+
+    Kefir.fromEvents(this.getBodyElement(), 'keydown')
+      .takeUntilBy(this._stopper)
+      .takeUntilBy(removalStopper)
+      .filter(
+        (domEvent) =>
+          (domEvent.which === 9 || domEvent.keyCode === 9) && !domEvent.shiftKey
+      )
+      .onValue((domEvent) => {
+        // Because of the way the compose DOM is structured, the natural
+        // tab order does not flow from the compose body to the status bar.
+        // Gmail modifies this flow programatically by focusing the send button,
+        // so we have replicate this behavior when the native send button isn't
+        // visible.
+        const statusArea = this.getStatusArea();
+        const focusableEls = statusArea.querySelectorAll('[tabindex]');
+        if (focusableEls.length === 0) return;
+
+        const firstVisibleEl = Array.from(focusableEls).find(
+          (el) => el.offsetParent !== null
+        );
+        if (!firstVisibleEl) return;
+
+        domEvent.preventDefault();
+        domEvent.stopPropagation();
+        domEvent.stopImmediatePropagation();
+
+        firstVisibleEl.focus();
+      });
+
     return () => {
       removalStopper.destroy();
       container.remove();
       this._element.removeAttribute('data-inboxsdk-send-replaced');
+
       sendButton.style.display = '';
       if (sendAndArchiveParent instanceof HTMLElement) {
         sendAndArchiveParent.style.display = '';
       }
     };
   }
-  hideDiscardButton() {
+
+  hideDiscardButton(): () => void {
     const discardBtn = this.getDiscardButton();
+
     discardBtn.style.display = 'none';
+
     return () => {
       discardBtn.style.display = '';
     };
   }
+
   ensureFormattingToolbarIsHidden() {
     const formattingToggleButton = this.getFormattingToolbarToggleButton();
     const formattingToolbar = this.getFormattingToolbar();
-    if (formattingToggleButton && formattingToolbar && formattingToolbar.style.display === '') {
-      (0, _simulateMouseEvent.simulateClick)(formattingToggleButton);
+
+    if (
+      formattingToggleButton &&
+      formattingToolbar &&
+      formattingToolbar.style.display === ''
+    ) {
+      simulateClick(formattingToggleButton);
     }
   }
+
   close() {
     if (this.isInlineReplyForm()) {
       // eslint-disable-next-line no-console
       console.warn("Trying to close an inline reply which doesn't work.");
       return;
     }
-    this._element.dispatchEvent(new CustomEvent('closedProgrammatically', {
-      bubbles: false,
-      cancelable: false,
-      detail: null
-    }));
+
+    this._element.dispatchEvent(
+      new CustomEvent('closedProgrammatically', {
+        bubbles: false,
+        cancelable: false,
+        detail: null,
+      })
+    );
+
     if (this._isFullscreen) {
-      this._eventStream.filter(_ref6 => {
-        let {
-          eventName
-        } = _ref6;
-        return eventName === 'fullscreenChanged';
-      }).onValue(() => (0, _simulateMouseEvent.simulateClick)(this.getCloseButton()));
-      (0, _simulateMouseEvent.simulateClick)(this.getMoleSwitchButton());
+      this._eventStream
+        .filter(({ eventName }) => eventName === 'fullscreenChanged')
+        .onValue(() => simulateClick(this.getCloseButton()));
+
+      simulateClick(this.getMoleSwitchButton());
     } else {
-      (0, _simulateMouseEvent.simulateClick)(this.getCloseButton());
+      simulateClick(this.getCloseButton());
     }
   }
-  send(_ref7) {
-    let {
-      sendAndArchive
-    } = _ref7;
+
+  send({ sendAndArchive }: { sendAndArchive: boolean }) {
     // asap necessary so if send() is called after presending event.cancel(), the new presending event
     // must happen after the sendCanceled event (which is also delayed by asap).
-    (0, _asap.default)(() => {
+    asap(() => {
       const sendAndArchiveButton = this.getSendAndArchiveButton();
+
       if (sendAndArchive && sendAndArchiveButton) {
-        (0, _simulateMouseEvent.simulateClick)(sendAndArchiveButton);
+        simulateClick(sendAndArchiveButton);
       } else {
-        (0, _simulateMouseEvent.simulateClick)(this.getSendButton());
+        simulateClick(this.getSendButton());
       }
     });
   }
+
   discard() {
-    (0, _simulateMouseEvent.simulateClick)(this.getDiscardButton());
+    simulateClick(this.getDiscardButton());
   }
+
   popOut() {
     if (!this.isInlineReplyForm()) {
       throw new Error('Can only pop out inline reply compose views');
     }
-    const popOutBtn = (0, _querySelectorOrFail.default)(this._element, '.M9 > [role=menu]:first-child > .SK > [role=menuitem]:last-child');
-    (0, _simulateMouseEvent.simulateClick)(popOutBtn);
+    const popOutBtn = querySelector(
+      this._element,
+      '.M9 > [role=menu]:first-child > .SK > [role=menuitem]:last-child'
+    );
+    simulateClick(popOutBtn);
   }
+
   overrideEditSubject() {
-    (0, _overrideEditSubject.default)(this._driver, this);
+    overrideEditSubject(this._driver, this);
   }
+
   _hideDropzones() {
-    (0, _setCss.default)('compose dropzone hider', 'body > .aC7 .aC9 {visibility: hidden;}');
+    setCss('compose dropzone hider', 'body > .aC7 .aC9 {visibility: hidden;}');
   }
+
   _reenableDropzones() {
-    (0, _setCss.default)('compose dropzone hider', null);
+    setCss('compose dropzone hider', null);
   }
-  _dropzonesVisible() {
-    return (0, _find.default)(document.querySelectorAll('body > .aC7:not(.aWP)'), _isElementVisible.default) != null;
+
+  _dropzonesVisible(): boolean {
+    return (
+      find(
+        document.querySelectorAll('body > .aC7:not(.aWP)'),
+        isElementVisible
+      ) != null
+    );
   }
-  _findDropzoneForThisCompose(inline) {
+
+  _findDropzoneForThisCompose(inline: boolean): HTMLElement {
     // Iterate through all the dropzones and find the one visually contained by
     // this compose.
     const rect = this._element.getBoundingClientRect();
-    const dropzoneSelector = inline ? 'body > .aC7:not(.aWP)' : 'body > .aC7.aWP';
-    const el = _transducers.default.toArray(Array.prototype.slice.call(document.querySelectorAll(dropzoneSelector)), _transducers.default.compose(_transducers.default.filter(_isElementVisible.default), _transducers.default.filter(dropzone => {
-      const top = parseInt(dropzone.style.top, 10);
-      const bottom = top + parseInt(dropzone.style.height, 10);
-      const left = parseInt(dropzone.style.left, 10);
-      const right = left + parseInt(dropzone.style.width, 10);
-      return top >= rect.top && left >= rect.left && right <= rect.right && bottom <= rect.bottom;
-    }), _transducers.default.take(1)))[0];
+    const dropzoneSelector = inline
+      ? 'body > .aC7:not(.aWP)'
+      : 'body > .aC7.aWP';
+    const el: ?HTMLElement = t.toArray(
+      Array.prototype.slice.call(document.querySelectorAll(dropzoneSelector)),
+      t.compose(
+        t.filter(isElementVisible),
+        t.filter((dropzone) => {
+          const top = parseInt(dropzone.style.top, 10);
+          const bottom = top + parseInt(dropzone.style.height, 10);
+          const left = parseInt(dropzone.style.left, 10);
+          const right = left + parseInt(dropzone.style.width, 10);
+          return (
+            top >= rect.top &&
+            left >= rect.left &&
+            right <= rect.right &&
+            bottom <= rect.bottom
+          );
+        }),
+        t.take(1)
+      )
+    )[0];
     if (!el) {
       throw new Error('Failed to find dropzone');
     }
     return el;
   }
-  async _attachFiles(files, inline) {
+
+  async _attachFiles(files: Blob[], inline: boolean): Promise<void> {
     this._hideDropzones();
-    const endDrag = (0, _once.default)(() => (0, _simulateDragAndDrop.simulateDragEnd)(this._element, files));
+    const endDrag = once(() => simulateDragEnd(this._element, files));
     try {
       let firstLoop = true;
-      for (let files of _transducers.default.partition(files, 3)) {
+      for (let partitionedFiles of t.partition(files, 3)) {
         if (firstLoop) {
           firstLoop = false;
         } else {
-          await (0, _pdelay.default)(500);
+          await delay(500);
         }
-        (0, _simulateDragAndDrop.simulateDragOver)(this._element, files);
-        await (0, _waitFor.default)(() => this._dropzonesVisible(), 20 * 1000);
+
+        simulateDragOver(this._element, partitionedFiles);
+        await waitFor(() => this._dropzonesVisible(), 20 * 1000);
         const dropzone = this._findDropzoneForThisCompose(inline);
-        (0, _simulateDragAndDrop.simulateDrop)(dropzone, files);
+        simulateDrop(dropzone, partitionedFiles);
         endDrag();
-        await (0, _waitFor.default)(() => !this._dropzonesVisible(), 20 * 1000);
+        await waitFor(() => !this._dropzonesVisible(), 20 * 1000);
       }
     } catch (err) {
       this._driver.getLogger().error(err);
@@ -818,134 +1163,185 @@ class GmailComposeView {
       this._reenableDropzones();
     }
   }
-  attachFiles(files) {
+
+  attachFiles(files: Blob[]): Promise<void> {
     return this._attachFiles(files, false);
   }
-  attachInlineFiles(files) {
+
+  attachInlineFiles(files: Blob[]): Promise<void> {
     return this._attachFiles(files, true);
   }
-  isForward() {
+
+  isForward(): boolean {
     return Boolean(this._element.querySelector('.Un.J-JN-M-I .mI'));
   }
-  isReply() {
+
+  isReply(): boolean {
     return this._isInlineReplyForm || !!this._element.querySelector('.HQ');
   }
-  isInlineReplyForm() {
+
+  isInlineReplyForm(): boolean {
     return this._isInlineReplyForm;
   }
-  getBodyElement() {
+
+  getBodyElement(): HTMLElement {
     const el = this.getMaybeBodyElement();
     if (!el) throw new Error('Could not find body element');
     return el;
   }
-  getMaybeBodyElement() {
+
+  getMaybeBodyElement(): ?HTMLElement {
     return this._element.querySelector('.Ap [g_editable=true]');
   }
-  getTopFormElement() {
-    return (0, _querySelectorOrFail.default)(this._element, 'td > form');
+
+  getTopFormElement(): HTMLElement {
+    return querySelector(this._element, 'td > form');
   }
-  getHTMLContent() {
+
+  getHTMLContent(): string {
     return this.getBodyElement().innerHTML;
   }
-  getTextContent() {
+
+  getTextContent(): string {
     return this.getBodyElement().textContent;
   }
-  getSelectedBodyHTML() {
-    return (0, _getSelection.getSelectedHTMLInElement)(this.getBodyElement(), this.getLastSelectionRange());
+
+  getSelectedBodyHTML(): ?string {
+    return getSelectedHTMLInElement(
+      this.getBodyElement(),
+      this.getLastSelectionRange()
+    );
   }
-  getSelectedBodyText() {
-    return (0, _getSelection.getSelectedTextInElement)(this.getBodyElement(), this.getLastSelectionRange());
+
+  getSelectedBodyText(): ?string {
+    return getSelectedTextInElement(
+      this.getBodyElement(),
+      this.getLastSelectionRange()
+    );
   }
-  getSubject() {
+
+  getSubject(): string {
     return this.getSubjectInput().value;
   }
-  getSubjectInput() {
-    return this._element.querySelector('input[name=subjectbox]');
+
+  getSubjectInput(): HTMLInputElement {
+    return (this._element: any).querySelector('input[name=subjectbox]');
   }
-  getMetadataFormElement() {
+
+  getMetadataFormElement(): HTMLElement {
     const container = this.getBodyElement().closest('.aoP');
     if (!container) {
       throw new Error('Could not find compose container');
     }
-    return (0, _querySelectorOrFail.default)(container, 'form.bAs');
+    return querySelector(container, 'form.bAs');
   }
-  getToRecipients() {
-    return (0, _getRecipients.default)(this, 'to');
+
+  getToRecipients(): Contact[] {
+    return getRecipients(this, 'to');
   }
-  getCcRecipients() {
-    return (0, _getRecipients.default)(this, 'cc');
+
+  getCcRecipients(): Contact[] {
+    return getRecipients(this, 'cc');
   }
-  getBccRecipients() {
-    return (0, _getRecipients.default)(this, 'bcc');
+
+  getBccRecipients(): Contact[] {
+    return getRecipients(this, 'bcc');
   }
-  getAdditionalActionToolbar() {
-    return require('./gmail-compose-view/get-additional-action-toolbar').default(this);
+
+  getAdditionalActionToolbar(): HTMLElement {
+    return require('./gmail-compose-view/get-additional-action-toolbar').default(
+      this
+    );
   }
-  updateInsertMoreAreaLeft(oldFormattingAreaOffsetLeft) {
-    (0, _updateInsertMoreAreaLeft.default)(this, oldFormattingAreaOffsetLeft);
+
+  updateInsertMoreAreaLeft(oldFormattingAreaOffsetLeft: number) {
+    updateInsertMoreAreaLeft(this, oldFormattingAreaOffsetLeft);
   }
-  _getFormattingAreaOffsetLeft() {
-    return (0, _getFormattingAreaOffsetLeft.default)(this);
+
+  _getFormattingAreaOffsetLeft(): number {
+    return getFormattingAreaOffsetLeft(this);
   }
-  getFormattingArea() {
+
+  getFormattingArea(): ?HTMLElement {
     let formattingArea = this._formattingArea;
     if (!formattingArea) {
-      formattingArea = this._formattingArea = this._element.querySelector('.oc');
+      formattingArea = this._formattingArea =
+        this._element.querySelector('.oc');
     }
     return formattingArea;
   }
-  getFormattingToolbar() {
+
+  getFormattingToolbar(): ?HTMLElement {
     return this._element.querySelector('.aX');
   }
-  getFormattingToolbarArrow() {
+
+  getFormattingToolbarArrow(): HTMLElement {
     const el = this.getFormattingToolbar();
     if (!el) throw new Error('Failed to find formatting toolbar');
-    return (0, _querySelectorOrFail.default)(el, '.aA4');
+    return querySelector(el, '.aA4');
   }
-  getFormattingToolbarToggleButton() {
-    const innerElement = (0, _querySelectorOrFail.default)(this._element, '[role=button] .dv');
-    const btn = (0, _closestNg.default)(innerElement, '[role=button]');
+
+  getFormattingToolbarToggleButton(): HTMLElement {
+    const innerElement = querySelector(this._element, '[role=button] .dv');
+    const btn = closest(innerElement, '[role=button]');
     if (!btn) throw new Error('failed to find button');
     return btn;
   }
-  getStatusBarPrependContainer() {
-    return this._element.querySelector('.inboxsdk__compose_statusBarPrependContainer');
+
+  getStatusBarPrependContainer(): ?HTMLElement {
+    return this._element.querySelector(
+      '.inboxsdk__compose_statusBarPrependContainer'
+    );
   }
-  getScrollBody() {
+
+  getScrollBody(): HTMLElement {
     var scrollBody = this._element.querySelector('table .GP');
     if (!scrollBody) {
       throw new Error('Failed to find scroll body');
     }
     return scrollBody;
   }
-  getStatusArea() {
+
+  getStatusArea(): HTMLElement {
     let statusArea = this._element.querySelector('.aDg .aDj > .aDh');
     if (!statusArea) throw new Error('Failed to find status area');
     return statusArea;
   }
-  getInsertMoreArea() {
-    return (0, _querySelectorOrFail.default)(this._element, '.eq');
+
+  getInsertMoreArea(): HTMLElement {
+    return querySelector(this._element, '.eq');
   }
-  getInsertLinkButton() {
-    return (0, _querySelectorOrFail.default)(this._element, '.e5.aaA.aMZ');
+
+  getInsertLinkButton(): HTMLElement {
+    return querySelector(this._element, '.e5.aaA.aMZ');
   }
-  getSendButton() {
-    return (0, _querySelectorOrFail.default)(this._element, '.IZ .Up div > div[role=button]:not(.Uo):not([aria-haspopup=true]):not([class^=inboxsdk_])');
+
+  getSendButton(): HTMLElement {
+    return querySelector(
+      this._element,
+      '.IZ .Up div > div[role=button]:not(.Uo):not([aria-haspopup=true]):not([class^=inboxsdk_])'
+    );
   }
 
   // When schedule send is available, this returns the element that contains both buttons.
-  getSendButtonGroup() {
-    const scheduleSend = this._element.querySelector('.IZ .Up div > [role=button][aria-haspopup=true]:not([class^=inboxsdk_])');
+  getSendButtonGroup(): HTMLElement {
+    const scheduleSend = this._element.querySelector(
+      '.IZ .Up div > [role=button][aria-haspopup=true]:not([class^=inboxsdk_])'
+    );
     if (scheduleSend) {
-      return scheduleSend.parentElement;
+      return (scheduleSend: any).parentElement;
     }
     return this.getSendButton();
   }
-  getSendAndArchiveButton() {
+
+  getSendAndArchiveButton(): ?HTMLElement {
     if (!this.isReply()) {
       return null;
     }
-    const sendAndArchiveButton = this._element.querySelector('.IZ .Up div > div[role=button].Uo:not([aria-haspopup=true]):not([class^=inboxsdk_])');
+
+    const sendAndArchiveButton = this._element.querySelector(
+      '.IZ .Up div > div[role=button].Uo:not([aria-haspopup=true]):not([class^=inboxsdk_])'
+    );
     if (sendAndArchiveButton) {
       return sendAndArchiveButton;
     }
@@ -956,83 +1352,125 @@ class GmailComposeView {
     const parent = sendButton.parentElement;
     if (!(parent instanceof HTMLElement)) throw new Error('should not happen');
     if (parent.childElementCount <= 1) {
-      this._driver.getLogger().eventSdkPassive('getSendAndArchiveButton - old method - failed to find, childElementCount <= 1');
+      this._driver
+        .getLogger()
+        .eventSdkPassive(
+          'getSendAndArchiveButton - old method - failed to find, childElementCount <= 1'
+        );
       return null;
     }
-    const firstNotSendElement = parent.children[0] !== sendButton ? parent.children[0] : parent.children[1];
-    const result = !firstNotSendElement ? null : firstNotSendElement.querySelector('[role=button]');
+
+    const firstNotSendElement =
+      parent.children[0] !== sendButton
+        ? parent.children[0]
+        : parent.children[1];
+    const result = !firstNotSendElement
+      ? null
+      : firstNotSendElement.querySelector('[role=button]');
     if (result) {
-      this._driver.getLogger().eventSdkPassive('getSendAndArchiveButton - old method - found');
+      this._driver
+        .getLogger()
+        .eventSdkPassive('getSendAndArchiveButton - old method - found');
     } else {
-      this._driver.getLogger().eventSdkPassive('getSendAndArchiveButton - old method - failed to find');
+      this._driver
+        .getLogger()
+        .eventSdkPassive(
+          'getSendAndArchiveButton - old method - failed to find'
+        );
     }
     return result;
   }
-  getCloseButton() {
+
+  getCloseButton(): HTMLElement {
     return this._element.querySelectorAll('.Hm > img')[2];
   }
-  getMoleSwitchButton() {
+
+  getMoleSwitchButton(): HTMLElement {
     return this._element.querySelectorAll('.Hm > img')[1];
   }
-  getBottomBarTable() {
-    return (0, _querySelectorOrFail.default)(this._element, '.aoP .aDh > table');
+
+  getBottomBarTable(): HTMLElement {
+    return querySelector(this._element, '.aoP .aDh > table');
   }
-  getBottomToolbarContainer() {
-    return (0, _querySelectorOrFail.default)(this._element, '.aoP .aDj');
+
+  getBottomToolbarContainer(): HTMLElement {
+    return querySelector(this._element, '.aoP .aDj');
   }
-  getDiscardButton() {
-    return (0, _querySelectorOrFail.default)(this._element, '.gU .oh');
+
+  getDiscardButton(): HTMLElement {
+    return querySelector(this._element, '.gU .oh');
   }
-  getComposeID() {
+
+  getComposeID(): string {
     return this._composeID;
   }
-  getInitialMessageID() {
+
+  getInitialMessageID(): ?string {
     return this._initialMessageId;
   }
 
   // For use only when isUsingSyncAPI() is true — gets the draft ID
   // from the input that used to hold the hex message ID. Still does not
   // populate until first save.
-  _getDraftIDfromForm() {
-    const value = this._messageIDElement && this._messageIDElement.value || null;
-    if (typeof value === 'string' && value !== 'undefined' && value !== 'null') {
+  _getDraftIDfromForm(): ?string {
+    const value =
+      (this._messageIDElement && this._messageIDElement.value) || null;
+    if (
+      typeof value === 'string' &&
+      value !== 'undefined' &&
+      value !== 'null'
+    ) {
       if (this._driver.isUsingSyncAPI()) {
         return value.replace('#', '').replace('msg-a:', '');
       } else {
-        this._driver.getLogger().error(new Error('Invalid draft id in element'), {
-          value
-        });
+        this._driver
+          .getLogger()
+          .error(new Error('Invalid draft id in element'), {
+            value,
+          });
       }
     }
     return null;
   }
-  _getMessageIDfromForm() {
-    const value = this._messageIDElement && this._messageIDElement.value || null;
-    if (typeof value === 'string' && value !== 'undefined' && value !== 'null') {
+
+  _getMessageIDfromForm(): ?string {
+    const value =
+      (this._messageIDElement && this._messageIDElement.value) || null;
+    if (
+      typeof value === 'string' &&
+      value !== 'undefined' &&
+      value !== 'null'
+    ) {
       if (this._driver.isUsingSyncAPI()) {
         return value.replace('#', ''); //annoyingly the hash is included
       } else {
         if (/^[0-9a-f]+$/i.test(value)) {
           return value;
         } else {
-          this._driver.getLogger().error(new Error('Invalid message id in element'), {
-            value
-          });
+          this._driver
+            .getLogger()
+            .error(new Error('Invalid message id in element'), {
+              value,
+            });
         }
       }
     }
     return null;
   }
-  getMessageID() {
+
+  getMessageID(): ?string {
     return this._messageId;
   }
-  getTargetMessageID() {
+
+  getTargetMessageID(): ?string {
     return this._targetMessageID;
   }
-  getThreadID() {
+
+  getThreadID(): ?string {
     return this._threadID;
   }
-  async getCurrentDraftID() {
+
+  async getCurrentDraftID(): Promise<?string> {
     if (this._driver.isUsingSyncAPI()) {
       // This function is mostly a mirror of _getDraftIDimplementation, but
       // instead of waiting when finding out it's not saved, just returns null.
@@ -1046,11 +1484,13 @@ class GmailComposeView {
           try {
             // If this succeeds, then the draft must exist on the server and we
             // can safely return the draft id we know.
-            const gmailMessageId = await this._driver.getGmailMessageIdForSyncDraftId(syncMessageId);
+            const gmailMessageId =
+              await this._driver.getGmailMessageIdForSyncDraftId(syncMessageId);
           } catch (e) {
             // ignore error, it's probably that the draft isn't saved yet.
             return null;
           }
+
           return draftID;
         }
       }
@@ -1062,14 +1502,16 @@ class GmailComposeView {
       }
     }
   }
-  getDraftID() {
+
+  getDraftID(): Promise<?string> {
     let draftIDpromise = this._draftIDpromise;
     if (!draftIDpromise) {
       draftIDpromise = this._draftIDpromise = this._getDraftIDimplementation();
     }
     return draftIDpromise;
   }
-  async _getDraftIDimplementation() {
+
+  async _getDraftIDimplementation(): Promise<?string> {
     if (this._driver.isUsingSyncAPI()) {
       const draftID = this._getDraftIDfromForm();
       // we want to keep the semantics that getDraftID doesn't return until
@@ -1084,27 +1526,35 @@ class GmailComposeView {
           try {
             // If this succeeds, then the draft must exist on the server and we
             // can safely return the draft id we know.
-            const gmailMessageId = await this._driver.getGmailMessageIdForSyncDraftId(syncMessageId);
+            const gmailMessageId =
+              await this._driver.getGmailMessageIdForSyncDraftId(syncMessageId);
           } catch (e) {
             // draft doesn't exist so we wait until it does
-            await this._eventStream.filter(_ref8 => {
-              let {
-                eventName
-              } = _ref8;
-              return eventName === 'draftSaved';
-            }).beforeEnd(() => null).map(() => this._getDraftIDfromForm()).take(1).toPromise();
+            await this._eventStream
+              .filter(({ eventName }) => eventName === 'draftSaved')
+              .beforeEnd(() => null)
+              .map(() => this._getDraftIDfromForm())
+              .take(1)
+              .toPromise();
           }
+
           return draftID;
         }
       }
     } else {
       let i = -1;
       let lastDebugData = null;
+
       try {
         // If this compose view doesn't have a message id yet, wait until it gets
         // one or it's closed.
         if (!this._messageId) {
-          await this._eventStream.filter(event => event.eventName === 'messageIDChange').beforeEnd(() => null).take(1).toPromise();
+          await this._eventStream
+            .filter((event) => event.eventName === 'messageIDChange')
+            .beforeEnd(() => null)
+            .take(1)
+            .toPromise();
+
           if (!this._messageId) {
             // The compose was closed before it got an id.
             return null;
@@ -1119,6 +1569,7 @@ class GmailComposeView {
         // eslint-disable-next-line no-constant-condition
         while (true) {
           i++;
+
           const messageId = this._messageId;
           if (!messageId) {
             throw new Error('Should not happen');
@@ -1129,7 +1580,11 @@ class GmailComposeView {
             // the draft save response yet. Wait for that response to finish and
             // keep trying if it looks like that might be the case.
             if (this._draftSaving) {
-              await this._eventStream.filter(event => event.eventName === 'messageIDChange').beforeEnd(() => null).take(1).toPromise();
+              await this._eventStream
+                .filter((event) => event.eventName === 'messageIDChange')
+                .beforeEnd(() => null)
+                .take(1)
+                .toPromise();
               continue;
             }
 
@@ -1140,25 +1595,23 @@ class GmailComposeView {
               if (!newMessageId) {
                 throw new Error('Should not happen');
               }
-              const {
-                draftID,
-                debugData
-              } = await this._driver.getDraftIDForMessageID(newMessageId, true);
+              const { draftID, debugData } =
+                await this._driver.getDraftIDForMessageID(newMessageId, true);
               const err = new Error('Failed to read draft ID -- after check');
               this._driver.getLogger().error(err, {
                 message: 'getDraftID error -- after check',
                 messageIdChanged: messageId !== newMessageId,
                 gotDraftID: draftID != null,
-                debugData: draftID ? null : debugData
+                debugData: draftID ? null : debugData,
               });
             }, 10 * 1000);
+
             throw new Error('Failed to read draft ID');
           }
           lastMessageId = messageId;
-          const {
-            draftID,
-            debugData
-          } = await this._driver.getDraftIDForMessageID(messageId);
+
+          const { draftID, debugData } =
+            await this._driver.getDraftIDForMessageID(messageId);
           lastDebugData = debugData;
           if (draftID) {
             return draftID;
@@ -1173,99 +1626,151 @@ class GmailComposeView {
           isStandalone: this._isStandalone,
           emailWasSent: this._emailWasSent,
           i,
-          lastDebugData
+          lastDebugData,
         });
         throw err;
       }
     }
   }
-  addManagedViewController(viewController) {
+
+  addManagedViewController(viewController: { destroy(): void }) {
     this._managedViewControllers.push(viewController);
   }
-  ensureGroupingIsOpen(type) {
-    (0, _ensureGroupingIsOpen.default)(this._element, type);
+
+  ensureGroupingIsOpen(type: string) {
+    ensureGroupingIsOpen(this._element, type);
   }
-  ensureAppButtonToolbarsAreClosed() {
-    (0, _ensureAppButtonToolbarsAreClosed.default)(this._element);
+
+  ensureAppButtonToolbarsAreClosed(): void {
+    ensureAppButtonToolbarsAreClosed(this._element);
   }
-  isMinimized() {
+
+  isMinimized(): boolean {
     const element = this.getElement();
     const bodyElement = this.getMaybeBodyElement();
-    const bodyContainer = (0, _find.default)(element.children, child => child.contains(bodyElement));
+    const bodyContainer = find(element.children, (child) =>
+      child.contains(bodyElement)
+    );
     if (!bodyContainer) {
       if (!hasReportedMissingBody) {
         hasReportedMissingBody = true;
-        this._driver.getLogger().error(new Error('isMinimized failed to find bodyContainer'), {
-          bodyElement: !!bodyElement,
-          hasMessageIDElement: !!this._messageIDElement,
-          ended: this._eventStream.ended,
-          bodyElStillInCompose: this._element.contains(this._seenBodyElement),
-          seenBodyElHtml: (0, _censorHTMLstring.default)(this._seenBodyElement.outerHTML),
-          composeHtml: (0, _censorHTMLstring.default)(element.outerHTML)
-        });
+        this._driver
+          .getLogger()
+          .error(new Error('isMinimized failed to find bodyContainer'), {
+            bodyElement: !!bodyElement,
+            hasMessageIDElement: !!this._messageIDElement,
+            ended: (this._eventStream: any).ended,
+            bodyElStillInCompose: this._element.contains(this._seenBodyElement),
+            seenBodyElHtml: censorHTMLstring(this._seenBodyElement.outerHTML),
+            composeHtml: censorHTMLstring(element.outerHTML),
+          });
       }
       return false;
     }
+
     return bodyContainer.style.display !== '';
   }
-  setMinimized(minimized) {
+
+  setMinimized(minimized: boolean) {
     if (minimized !== this.isMinimized()) {
-      if (this._isInlineReplyForm) throw new Error('Not implemented for inline compose views');
-      const minimizeButton = (0, _querySelectorOrFail.default)(this._element, '.Hm > img');
-      (0, _simulateMouseEvent.simulateClick)(minimizeButton);
+      if (this._isInlineReplyForm)
+        throw new Error('Not implemented for inline compose views');
+      const minimizeButton = querySelector(this._element, '.Hm > img');
+      simulateClick(minimizeButton);
     }
   }
-  setFullscreen(fullscreen) {
+
+  setFullscreen(fullscreen: boolean) {
     if (fullscreen !== this.isFullscreen()) {
-      if (this._isInlineReplyForm) throw new Error('Not implemented for inline compose views');
-      const fullscreenButton = (0, _querySelectorOrFail.default)(this._element, '.Hm > img:nth-of-type(2)');
-      (0, _simulateMouseEvent.simulateClick)(fullscreenButton);
+      if (this._isInlineReplyForm)
+        throw new Error('Not implemented for inline compose views');
+      const fullscreenButton = querySelector(
+        this._element,
+        '.Hm > img:nth-of-type(2)'
+      );
+      simulateClick(fullscreenButton);
     }
   }
-  setTitleBarColor(color) {
-    const buttonParent = (0, _querySelectorOrFail.default)(this._element, '.nH.Hy.aXJ table.cf.Ht td.Hm');
-    const elementsToModify = [(0, _querySelectorOrFail.default)(this._element, '.nH.Hy.aXJ .pi > .l.o'), (0, _querySelectorOrFail.default)(this._element, '.nH.Hy.aXJ .l.m'), (0, _querySelectorOrFail.default)(this._element, '.nH.Hy.aXJ .l.m > .l.n')];
+
+  setTitleBarColor(color: string): () => void {
+    const buttonParent = querySelector(
+      this._element,
+      '.nH.Hy.aXJ table.cf.Ht td.Hm'
+    );
+    const elementsToModify = [
+      querySelector(this._element, '.nH.Hy.aXJ .pi > .l.o'),
+      querySelector(this._element, '.nH.Hy.aXJ .l.m'),
+      querySelector(this._element, '.nH.Hy.aXJ .l.m > .l.n'),
+    ];
+
     buttonParent.classList.add('inboxsdk__compose_customTitleBarColor');
-    elementsToModify.forEach(el => {
+
+    elementsToModify.forEach((el) => {
       el.style.backgroundColor = color;
     });
+
     return () => {
       buttonParent.classList.remove('inboxsdk__compose_customTitleBarColor');
-      elementsToModify.forEach(el => {
+
+      elementsToModify.forEach((el) => {
         el.style.backgroundColor = '';
       });
     };
   }
-  setTitleBarText(text) {
+
+  setTitleBarText(text: string): () => void {
     if (this.isInlineReplyForm()) {
-      throw new Error('setTitleBarText() is not supported on inline compose views');
+      throw new Error(
+        'setTitleBarText() is not supported on inline compose views'
+      );
     }
-    const titleBarTable = (0, _querySelectorOrFail.default)(this._element, '.nH.Hy.aXJ table.cf.Ht');
-    if (titleBarTable.classList.contains('inboxsdk__compose_hasCustomTitleBarText')) {
-      throw new Error('Custom title bar text is already registered for this compose view');
+
+    const titleBarTable = querySelector(
+      this._element,
+      '.nH.Hy.aXJ table.cf.Ht'
+    );
+
+    if (
+      titleBarTable.classList.contains(
+        'inboxsdk__compose_hasCustomTitleBarText'
+      )
+    ) {
+      throw new Error(
+        'Custom title bar text is already registered for this compose view'
+      );
     }
-    const titleTextParent = (0, _querySelectorOrFail.default)(titleBarTable, 'div.Hp').parentElement;
+
+    const titleTextParent = querySelector(
+      titleBarTable,
+      'div.Hp'
+    ).parentElement;
     if (!(titleTextParent instanceof HTMLElement)) {
       throw new Error('Could not locate title bar text parent');
     }
+
     titleBarTable.classList.add('inboxsdk__compose_hasCustomTitleBarText');
     titleTextParent.classList.add('inboxsdk__compose_nativeTitleBarText');
+
     const customTitleText = document.createElement('td');
     customTitleText.classList.add('inboxsdk__compose_customTitleBarText');
-    customTitleText.innerHTML = (0, _autoHtml.default)`
+    customTitleText.innerHTML = autoHtml`
       <div class="Hp">
         <h2 class="a3E">
           <div class="aYF">${text}</div>
         </h2>
       </div>
     `;
+
     titleTextParent.insertAdjacentElement('afterend', customTitleText);
+
     return () => {
       customTitleText.remove();
+
       titleBarTable.classList.remove('inboxsdk__compose_hasCustomTitleBarText');
       titleTextParent.classList.remove('inboxsdk__compose_nativeTitleBarText');
     };
   }
+
   _triggerDraftSave() {
     if (this._isTriggeringADraftSavePending) {
       return;
@@ -1275,28 +1780,40 @@ class GmailComposeView {
       // Done asynchronously with setTimeout because if it's done synchronously
       // or after an asap step after an inline compose view's creation, Gmail
       // interprets the fake keypress and decides to add a '¾' character.
-      Kefir.later(0).takeUntilBy(this._stopper).onValue(() => {
-        this._isTriggeringADraftSavePending = false;
-        const body = this.getMaybeBodyElement();
-        if (body) {
-          const unsilence = this._driver.getPageCommunicator().silenceGmailErrorsForAMoment();
-          try {
-            (0, _simulateKey.default)(body, 190, 0);
-          } finally {
-            unsilence();
+      Kefir.later(0)
+        .takeUntilBy(this._stopper)
+        .onValue(() => {
+          this._isTriggeringADraftSavePending = false;
+
+          const body = this.getMaybeBodyElement();
+          if (body) {
+            const unsilence = this._driver
+              .getPageCommunicator()
+              .silenceGmailErrorsForAMoment();
+            try {
+              simulateKey(body, 190, 0);
+            } finally {
+              unsilence();
+            }
           }
-        }
-      });
+        });
     }
   }
 
   // If this compose is a reply, then this gets the message ID of the message
   // we're replying to.
-  _getTargetMessageID() {
-    const input = this._element.querySelector('input[name="rm"]');
-    return input && typeof input.value === 'string' && input.value != 'undefined' ? input.value.replace('#', '') : null;
+  _getTargetMessageID(): ?string {
+    const input: ?HTMLInputElement = (this._element.querySelector(
+      'input[name="rm"]'
+    ): any);
+    return input &&
+      typeof input.value === 'string' &&
+      input.value != 'undefined'
+      ? input.value.replace('#', '')
+      : null;
   }
-  _getThreadID() {
+
+  _getThreadID(): ?string {
     const targetID = this.getTargetMessageID();
     try {
       return targetID ? this._driver.getThreadIDForMessageID(targetID) : null;
@@ -1305,76 +1822,117 @@ class GmailComposeView {
       return null;
     }
   }
-  getElement() {
+
+  getElement(): HTMLElement {
     return this._element;
   }
-  isFullscreen() {
+
+  isFullscreen(): boolean {
     return this._isFullscreen;
   }
-  getLastSelectionRange() {
+
+  getLastSelectionRange(): ?Range {
     // The selection range can become invalid if the compose view has become expanded or
     // minimized since the range was set.
     const range = this._lastSelectionRange;
-    if (range && !this.getBodyElement().contains(range.commonAncestorContainer)) {
+    if (
+      range &&
+      !this.getBodyElement().contains(range.commonAncestorContainer)
+    ) {
       this._lastSelectionRange = undefined;
     }
     return this._lastSelectionRange;
   }
-  setLastSelectionRange(lastSelectionRange) {
+
+  setLastSelectionRange(lastSelectionRange: ?Range) {
     this._lastSelectionRange = lastSelectionRange;
   }
-  registerRequestModifier(modifier) {
-    const keyId = this._driver.isUsingSyncAPI() ? this._getDraftIDfromForm() : this.getComposeID();
+
+  registerRequestModifier(
+    modifier: (composeParams: { body: string }) =>
+      | { body: string }
+      | Promise<{ body: string }>
+  ) {
+    const keyId = this._driver.isUsingSyncAPI()
+      ? this._getDraftIDfromForm()
+      : this.getComposeID();
+
     if (!keyId) throw new Error('keyId should be set here');
-    const modifierId = this._driver.getPageCommunicator().registerComposeRequestModifier(keyId, this._driver.getAppId());
+
+    const modifierId = this._driver
+      .getPageCommunicator()
+      .registerComposeRequestModifier(keyId, this._driver.getAppId());
     this._requestModifiers[modifierId] = modifier;
     this._startListeningForModificationRequests();
     this._stopper.onValue(() => {
-      this._driver.getPageCommunicator().unregisterComposeRequestModifier(keyId, modifierId);
+      this._driver
+        .getPageCommunicator()
+        .unregisterComposeRequestModifier(keyId, modifierId);
     });
   }
+
   _startListeningForModificationRequests() {
     if (this._isListeningToAjaxInterceptStream) {
       return;
     }
-    const keyId = this._driver.isUsingSyncAPI() ? this._getDraftIDfromForm() : this.getComposeID();
+
+    const keyId = this._driver.isUsingSyncAPI()
+      ? this._getDraftIDfromForm()
+      : this.getComposeID();
+
     if (!keyId) throw new Error('keyId should be set here');
-    this._driver.getPageCommunicator().ajaxInterceptStream.filter(_ref9 => {
-      let {
-        type,
-        composeid,
-        draftID,
-        modifierId
-      } = _ref9;
-      return type === 'inboxSDKmodifyComposeRequest' && (composeid === keyId || keyId === draftID) && Boolean(this._requestModifiers[modifierId]);
-    }).takeUntilBy(this._stopper).onValue(_ref10 => {
-      let {
-        modifierId,
-        composeParams
-      } = _ref10;
-      if (this._driver.getLogger().shouldTrackEverything()) {
-        this._driver.getLogger().eventSite('inboxSDKmodifyComposeRequest');
-      }
-      const modifier = this._requestModifiers[modifierId];
-      const result = new Promise(resolve => resolve(modifier(composeParams)));
-      result.then(newComposeParams => this._driver.getPageCommunicator().modifyComposeRequest(keyId, modifierId, newComposeParams || composeParams)).then(x => {
+
+    this._driver
+      .getPageCommunicator()
+      .ajaxInterceptStream.filter(
+        ({ type, composeid, draftID, modifierId }) =>
+          type === 'inboxSDKmodifyComposeRequest' &&
+          (composeid === keyId || keyId === draftID) &&
+          Boolean(this._requestModifiers[modifierId])
+      )
+      .takeUntilBy(this._stopper)
+      .onValue(({ modifierId, composeParams }) => {
         if (this._driver.getLogger().shouldTrackEverything()) {
-          this._driver.getLogger().eventSite('composeRequestModified');
+          this._driver.getLogger().eventSite('inboxSDKmodifyComposeRequest');
         }
-        return x;
-      }).catch(err => {
-        this._driver.getPageCommunicator().modifyComposeRequest(keyId, modifierId, composeParams);
-        this._driver.getLogger().error(err);
+
+        const modifier = this._requestModifiers[modifierId];
+        const result = new Promise((resolve) =>
+          resolve(modifier(composeParams))
+        );
+
+        result
+          .then((newComposeParams) =>
+            this._driver
+              .getPageCommunicator()
+              .modifyComposeRequest(
+                keyId,
+                modifierId,
+                newComposeParams || composeParams
+              )
+          )
+          .then((x) => {
+            if (this._driver.getLogger().shouldTrackEverything()) {
+              this._driver.getLogger().eventSite('composeRequestModified');
+            }
+            return x;
+          })
+          .catch((err) => {
+            this._driver
+              .getPageCommunicator()
+              .modifyComposeRequest(keyId, modifierId, composeParams);
+            this._driver.getLogger().error(err);
+          });
       });
-    });
+
     this._isListeningToAjaxInterceptStream = true;
   }
-  setupLinkPopOvers() {
+
+  setupLinkPopOvers(): void {
     if (!this._hasSetupLinkPopOvers) {
       this._hasSetupLinkPopOvers = true;
-      this._eventStream.plug((0, _setupLinkPopovers.default)(this));
+      this._eventStream.plug(setupLinkPopOvers(this));
     }
   }
 }
-var _default = ud.defn(module, GmailComposeView);
-exports.default = _default;
+export default ud.defn(module, GmailComposeView);