ui: switch back to public onboarding

ui/app/components/context-create/index.hbs

@@ -1,7 +1,7 @@
 <CopyableCode @ref="context-create">
  <pre><code id="context-create">waypoint context create \
  -server-addr={{this.hostname}} \
- -server-auth-token={{this.token}} \
+ -server-auth-token=<span data-test-token=true>{{this.token}}</span> \
  -server-require-auth=true \
  -set-default {{this.contextName}}</code></pre>
 </CopyableCode>

ui/app/routes/onboarding/install/index.ts

@@ -1,24 +1,24 @@
 import Route from '@ember/routing/route';
-// import { UAParser } from 'ua-parser-js';
+import { UAParser } from 'ua-parser-js';
 
 export default class OnboardingInstallIndex extends Route {
- // redirect() {
- //  const parser = new UAParser();
- //
- //  switch (parser.getResult().os.name) {
- //  case 'Mac OS':
- //  return this.transitionTo('onboarding.install.homebrew');
- //  case 'Windows':
- //  return this.transitionTo('onboarding.install.chocolatey');
- //  case 'Debian':
- //  case 'Ubuntu':
- //  return this.transitionTo('onboarding.install.linux.ubuntu');
- //  case 'CentOS':
- //  return this.transitionTo('onboarding.install.linux.centos');
- //  case 'Fedora':
- //  return this.transitionTo('onboarding.install.linux.fedora');
- //  default:
- //  return this.transitionTo('onboarding.install.manual');
- //  }
- // }
+ redirect() {
+ const parser = new UAParser();
+
+ switch (parser.getResult().os.name) {
+ case 'Mac OS':
+ return this.transitionTo('onboarding.install.homebrew');
+ case 'Windows':
+ return this.transitionTo('onboarding.install.chocolatey');
+ case 'Debian':
+ case 'Ubuntu':
+ return this.transitionTo('onboarding.install.linux.ubuntu');
+ case 'CentOS':
+ return this.transitionTo('onboarding.install.linux.centos');
+ case 'Fedora':
+ return this.transitionTo('onboarding.install.linux.fedora');
+ default:
+ return this.transitionTo('onboarding.install.manual');
+ }
+ }
 }

ui/app/templates/onboarding/connect.hbs

@@ -14,5 +14,6 @@
 <hr />
 
 <div class="onboarding-footer">
- <LinkTo @route="onboarding.start" class="button button--secondary">Continue to Next Step</LinkTo>
+ <LinkTo @route="onboarding.start" data-test-next-step=true class="button button--secondary">Continue to Next Step
+ </LinkTo>
 </div>

ui/app/templates/onboarding/install.hbs

@@ -6,37 +6,58 @@
  </div>
 </div>
 
-<div class="onboarding-step">
- <p>Waypoint uses both a client and a server to build, deploy, and release applications. Anyone using Waypoint to
- deploy from their workstation will need to install Waypoint locally.</p>
-
- <h2>Download the binary</h2>
-
- <p>To install Waypoint, find the appropriate package for your system and download the zip archive.</p>
-
- <p>
- <ExternalLink href="https://go.hashi.co/waypoint-beta-binaries" class="button button--primary">
- {{inline-svg "download" class="icon"}}
- <span>Download</span>
- </ExternalLink>
- </p>
+<hr />
 
- <p>After downloading Waypoint, unzip the downloaded archive. Waypoint runs as a single binary named
-  <code>waypoint</code>. It is recommended that you move it to a directory in your <code>PATH</code>
- to allow you to execute it from any directory.
+<div class="onboarding-step">
+ <p>Anyone using Waypoint to deploy from their workstation needs to install it locally. The below
+ instructions guide you through that for various operating systems.
  </p>
 
