Full styleguide now available via yarn styleguide

Due to a number of hacks, the style guide can be used to show Backbone
views. This will allow a smooth path from the old way of doing things to
the new.

test/index.html

@@ -583,6 +583,7 @@
 
   <script type="text/javascript" src="../js/chromium.js" data-cover></script>
 
+  <script type='text/javascript' src='../js/views/backbone_wrapper_view.js'></script>
   <script type='text/javascript' src='../js/views/whisper_view.js' data-cover></script>
   <script type='text/javascript' src='../js/views/debug_log_view.js' data-cover></script>
   <script type='text/javascript' src='../js/views/toast_view.js' data-cover></script>

test/legacy_bridge.js

@@ -0,0 +1,42 @@
+
+// Because we aren't hosting the styleguide in Electron, we can't rely on preload.js
+//   to set things up for us. This gives us the minimum bar shims for everything it
+//   provdes.
+//
+// Remember, the idea here is just to enable visual testing, no full functionality. Most
+//   of thise can be very simple.
+
+window.PROTO_ROOT = '/protos';
+window.nodeSetImmediate = () => {};
+
+window.Signal = {};
+window.Signal.Backup = {};
+window.Signal.Crypto = {};
+window.Signal.Logs = {};
+window.Signal.Migrations = {};
+
+window.Signal.React = window.Signal.React = {};
+
+window.EmojiConvertor = function EmojiConvertor() {};
+window.EmojiConvertor.prototype.init_colons = () => {}
+window.EmojiConvertor.prototype.signalReplace = html => html;
+window.EmojiConvertor.prototype.replace_unified = string => string;
+window.EmojiConvertor.prototype.img_sets = {
+  apple: {}
+};
+
+window.i18n = () => '';
+
+window.Signal.Migrations.V17 = {};
+window.Signal.OS = {};
+window.Signal.Types = {};
+window.Signal.Types.Attachment = {};
+window.Signal.Types.Errors = {};
+window.Signal.Types.Message = {
+  initializeSchemaVersion: attributes => attributes,
+};
+window.Signal.Types.MIME = {};
+window.Signal.Types.Settings = {};
+window.Signal.Views = {};
+window.Signal.Views.Initialization = {};
+window.Signal.Workflow = {};

test/legacy_templates.js

@@ -0,0 +1,45 @@
+
+// Taken from background.html.
+// Templates are here solely to support the Backbone views rendered in the styleguide.
+
+window.Whisper.View.Templates = {
+  hasRetry: `
+    {{ messageNotSent }}
+    <span href='#' class='retry'>{{ resend }}</span>
+  `,
+  'some-failed': `
+    {{ someFailed }}
+  `,
+  keychange: `
+    <span class='content' dir='auto'><span class='shield icon'></span> {{ content }}</span>
+  `,
+  'verified-change': `
+    <span class='content' dir='auto'><span class='{{ icon }} icon'></span> {{ content }}</span>
+  `,
+  message: `
+    {{> avatar }}
+    <div class='bubble {{ avatar.color }}'>
+        <div class='sender' dir='auto'>
+          {{ sender }}
+          {{ #profileName }}
+            <span class='profileName'>{{ profileName }} </span>
+          {{ /profileName }}
+        </div>
+        <div class='attachments'></div>
+        <p class='content' dir='auto'>
+          {{ #message }}<span class='body'>{{ message }}</span>{{ /message }}
+        </p>
+        <div class='meta'>
+          <span class='timestamp' data-timestamp={{ timestamp }}></span>
+          <span class='status hide'></span>
+          <span class='timer'></span>
+        </div>
+    </div>
+  `,
+  hourglass: `
+    <span class='hourglass'><span class='sand'></span></span>
+  `,
+  expirationTimerUpdate: `
+    <span class='content'><span class='icon clock'></span> {{ content }}</span>
+  `
+};