@inboxsdk/core 0.2.28-alpha.0 → 0.2.28-alpha.2

package/src/platform-implementation-js/dom-driver/gmail/gmail-driver/setup-route-view-driver-stream.test.js

@@ -0,0 +1,233 @@
+/* @flow */
+
+jest.mock('../views/gmail-route-view/gmail-route-view', () =>
+  jest.fn(() => ({ destroy() {} }))
+);
+
+import _ from 'lodash';
+import kefirBus from 'kefir-bus';
+import delay from 'pdelay';
+
+import setupRouteViewDriverStream from './setup-route-view-driver-stream';
+
+import GmailRouteProcessor from '../views/gmail-route-view/gmail-route-processor';
+import makeMutationEventInjector from '../../../../../test/lib/makeElementIntoEventEmitter';
+import MockMutationObserver from '../../../../../test/lib/mock-mutation-observer';
+
+global.MutationObserver = MockMutationObserver;
+
+if (!document.body) throw new Error('should not happen');
+document.body.innerHTML = `
+  <div class="aeF">
+    <div class="nH">
+      <div id="main" class="nH"></div>
+      <div id="main2" class="nH" style="display:none"></div>
+    </div>
+  </div>
+`;
+const main = document.getElementById('main');
+const main2 = document.getElementById('main2');
+if (!main || !main2) throw new Error();
+const mainEmitter = makeMutationEventInjector(main);
+const main2Emitter = makeMutationEventInjector(main2);
+
+const stopper = kefirBus();
+afterEach(() => {
+  stopper.emit(null);
+});
+
+function makeMockDriver(): Object {
+  return {
+    getStopper: _.constant(stopper),
+    getCustomRouteIDs: _.constant(new Set()),
+    getCustomListRouteIDs: _.constant(new Map()),
+    getCustomListSearchStringsToRouteIds: _.constant(new Map()),
+    hashChangeNoViewChange: jest.fn(),
+    showNativeRouteView: jest.fn(),
+    showCustomThreadList: jest.fn(),
+  };
+}
+
+test('role=main changes are seen', async () => {
+  const items = [];
+  window.location.hash = '#inbox';
+
+  setupRouteViewDriverStream(new GmailRouteProcessor(), makeMockDriver())
+    .takeUntilBy(stopper)
+    .onValue((item) => {
+      items.push(item);
+    });
+
+  await delay(1);
+  expect(items.length).toBe(1);
+
+  main.style.display = 'none';
+  main2.style.display = '';
+  mainEmitter({ attributeName: 'style' });
+  main2Emitter({ attributeName: 'style' });
+
+  await delay(1);
+  expect(items.length).toBe(2);
+
+  main.style.display = '';
+  main2.style.display = 'none';
+  mainEmitter({ attributeName: 'style' });
+  main2Emitter({ attributeName: 'style' });
+
+  await delay(1);
+  expect(items.length).toBe(3);
+});
+
+test('custom view hashchanges are seen', async () => {
+  const items = [];
+  const driver = makeMockDriver();
+  driver.getCustomRouteIDs().add('foo');
+  driver.getCustomRouteIDs().add('bar');
+  window.location.hash = '#inbox';
+
+  setupRouteViewDriverStream(new GmailRouteProcessor(), driver)
+    .takeUntilBy(stopper)
+    .onValue((item) => {
+      items.push(item);
+    });
+
+  await delay(1);
+  expect(items.length).toBe(1);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#foo';
+
+  await delay(1);
+  expect(items.length).toBe(2);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#foo/123';
+
+  await delay(1);
+  expect(items.length).toBe(3);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  // Setting to the same hash should NOT make a new routeview.
+  window.location.hash = '#foo/123?compose=123';
+
+  await delay(1);
+  expect(items.length).toBe(3);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#bar';
+
+  await delay(1);
+  expect(items.length).toBe(4);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+});
+
+test('native hash changes are ignored', async () => {
+  // We don't pay attention to native hash changes usually. We settle for
+  // watching a new [role=main] element become displayed.
+  const items = [];
+  const driver = makeMockDriver();
+  window.location.hash = '#inbox';
+
+  setupRouteViewDriverStream(new GmailRouteProcessor(), driver)
+    .takeUntilBy(stopper)
+    .onValue((item) => {
+      items.push(item);
+    });
+
+  await delay(1);
+  expect(items.length).toBe(1);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#starred';
+
+  await delay(1);
+  expect(items.length).toBe(1);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+});
+
+test('revertNativeHashChanges works', async () => {
+  const items = [];
+  const driver = makeMockDriver();
+  driver.getCustomRouteIDs().add('foo');
+  window.location.hash = '#inbox';
+
+  setupRouteViewDriverStream(new GmailRouteProcessor(), driver)
+    .takeUntilBy(stopper)
+    .onValue((item) => {
+      items.push(item);
+    });
+
+  await delay(1);
+  expect(items.length).toBe(1);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#foo';
+
+  await delay(1);
+  expect(items.length).toBe(2);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#inbox';
+
+  await delay(1);
+  expect(items.length).toBe(3);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(2);
+
+  window.location.hash = '#foo';
+
+  await delay(1);
+  expect(items.length).toBe(4);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(2);
+
+  window.location.hash = '#inbox';
+
+  await delay(1);
+  expect(items.length).toBe(5);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(3);
+});
+
+test('revertNativeHashChanges and ?compose parameter play nicely together', async () => {
+  // If you make a draft while at a native route view, Gmail adds ?compose=ID
+  // to the hash. If you edit the draft, Gmail updates the ID in the hash. If
+  // you go to a custom route view, then we drop ?compose=ID from the hash and
+  // Gmail doesn't try to update it because it doesn't understand the hash. If
+  // you edit the draft, and then hit the back button, the hash will first
+  // change to the hash in your browser history, and then Gmail will
+  // immediately update it to the draft's current ID. We need to not pay
+  // attention to the extra hash change, but our revertNativeHashChanges still
+  // needs to work.
+
+  const items = [];
+  const driver = makeMockDriver();
+  driver.getCustomRouteIDs().add('foo');
+  window.location.hash = '#inbox';
+
+  setupRouteViewDriverStream(new GmailRouteProcessor(), driver)
+    .takeUntilBy(stopper)
+    .onValue((item) => {
+      items.push(item);
+    });
+
+  await delay(1);
+  expect(items.length).toBe(1);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#inbox?compose=A';
+
+  await delay(1);
+  expect(items.length).toBe(1);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#foo';
+
+  await delay(1);
+  expect(items.length).toBe(2);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(1);
+
+  window.location.hash = '#inbox?compose=A';
+  window.location.hash = '#inbox?compose=B';
+
+  await delay(1);
+  expect(items.length).toBe(3);
+  expect(driver.showNativeRouteView).toHaveBeenCalledTimes(2);
+});

