UX Improvements: Global Menu & Copy Changes (#2078)

- [x] Removed ‘Restart Signal’ global menu item
- [x] Change _Click to create contact…_ to _Start conversation…_
- [x] Move global menu (top-left kebab) into OS menu bar,
      i.e. **Settings** > **Preferences…**
- [x] Add tests for OS menu bar templates
- [x] Fix bug with **Window** menu on macOS when showing setup options
- [x] Use _Title Case_ for all OS menu bar menu items for consistency

commit dedf7c9af0de90980388559659df0d92a77b864c
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 16:53:42 2018 -0500

    Use ‘Title Case’ to be consistent with OS menus

    References:
    - Apple:
        - https://developer.apple.com/macos/human-interface-guidelines/menus/menu-anatomy/#menu-and-menu-item-titles
        - https://developer.apple.com/library/content/documentation/FinalCutProX/Conceptual/FxPlugHIG/TextStyleGuidelines/TextStyleGuidelines.html#//apple_ref/doc/uid/TP40013782-CH6-SW1
    - https://titlecaseconverter.com/

commit 3286da29b334bd4526c587b17707c2f230cec8f5
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 16:36:50 2018 -0500

    Fix bug for macOS ‘Window’ menu with setup options

commit 236a23d1eafe2a16073394a27b9013298b682a25
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 16:27:46 2018 -0500

    Test menus with included setup options

commit c5d5f5abb8d7f52d6a4aa182a86c92f7ddceade0
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 16:10:27 2018 -0500

    Move settings (‘Preferences’) into OS-level menu

    This reduces our reliance on custom UI until we have more design resources.

commit 027803f8f4983cffa443f0beff1854dcf541689b
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 16:02:56 2018 -0500

    Prepare tests for menu with/without included setup

commit 9e2f006924b85eb249a8a1261c1c4dd1a706afa6
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 15:55:46 2018 -0500

    Destructure `includeSetup`

commit 6b2a1eccdf724fd722e58415d2700da73942d9e8
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 15:55:14 2018 -0500

    🔤 `createTemplate` `options`

commit c2fecba34b153fed106f414ed3347d46299f6fe5
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 12:49:55 2018 -0500

    Test menu for Windows and Linux

commit 60281b1af9ad1f022cdbc40711ebd0b688a7355d
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 12:40:39 2018 -0500

    Add `yarn run test-app` command

commit 1a0489919c0a97b03fe88196260fef894fb3d9e4
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 12:40:29 2018 -0500

    Add test for `SignalMenu.createTemplate` on macOS

commit 9638b86c0f00f231e44562a5aa01626f0e5fdd8b
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 12:34:46 2018 -0500

    Make `createTemplate` pure

    Extracting `options.platform` makes it easier to test without having to
    stub `process.platform`.

commit 9c26404892d7c9a7bd0199a9e8367a165a3b365c
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 11:47:39 2018 -0500

    Extract `locale.load` `appLocale` & `logger` for testability

    This allows us to run this code in a non-Electron environment, e.g. Node.js
    Mocha test suite.

commit 710b22438df25c8d5e8431845a035c55ec8fc0b7
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 11:46:13 2018 -0500

    🔤 npm scripts

commit 9ae22937fbce078f91443023b560b3c0468c1380
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 11:45:30 2018 -0500

    Use 2-space indendation for `app` module tests

commit 22c26baf6159bd2e1f5a787c10e2260f09395329
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 11:22:55 2018 -0500

    Prefer named exports

commit 9c9526195266ac77ac2ca04135a1e675f617dfd2
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 11:22:46 2018 -0500

    🔤 Organize `require`s

commit 2f144d24d9e9a9ef72fe418996e3c911b304b00a
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Tue Feb 27 11:13:50 2018 -0500

    Remove existing global hamburger menu

    This will be replaced by a OS-level ‘Preferences’ menu.

commit f5adb374cb742e5f319ececda8ab6d8adee88d7e
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Mon Feb 26 18:40:54 2018 -0500

    Remove ‘Restart Signal’ menu from settings

    Apparently, this is a remnant from the Chrome web application.

commit d7a206bc8e67ef44022085e804ca040ed1b219f7
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Mon Feb 26 17:16:49 2018 -0500

    Clarify label for starting a new conversation

    When user a enters a number that is not a contact, we prompt them to start a new
    conversation.

commit 715a4064367fb61d85c1a4f9d48261b2ce002435
Author: Daniel Gasienica <daniel@gasienica.ch>
Date:   Mon Feb 26 16:46:26 2018 -0500

    Use ‘Enter name or number’ as prompt’

    This follows implementation of Android and recommendation from Alissa.

.editorconfig

@@ -10,5 +10,5 @@ indent_style = space
 insert_final_newline = true
 trim_trailing_whitespace = true
 
-[{js/modules/**/*.js, test/modules/**/*.js}]
+[{js/modules/**/*.js, test/app/**/*.js, test/modules/**/*.js}]
 indent_size = 2

_locales/en/messages.json

@@ -19,16 +19,20 @@
       "message": "&Help",
       "description": "The label that is used for the Help menu in the program main menu. The '&' indicates that the following letter will be used as the keyboard 'shortcut letter' for accessing the menu with the Alt-<letter> combination."
     },