- <p>For example:</p>
- <p>
- <code class="output">$ mv ~/Downloads/waypoint /usr/local/bin/</code>
- </p>
- <p><strong>Note:</strong> Due to the Waypoint beta currently being private, Homebrew, Linux packages, and Chocolatey
- installation methods are not yet available.
- </p>
+ <h2>Install Waypoint</h2>
+
+ <nav>
+ <ul>
+ <li>
+ <LinkTo @route="onboarding.install.manual">Manual installation</LinkTo>
+ </li>
+ <li>
+ <LinkTo @route="onboarding.install.homebrew">Homebrew on OS X</LinkTo>
+ </li>
+ <li>
+ <LinkTo @route="onboarding.install.chocolatey">Chocolatey on Windows</LinkTo>
+ </li>
+ <li>
+ <LinkTo @route="onboarding.install.linux">Linux</LinkTo>
+ </li>
+ </ul>
+ </nav>
+
+ {{outlet}}
+
+ <h2>Verify the installation</h2>
+
+ <p>After installing Waypoint, verify that the installation worked by opening a new terminal session and running the
+ command <code>waypoint</code>.</p>
+
+ <CopyableCode @ref="verify-waypoint">
+ <pre><code id="verify-waypoint">waypoint</code></pre>
+ </CopyableCode>
+
+ <pre><code class="output">usage: waypoint [-version] [-help] [-autocomplete-(un)install] &lt;command&gt; [&lt;args&gt;]
+
+Common commands:
+ build Build a new versioned artifact from source.
+ deploy Deploy a pushed artifact.
+ ...</code></pre>
+
+ <p>If you get an error that <code>waypoint</code> could not be found, your <code>PATH</code> environment variable was
+ not set up properly. Make sure that your <code>PATH</code> variable contains the directory where you installed
+ Waypoint.</p>
 </div>
 
 <hr />
 
 <div class="onboarding-footer">
- <LinkTo @route="onboarding.connect" class="button button--secondary">Continue to Next Step</LinkTo>
+ <LinkTo @route="onboarding.connect" data-test-next-step=true class="button button--secondary">Continue to Next Step
+ </LinkTo>
 </div>

ui/app/templates/onboarding/install/homebrew.hbs

@@ -1,4 +1,7 @@
-<p>Homebrew is a free and open-source package management system for Mac OS X. Install the official <ExternalLink href="https://go.hashi.co/waypoint-beta-binaries">Waypoint formula</ExternalLink> from the terminal.</p>
+<p>
+ Homebrew is a free and open-source package management system for Mac OS X. Install the official
+ Waypoint formula from the terminal.
+</p>
 
 <CopyableCode @ref="brew-install">
  <pre><code id="brew-install">brew install hashicorp/tap/waypoint</code></pre>

ui/app/templates/onboarding/install/manual.hbs

@@ -1,21 +1,12 @@
-<p>To install Waypoint, find the <ExternalLink href="https://go.hashi.co/waypoint-beta-binaries">appropriate package</ExternalLink> for your system and download it. Waypoint is packaged as a zip archive.</p>
-
-<p>After downloading Waypoint, unzip the package. Waypoint runs as a single binary named <code>waypoint</code>. Any other files in the package can be safely removed and Waypoint will still function.</p>
-
-<p>Make sure that the <code>waypoint</code> binary is available on your <code>PATH</code>. You can check the locations available on your path by running this command.</p>
-
-<CopyableCode @ref="echo-path">
- <pre><code id="echo-path">echo $PATH</code></pre>
-</CopyableCode>
-
-<pre><code class="output">/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin</code></pre>
-
-<p>The output is a list of locations separated by colons. You can make Waypoint available by moving the binary to one of the listed locations, or by adding Waypoint's location to your <code>PATH</code>.</p>
-
-<div class="onboarding-tip">
- <p><b>Tip (Linux-based or Mac):</b> Permanently add a new location to your path by editing your shell's settings file (usually called something like <code>~/.bashrc</code>, where the part of the file name after the <code>.</code> and before <code>rc</code> is the name of your shell). In that file you will see a line that starts with export <code>PATH=</code>, followed by a colon-separated list of locations. Add the location of the Waypoint binary to that list and save the file. Then reload your shell's configuration with the command source <code>~/.bashrc</code>, replacing <code>bash</code> with the name of your shell.</p>
-</div>
-
-<div class="onboarding-tip">
- <p><b>Tip (Windows):</b> Add a location to your path via the GUI by navigating to <code>Environment Variables</code> in your system settings, and looking for the variable called <code>PATH</code>. You will see a semicolon-separated list of locations. Add the Waypoint binary's location to that list and then launch a new console window.</p>
-</div>
+<p>
+ To install Waypoint manually, find the
+ <ExternalLink href="https://releases.hashicorp.com/waypoint/">appropriate package </ExternalLink>
+ for your system and download it. Waypoint is packaged as a zip archive. After downloading Waypoint,
+ unzip the downloaded archive. It is recommended that you move Waypoint to a directory in your <code>PATH</code>
+ to allow you to execute it from any directory.
+</p>
+
+<p>For example:</p>
+<p>
+ <code class="output">$ mv ~/Downloads/waypoint /usr/local/bin/</code>
+</p>