package/src/platform-implementation-js/dom-driver/gmail/gmail-driver/show-app-id-warning.js

@@ -0,0 +1,30 @@
+/* @flow */
+
+import Kefir from 'kefir';
+import kefirCast from 'kefir-cast';
+
+import type GmailDriver from '../gmail-driver';
+import fakeWindowResize from '../../../lib/fake-window-resize';
+
+export default function showAppIdWarning(driver: GmailDriver) {
+  const topDiv = document.createElement('div');
+  topDiv.className = 'inboxsdk__appid_warning';
+  topDiv.innerHTML = `
+<div class="inboxsdk__appid_warning_main">
+  <div class="topline">InboxSDK Developer Warning: Invalid AppId</div>
+  <div>You've loaded the InboxSDK with an unregistered appId. Registration is free but necessary to load the SDK.</div>
+</div>
+<a class="inboxsdk__appid_register" target="_blank" href="https://www.inboxsdk.com/register">Register Your App</a>
+<input type="button" value="" title="Close" class="inboxsdk__x_close_button" />
+`;
+
+  const topMessageBarDriver = driver.createTopMessageBarDriver(
+    kefirCast(Kefir, { el: topDiv })
+  );
+
+  const closeBtn = topDiv.querySelector('.inboxsdk__x_close_button');
+  if (!closeBtn) throw new Error('Should not happen');
+  closeBtn.addEventListener('click', function (e: MouseEvent) {
+    topMessageBarDriver.remove();
+  });
+}

package/src/platform-implementation-js/dom-driver/gmail/gmail-driver/show-custom-route-view.js

@@ -0,0 +1,79 @@
+/* @flow */
+
+import { defn } from 'ud';
+import GmailElementGetter from '../gmail-element-getter';
+
+const ACTIVE_ADD_ON_ICON_SELECTOR = '.J-KU-KO';
+import { simulateClick } from '../../../lib/dom/simulate-mouse-event';
+
+const showCustomRouteView = defn(
+  module,
+  function showCustomRouteView(gmailDriver: any, element: HTMLElement) {
+    const contentSectionElement = GmailElementGetter.getContentSectionElement();
+    if (!contentSectionElement) {
+      return;
+    }
+
+    const selection = (document: any).getSelection();
+    for (let i = 0; i < selection.rangeCount; i++) {
+      const range: Range = selection.getRangeAt(i);
+      if (
+        typeof (range: any).intersectsNode === 'function' &&
+        (range: any).intersectsNode(contentSectionElement)
+      ) {
+        selection.removeAllRanges();
+        break;
+      }
+    }
+
+    const customViewContainerElement = _getCustomViewContainerElement(
+      contentSectionElement
+    );
+    customViewContainerElement.appendChild(element);
+
+    const children = (contentSectionElement: any).children;
+    Array.prototype.forEach.call(children, (child: HTMLElement) => {
+      if (child.classList.contains('inboxsdk__custom_view')) {
+        return;
+      }
+
+      child.style.display = 'none';
+    });
+
+    //if any thread sidebar addons are enabled then we need to turn them off
+    const companionSidebarIconContainerEl =
+      GmailElementGetter.getCompanionSidebarIconContainerElement();
+    if (companionSidebarIconContainerEl) {
+      const activeThreadAddOnIcon =
+        companionSidebarIconContainerEl.querySelector(
+          ACTIVE_ADD_ON_ICON_SELECTOR
+        );
+      if (activeThreadAddOnIcon) {
+        simulateClick(activeThreadAddOnIcon);
+      }
+    }
+
+    ((document.body: any): HTMLElement).classList.add(
+      'inboxsdk__custom_view_active'
+    );
+  }
+);
+export default showCustomRouteView;
+
+function _getCustomViewContainerElement(
+  contentSectionElement: HTMLElement
+): HTMLElement {
+  let customViewContainerElement = contentSectionElement.querySelector(
+    '.inboxsdk__custom_view'
+  );
+  if (customViewContainerElement) {
+    return customViewContainerElement;
+  }
+
+  customViewContainerElement = document.createElement('div');
+  customViewContainerElement.classList.add('inboxsdk__custom_view');
+
+  contentSectionElement.appendChild(customViewContainerElement);
+
+  return customViewContainerElement;
+}