+    "mainMenuSettings": {
+      "message": "Preferences…",
+      "description": "The label that is used for the Preferences menu in the program main menu. This should be consistent with the standard naming for ‘Preferences’ on the operating system."
+    },
     "menuSetupWithImport": {
-      "message": "Set up with import",
+      "message": "Set Up with Import",
       "description": "When the application is not yet set up, menu option to start up the import sequence"
     },
     "menuSetupAsNewDevice": {
-      "message": "Set up as new device",
+      "message": "Set Up as New Device",
       "description": "When the application is not yet set up, menu option to start up the set up as fresh device"
     },
     "menuSetupAsStandalone": {
-      "message": "Set up as standalone device",
+      "message": "Set Up as Standalone Device",
       "description": "Only available on development modes, menu option to open up the standalone device setup sequence"
     },
     "loading": {
@@ -368,22 +372,22 @@
     },
     "debugLog": {
       "message": "Debug Log",
-      "description": "View menu item to open the debug log, capitalized"
+      "description": "View menu item to open the debug log (title case)"
     },
     "goToReleaseNotes": {
-      "message": "Go to release notes",
+      "message": "Go to Release Notes",
       "description": ""
     },
     "goToForums": {
-      "message": "Go to forums",
+      "message": "Go to Forums",
       "description": "Item under the Help menu, takes you to the forums"
     },
     "goToSupportPage": {
-      "message": "Go to support page",
+      "message": "Go to Support Page",
       "description": "Item under the Help menu, takes you to the support page"
     },
     "fileABug": {
-      "message": "File a bug",
+      "message": "File a Bug",
       "description": "Item under the Help menu, takes you to GitHub new issue form"
     },
     "aboutSignalDesktop": {
@@ -411,7 +415,7 @@
       "description": "Tooltip for the tray icon"
     },
     "searchForPeopleOrGroups": {
-      "message": "Search...",
+      "message": "Enter name or number",
       "description": "Placeholder text in the search input"
     },
     "welcomeToSignal": {
@@ -595,10 +599,6 @@
         "message": "New Messages",
         "description": "Displayed in notifications for multiple messages"
     },
-    "restartSignal": {
-        "message": "Restart Signal",
-        "description": "Menu item for restarting the program."
-    },
     "messageNotSent": {
         "message": "Message not sent.",
         "description": "Informational label, appears on messages that failed to send"
@@ -835,9 +835,9 @@
       "message": "Hide menu bar",
       "description": "Label text for menu bar visibility setting"
     },