ui/app/templates/onboarding/start.hbs

@@ -23,5 +23,5 @@
 <hr />
 
 <div class="onboarding-footer">
- <LinkTo class="button button--primary" @route="workspaces">Finish Setup</LinkTo>
+ <LinkTo data-test-next-step=true class="button button--primary" @route="workspaces">Finish Setup</LinkTo>
 </div>

ui/mirage/config.ts

@@ -29,6 +29,7 @@ export default function (this: Server) {
  this.post('/GetProject', project.get);
  this.post('/ConvertInviteToken', token.create);
  this.post('/GenerateInviteToken', inviteToken.create);
+ this.post('/GenerateLoginToken', token.create);
  this.post('/ListReleases', release.list);
  this.post('/GetRelease', release.get);
 

ui/tests/acceptance/onboarding-test.ts

@@ -0,0 +1,87 @@
+import { module, test } from 'qunit';
+import { currentURL } from '@ember/test-helpers';
+import { setupApplicationTest } from 'ember-qunit';
+import { setupMirage } from 'ember-cli-mirage/test-support';
+import { visitable, create, clickable, text } from 'ember-cli-page-object';
+import login from '../helpers/login';
+import { setUa } from '../helpers/set-ua';
+
+const userAgent = window.navigator.userAgent;
+
+module('Acceptance | onboarding index', function (hooks) {
+ const onboardingUrl = '/onboarding';
+
+ const page = create({
+ visit: visitable(onboardingUrl),
+ nextStep: clickable('[data-test-next-step]'),
+ });
+
+ setupApplicationTest(hooks);
+ setupMirage(hooks);
+ login();
+
+ hooks.afterEach(function () {
+ // Reset to the original user agent when this test was initialized
+ setUa(userAgent.valueOf());
+ });
+
+ test('visiting as windows', async function (assert) {
+ setUa(
+ 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.246'
+ );
+ await page.visit();
+
+ assert.equal(currentURL(), `${onboardingUrl}/install/chocolatey`);
+ });
+
+ test('advances to connect', async function (assert) {
+ await page.visit().nextStep();
+
+ assert.equal(currentURL(), `${onboardingUrl}/connect`);
+ });
+});
+
+module('Acceptance | onboarding connect', function (hooks) {
+ const connectUrl = '/onboarding/connect';
+
+ const page = create({
+ visit: visitable(connectUrl),
+ nextStep: clickable('[data-test-next-step]'),
+ token: text('[data-test-token]'),
+ });
+
+ setupApplicationTest(hooks);
+ setupMirage(hooks);
+ login();
+
+ test('advances to start', async function (assert) {
+ await page.visit().nextStep();
+
+ assert.equal(currentURL(), `/onboarding/start`);
+ });
+
+ test('renders a real token', async function (assert) {
+ await page.visit();
+
+ assert.equal(page.token.length, 101);
+ });
+});
+
+module('Acceptance | onboarding start', function (hooks) {
+ const startUrl = '/onboarding/start';
+
+ const page = create({
+ visit: visitable(startUrl),
+ nextStep: clickable('[data-test-next-step]'),
+ });
+
+ setupApplicationTest(hooks);
+ setupMirage(hooks);
+ login();
+
+ test('sends users to default workspace after completion', async function (assert) {
+ await page.visit().nextStep();
+
+ assert.equal(currentURL(), `/default`);
+ });
+});

ui/tests/helpers/set-ua.ts

@@ -0,0 +1,6 @@
+export function setUa(ua: string) {
+ Object.defineProperty(window.navigator, 'userAgent', {
+ value: ua,
+ configurable: true,
+ });
+}