-    "newContact": {
+    "startConversation": {
-      "message": "Click to create new contact",
+      "message": "Start conversation…",
-      "description": ""
+      "description": "Label underneath number a user enters that is not an existing contact"
     },
     "newPhoneNumber": {
       "message": "Enter a phone number to add a contact.",

app/locale.js

@@ -1,9 +1,7 @@
 const path = require('path');
 const fs = require('fs');
-const { app } = require('electron');
 const _ = require('lodash');
 
-const logging = require('./logging');
 
 function normalizeLocaleName(locale) {
   if (/^en-/.test(locale)) {
@@ -27,15 +25,17 @@ function getLocaleMessages(locale) {
   return JSON.parse(fs.readFileSync(targetFile, 'utf-8'));
 }
 
-function load() {
+function load({ appLocale, logger } = {}) {
-  const logger = logging.getLogger();
+  if (!appLocale) {
-  const english = getLocaleMessages('en');
+    throw new TypeError('`appLocale` is required');
-  let appLocale = app.getLocale();
-
-  if (process.env.NODE_ENV === 'test') {
-    appLocale = 'en';
   }
 
+  if (!logger || !logger.error) {
+    throw new TypeError('`logger.error` is required');
+  }
+
+  const english = getLocaleMessages('en');
+
   // Load locale - if we can't load messages for the current locale, we
   // default to 'en'
   //

app/menu.js

@@ -1,19 +1,37 @@
-function createTemplate(options, messages) {
+const isString = require('lodash/isString');
+
+
+exports.createTemplate = (options, messages) => {
+  if (!isString(options.platform)) {
+    throw new TypeError('`options.platform` must be a string');
+  }
+
   const {
+    includeSetup,
     openForums,
     openNewBugForm,
     openReleaseNotes,
     openSupportPage,
+    platform,
     setupAsNewDevice,
     setupAsStandalone,
     setupWithImport,
     showAbout,
     showDebugLog,
+    showSettings,
   } = options;
 
   const template = [{
     label: messages.mainMenuFile.message,
     submenu: [
+      {
+        label: messages.mainMenuSettings.message,
+        accelerator: 'CommandOrControl+,',
+        click: showSettings,
+      },
+      {
+        type: 'separator',
+      },
       {
         role: 'quit',
       },
@@ -126,7 +144,7 @@ function createTemplate(options, messages) {
     ],
   }];
 
-  if (options.includeSetup) {
+  if (includeSetup) {
     const fileMenu = template[0];
 
     // These are in reverse order, since we're prepending them one at a time
@@ -137,6 +155,9 @@ function createTemplate(options, messages) {
       });
     }
 
+    fileMenu.submenu.unshift({
+      type: 'separator',
+    });
     fileMenu.submenu.unshift({
       label: messages.menuSetupAsNewDevice.message,
       click: setupAsNewDevice,
@@ -147,19 +168,21 @@ function createTemplate(options, messages) {
     });
   }
 
-  if (process.platform === 'darwin') {
+  if (platform === 'darwin') {
     return updateForMac(template, messages, options);
   }
 
   return template;
-}
+};
 
 function updateForMac(template, messages, options) {
   const {
+    includeSetup,
     setupAsNewDevice,
     setupAsStandalone,
     setupWithImport,
     showAbout,
+    showSettings,
     showWindow,
   } = options;
 
@@ -170,7 +193,7 @@ function updateForMac(template, messages, options) {
   // Remove File menu
   template.shift();
 
-  if (options.includeSetup) {
+  if (includeSetup) {
     // Add a File menu just for these setup options. Because we're using unshift(), we add
     //   the file menu first, though it ends up to the right of the Signal Desktop menu.
     const fileMenu = {
@@ -207,6 +230,14 @@ function updateForMac(template, messages, options) {
       {
         type: 'separator',
       },
+      {
+        label: messages.mainMenuSettings.message,
+        accelerator: 'CommandOrControl+,',
+        click: showSettings,
+      },
+      {
+        type: 'separator',
+      },
       {
         role: 'hide',
       },
@@ -226,7 +257,7 @@ function updateForMac(template, messages, options) {
   });
 
   // Add to Edit menu
-  const editIndex = options.includeSetup ? 2 : 1;
+  const editIndex = includeSetup ? 2 : 1;
   template[editIndex].submenu.push(
     {
       type: 'separator',
@@ -245,9 +276,9 @@ function updateForMac(template, messages, options) {
   );
 
   // Replace Window menu
-  const windowIndex = options.includeSetup ? 4 : 3;
+  const windowMenuTemplateIndex = includeSetup ? 4 : 3;
   // eslint-disable-next-line no-param-reassign
-  template[windowIndex].submenu = [
+  template[windowMenuTemplateIndex].submenu = [
     {
       accelerator: 'CmdOrCtrl+W',
       role: 'close',
@@ -273,5 +304,3 @@ function updateForMac(template, messages, options) {
 
   return template;
 }
-
-module.exports = createTemplate;

background.html

@@ -69,17 +69,6 @@
     <div class='gutter'>
         <div class='network-status-container'></div>
         <div class='title-bar active' id='header'>
-          <div class='header-buttons right'>
-            <div class='vertical-align'>
-              <div class='global-menu menu'>
-                <button class='hamburger' alt='signal menu'></button>
-                <ul class='menu-list'>
-                    <li class='showSettings'>{{ settings }}</li>
-                    <li class='restart-signal'>{{ restartSignal }}</li>
-                </ul>
-              </div>
-            </div>
-          </div>
           <h1>Signal</h1>
           <div class='tool-bar clearfix'>
             <input type='search' class='search' placeholder='{{ searchForPeopleOrGroups }}' dir='auto'>

js/background.js

@@ -170,6 +170,16 @@
         Whisper.events.on('showDebugLog', function() {
             appView.openDebugLog();
         });
+        Whisper.events.on('showSettings', () => {
+            if (!appView || !appView.inboxView) {
+                console.log(
+                    'background: Event: \'showSettings\':' +
+                    ' Expected `appView.inboxView` to exist.'
+                );
+                return;
+            }
+            appView.inboxView.showSettings();
+        });
         Whisper.events.on('unauthorized', function() {
             appView.inboxView.networkStatusView.update();
         });

js/views/conversation_search_view.js

@@ -22,7 +22,7 @@
     },
     render_attributes() {
       return {
-        number: i18n('newContact'),
+        number: i18n('startConversation'),
         title: this.model.getNumber(),
         avatar: this.model.getAvatar(),
       };

js/views/inbox_view.js

@@ -165,17 +165,13 @@
       selectAContact: i18n('selectAContact'),
       searchForPeopleOrGroups: i18n('searchForPeopleOrGroups'),
       settings: i18n('settings'),
-      restartSignal: i18n('restartSignal'),
     },
     events: {
       click: 'onClick',
       'click #header': 'focusHeader',
       'click .conversation': 'focusConversation',
-      'click .global-menu .hamburger': 'toggleMenu',
-      'click .showSettings': 'showSettings',
       'select .gutter .conversation-list-item': 'openConversation',
       'input input.search': 'filterContacts',
-      'click .restart-signal': window.restart,
       'show .lightbox': 'showLightbox',
     },
     startConnectionListener() {
@@ -260,9 +256,6 @@
         this.focusConversation();
       }
     },
-    toggleMenu() {
-      this.$('.global-menu .menu-list').toggle();
-    },
     showLightbox(e) {
       this.$el.append(e.target);
     },
@@ -272,15 +265,7 @@
       }
       this.$('.conversation:first .recorder').trigger('close');
     },
-    closeMenu(e) {
-      if (e && this.$(e.target).parent('.global-menu').length > 0) {
-        return;
-      }
-
-      this.$('.global-menu .menu-list').hide();
-    },
     onClick(e) {
-      this.closeMenu(e);
       this.closeRecording(e);
     },
   });

main.js

@@ -16,11 +16,11 @@ const {
 
 const packageJson = require('./package.json');
 
-const createTrayIcon = require('./app/tray_icon');
-const createTemplate = require('./app/menu.js');
-const logging = require('./app/logging');
 const autoUpdate = require('./app/auto_update');
+const createTrayIcon = require('./app/tray_icon');
+const logging = require('./app/logging');
 const windowState = require('./app/window_state');
+const { createTemplate } = require('./app/menu');
 
 const appUserModelId = `org.whispersystems.${packageJson.name}`;
 console.log('Set Windows Application User Model ID (AUMID)', { appUserModelId });
@@ -324,6 +324,14 @@ function showDebugLog() {
   }
 }
 
+function showSettings() {
+  if (!mainWindow) {
+    return;
+  }
+
+  mainWindow.webContents.send('show-settings');
+}
+
 function openReleaseNotes() {
   shell.openExternal(`https://github.com/signalapp/Signal-Desktop/releases/tag/v${app.getVersion()}`);
 }
@@ -415,7 +423,8 @@ app.on('ready', () => {
     }
 
     if (!locale) {
-      locale = loadLocale();
+      const appLocale = process.env.NODE_ENV === 'test' ? 'en' : app.getLocale();
+      locale = loadLocale({ appLocale, logger });
     }
 
     ready = true;
@@ -434,6 +443,7 @@ app.on('ready', () => {
 });
 
 function setupMenu(options) {
+  const { platform } = process;
   const menuOptions = Object.assign({}, options, {
     development,
     showDebugLog,
@@ -443,9 +453,11 @@ function setupMenu(options) {
     openNewBugForm,
     openSupportPage,
     openForums,
+    platform,
     setupWithImport,
     setupAsNewDevice,
     setupAsStandalone,
+    showSettings,
   });
   const template = createTemplate(menuOptions, locale.messages);
   const menu = Menu.buildFromTemplate(template);

package.json

@@ -12,7 +12,7 @@
   "main": "main.js",
   "scripts": {
     "postinstall": "electron-builder install-app-deps && rimraf node_modules/dtrace-provider",
-    "test": "npm run eslint && npm run test-server && grunt test && npm run test-modules",
+    "test": "npm run eslint && npm run test-server && grunt test && npm run test-app && npm run test-modules",
     "lint": "grunt jshint",
     "start": "electron .",
     "asarl": "asar l release/mac/Signal.app/Contents/Resources/app.asar",
@@ -36,9 +36,10 @@
     "release-win": "npm run build-release -- -w --prepackaged release/windows --publish=always",
     "release-lin": "npm run build-release -- -l --prepackaged release/linux && NAME=$npm_package_name VERSION=$npm_package_version ./aptly.sh",
     "release": "npm run release-mac && npm run release-win && npm run release-lin",
+    "test-app": "mocha --recursive test/app",
+    "test-modules": "mocha --recursive test/modules",
     "test-server": "mocha --recursive test/server",
     "test-server-coverage": "nyc --reporter=lcov --reporter=text mocha --recursive test/server",
-    "test-modules": "mocha --recursive test/modules",
     "eslint": "eslint .",
     "open-coverage": "open coverage/lcov-report/index.html"
   },

preload.js

@@ -54,6 +54,10 @@
     Whisper.events.trigger('setupAsStandalone');
   });
 
+  ipc.on('show-settings', function() {
+    Whisper.events.trigger('showSettings');
+  });
+
   window.addSetupMenuItems = function() {
     ipc.send('add-setup-menu-items');
   }

test/app/fixtures/menu-mac-os-setup.json

@@ -0,0 +1,180 @@
+[
+  {
+    "submenu": [
+      {
+        "label": "About Signal Desktop",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Preferences…",
+        "accelerator": "CommandOrControl+,",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "hide"
+      },
+      {
+        "role": "hideothers"
+      },
+      {
+        "role": "unhide"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "quit"
+      }
+    ]
+  },
+  {
+    "label": "&File",
+    "submenu": [
+      {
+        "label": "Set Up with Import",
+        "click": null
+      },
+      {
+        "label": "Set Up as New Device",
+        "click": null
+      }
+    ]
+  },
+  {
+    "label": "&Edit",
+    "submenu": [
+      {
+        "role": "undo"
+      },
+      {
+        "role": "redo"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "cut"
+      },
+      {
+        "role": "copy"
+      },
+      {
+        "role": "paste"
+      },
+      {
+        "role": "pasteandmatchstyle"
+      },
+      {
+        "role": "delete"
+      },
+      {
+        "role": "selectall"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Speech",
+        "submenu": [
+          {
+            "role": "startspeaking"
+          },
+          {
+            "role": "stopspeaking"
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "label": "&View",
+    "submenu": [
+      {
+        "role": "resetzoom"
+      },
+      {
+        "role": "zoomin"
+      },
+      {
+        "role": "zoomout"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "togglefullscreen"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Debug Log",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "toggledevtools"
+      }
+    ]
+  },
+  {
+    "label": "&Window",
+    "role": "window",
+    "submenu": [
+      {
+        "accelerator": "CmdOrCtrl+W",
+        "role": "close"
+      },
+      {
+        "accelerator": "CmdOrCtrl+M",
+        "role": "minimize"
+      },
+      {
+        "role": "zoom"
+      },
+      {
+        "label": "Show",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "front"
+      }
+    ]
+  },
+  {
+    "label": "&Help",
+    "role": "help",
+    "submenu": [
+      {
+        "label": "Go to Release Notes",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Go to Forums",
+        "click": null
+      },
+      {
+        "label": "Go to Support Page",
+        "click": null
+      },
+      {
+        "label": "File a Bug",
+        "click": null
+      }
+    ]
+  }
+]

test/app/fixtures/menu-mac-os.json

@@ -0,0 +1,167 @@
+[
+  {
+    "submenu": [
+      {
+        "label": "About Signal Desktop",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Preferences…",
+        "accelerator": "CommandOrControl+,",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "hide"
+      },
+      {
+        "role": "hideothers"
+      },
+      {
+        "role": "unhide"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "quit"
+      }
+    ]
+  },
+  {
+    "label": "&Edit",
+    "submenu": [
+      {
+        "role": "undo"
+      },
+      {
+        "role": "redo"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "cut"
+      },
+      {
+        "role": "copy"
+      },
+      {
+        "role": "paste"
+      },
+      {
+        "role": "pasteandmatchstyle"
+      },
+      {
+        "role": "delete"
+      },
+      {
+        "role": "selectall"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Speech",
+        "submenu": [
+          {
+            "role": "startspeaking"
+          },
+          {
+            "role": "stopspeaking"
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "label": "&View",
+    "submenu": [
+      {
+        "role": "resetzoom"
+      },
+      {
+        "role": "zoomin"
+      },
+      {
+        "role": "zoomout"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "togglefullscreen"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Debug Log",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "toggledevtools"
+      }
+    ]
+  },
+  {
+    "label": "&Window",
+    "role": "window",
+    "submenu": [
+      {
+        "accelerator": "CmdOrCtrl+W",
+        "role": "close"
+      },
+      {
+        "accelerator": "CmdOrCtrl+M",
+        "role": "minimize"
+      },
+      {
+        "role": "zoom"
+      },
+      {
+        "label": "Show",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "front"
+      }
+    ]
+  },
+  {
+    "label": "&Help",
+    "role": "help",
+    "submenu": [
+      {
+        "label": "Go to Release Notes",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Go to Forums",
+        "click": null
+      },
+      {
+        "label": "Go to Support Page",
+        "click": null
+      },
+      {
+        "label": "File a Bug",
+        "click": null
+      }
+    ]
+  }
+]

test/app/fixtures/menu-windows-linux-setup.json

@@ -0,0 +1,135 @@
+[
+  {
+    "label": "&File",
+    "submenu": [
+      {
+        "label": "Set Up with Import",
+        "click": null
+      },
+      {
+        "label": "Set Up as New Device",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Preferences…",
+        "accelerator": "CommandOrControl+,",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "quit"
+      }
+    ]
+  },
+  {
+    "label": "&Edit",
+    "submenu": [
+      {
+        "role": "undo"
+      },
+      {
+        "role": "redo"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "cut"
+      },
+      {
+        "role": "copy"
+      },
+      {
+        "role": "paste"
+      },
+      {
+        "role": "pasteandmatchstyle"
+      },
+      {
+        "role": "delete"
+      },
+      {
+        "role": "selectall"
+      }
+    ]
+  },
+  {
+    "label": "&View",
+    "submenu": [
+      {
+        "role": "resetzoom"
+      },
+      {
+        "role": "zoomin"
+      },
+      {
+        "role": "zoomout"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "togglefullscreen"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Debug Log",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "toggledevtools"
+      }
+    ]
+  },
+  {
+    "label": "&Window",
+    "role": "window",
+    "submenu": [
+      {
+        "role": "minimize"
+      }
+    ]
+  },
+  {
+    "label": "&Help",
+    "role": "help",
+    "submenu": [
+      {
+        "label": "Go to Release Notes",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Go to Forums",
+        "click": null
+      },
+      {
+        "label": "Go to Support Page",
+        "click": null
+      },
+      {
+        "label": "File a Bug",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "About Signal Desktop",
+        "click": null
+      }
+    ]
+  }
+]

test/app/fixtures/menu-windows-linux.json

@@ -0,0 +1,124 @@
+[
+  {
+    "label": "&File",
+    "submenu": [
+      {
+        "label": "Preferences…",
+        "accelerator": "CommandOrControl+,",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "quit"
+      }
+    ]
+  },
+  {
+    "label": "&Edit",
+    "submenu": [
+      {
+        "role": "undo"
+      },
+      {
+        "role": "redo"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "cut"
+      },
+      {
+        "role": "copy"
+      },
+      {
+        "role": "paste"
+      },
+      {
+        "role": "pasteandmatchstyle"
+      },
+      {
+        "role": "delete"
+      },
+      {
+        "role": "selectall"
+      }
+    ]
+  },
+  {
+    "label": "&View",
+    "submenu": [
+      {
+        "role": "resetzoom"
+      },
+      {
+        "role": "zoomin"
+      },
+      {
+        "role": "zoomout"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "togglefullscreen"
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Debug Log",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "role": "toggledevtools"
+      }
+    ]
+  },
+  {
+    "label": "&Window",
+    "role": "window",
+    "submenu": [
+      {
+        "role": "minimize"
+      }
+    ]
+  },
+  {
+    "label": "&Help",
+    "role": "help",
+    "submenu": [
+      {
+        "label": "Go to Release Notes",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "Go to Forums",
+        "click": null
+      },
+      {
+        "label": "Go to Support Page",
+        "click": null
+      },
+      {
+        "label": "File a Bug",
+        "click": null
+      },
+      {
+        "type": "separator"
+      },
+      {
+        "label": "About Signal Desktop",
+        "click": null
+      }
+    ]
+  }
+]

test/app/menu_test.js

@@ -0,0 +1,78 @@
+const { assert } = require('chai');
+
+const SignalMenu = require('../../app/menu');
+const { load: loadLocale } = require('../../app/locale');
+
+
+const PLATFORMS = [
+  {
+    label: 'macOS',
+    platform: 'darwin',
+    fixtures: {
+      default: './fixtures/menu-mac-os',
+      setup: './fixtures/menu-mac-os-setup',
+    },
+  },
+  {
+    label: 'Windows',
+    platform: 'win32',
+    fixtures: {
+      default: './fixtures/menu-windows-linux',
+      setup: './fixtures/menu-windows-linux-setup',
+    },
+  },
+  {
+    label: 'Linux',
+    platform: 'linux',
+    fixtures: {
+      default: './fixtures/menu-windows-linux',
+      setup: './fixtures/menu-windows-linux-setup',
+    },
+  },
+];
+
+const INCLUDE_SETUP_OPTIONS = [false, true];
+
+describe('SignalMenu', () => {
+  describe('createTemplate', () => {
+    PLATFORMS.forEach(({ label, platform, fixtures }) => {
+      context(label, () => {
+        INCLUDE_SETUP_OPTIONS.forEach((includeSetup) => {
+          const prefix = includeSetup ? 'with' : 'without';
+          context(`${prefix} setup options`, () => {
+            it('should return correct template', () => {
+              const logger = {
+                error(message) {
+                  throw new Error(message);
+                },
+              };
+              const options = {
+                openForums: null,
+                openNewBugForm: null,
+                openReleaseNotes: null,
+                openSupportPage: null,
+                platform,
+                includeSetup,
+                setupAsNewDevice: null,
+                setupAsStandalone: null,
+                setupWithImport: null,
+                showAbout: null,
+                showDebugLog: null,
+                showSettings: null,
+                showWindow: null,
+              };
+              const appLocale = 'en';
+              const { messages } = loadLocale({ appLocale, logger });
+
+              const actual = SignalMenu.createTemplate(options, messages);
+              const fixturePath = includeSetup ? fixtures.setup : fixtures.default;
+              // eslint-disable-next-line global-require, import/no-dynamic-require
+              const fixture = require(fixturePath);
+              assert.deepEqual(actual, fixture);
+            });
+          });
+        });
+      });
+    });
+  });
+});

test/index.html

@@ -41,17 +41,6 @@
     <div class='gutter'>
         <div class='network-status-container'></div>
         <div class='title-bar active' id='header'>
-          <div class='header-buttons right'>
-            <div class='vertical-align'>
-              <div class='global-menu menu'>
-                <button class='hamburger' alt='signal menu'></button>
-                <ul class='menu-list'>
-                    <li class='showSettings'>{{ settings }}</li>
-                    <li class='restart-signal'>{{ restartSignal }}</li>
-                </ul>
-              </div>
-            </div>
-          </div>
           <h1>Signal</h1>
           <div class='tool-bar clearfix'>
             <input type='search' class='search' placeholder='{{ searchForPeopleOrGroups }}' dir='auto'>