Auto merge of #2067 - Turbo87:login-tests, r=locks

tests: Add basic "successful/failed login" test cases

This PR adds two basic application tests for the login button and the `login` route. Please note that this does not test the `github-login` and `github-authorize` routes yet, which we will do in a follow-up PR.

r? @locks

/cc @carols10cents

Author: bors

app/routes/login.js

@@ -1,5 +1,6 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+import window from 'ember-window-mock';
 
 /**
  * This route will open a popup window directed at the `github-login` route.

app/templates/application.hbs

@@ -65,9 +65,9 @@
       </RlDropdownContainer>
       <span class="sep">|</span>
       {{#if this.session.currentUser}}
-        <RlDropdownContainer class="dropdown-container">
-          <RlDropdownToggle class="dropdown">
-            <UserAvatar @user={{this.session.currentUser}} @size="small" />
+        <RlDropdownContainer class="dropdown-container" data-test-user-menu>
+          <RlDropdownToggle class="dropdown" data-test-toggle>
+            <UserAvatar @user={{this.session.currentUser}} @size="small" data-test-avatar />
             {{ this.session.currentUser.name }}
             <span class='arrow'></span>
           </RlDropdownToggle>

app/templates/components/flash-message.hbs

@@ -1,3 +1,3 @@
-<p id="flash" class={{if this.message "shown"}} ...attributes>
+<p id="flash" class={{if this.message "shown"}} data-test-flash-message ...attributes>
   {{this.message}}
 </p>

tests/acceptance/login-test.js

@@ -0,0 +1,90 @@
+import { module, test } from 'qunit';
+import { setupApplicationTest } from 'ember-qunit';
+import { visit, currentURL, click, waitFor } from '@ember/test-helpers';
+import { defer } from 'rsvp';
+import window, { setupWindowMock } from 'ember-window-mock';
+import setupMirage from '../helpers/setup-mirage';
+
+module('Acceptance | Login', function(hooks) {
+  setupApplicationTest(hooks);
+  setupWindowMock(hooks);
+  setupMirage(hooks);
+
+  test('successful login', async function(assert) {
+    let deferred = defer();
+    let fakeWindow = { closed: false };
+    window.open = (url, target, features) => {
+      assert.equal(url, '/github_login');
+      assert.equal(target, 'Authorization');
+      assert.equal(features, 'width=1000,height=450,toolbar=0,scrollbars=1,status=1,resizable=1,location=1,menuBar=0');
+      deferred.resolve();
+      return fakeWindow;
+    };
+
+    await visit('/');
+    assert.equal(currentURL(), '/');
+
+    await click('[data-test-login-link]');
+    assert.equal(currentURL(), '/');
+
+    // wait for `window.open()` to be called
+    await deferred.promise;
+
+    // simulate the response from the `github-authorize` route
+    window.github_response = JSON.stringify({
+      ok: true,
+      data: {
+        user: {
+          id: 42,
+          login: 'johnnydee',
+          name: 'John Doe',
+          email: 'john@doe.name',
+          avatar: 'https://avatars2.githubusercontent.com/u/12345?v=4',
+          url: 'https://github.com/johnnydee',
+        },
+      },
+    });
+
+    // simulate that the window has been closed by the `github-authorize` route
+    fakeWindow.closed = true;
+
+    // wait for the user menu to show up after the successful login
+    await waitFor('[data-test-user-menu]');
+
+    assert.dom('[data-test-user-menu] [data-test-toggle]').hasText('John Doe');
+  });
+
+  test('failed login', async function(assert) {
+    let deferred = defer();
+    let fakeWindow = { closed: false };
+    window.open = () => {
+      deferred.resolve();
+      return fakeWindow;
+    };
+
+    await visit('/');
+    assert.equal(currentURL(), '/');
+
+    await click('[data-test-login-link]');
+    assert.equal(currentURL(), '/');
+
+    // wait for `window.open()` to be called
+    await deferred.promise;
+
+    // simulate the response from the `github-authorize` route
+    window.github_response = JSON.stringify({
+      ok: false,
+      data: {
+        errors: [{ detail: 'Forbidden' }],
+      },
+    });
+
+    // simulate that the window has been closed by the `github-authorize` route
+    fakeWindow.closed = true;
+
+    // wait for the error message to show up after the failed login
+    await waitFor('[data-test-flash-message].shown');
+
+    assert.dom('[data-test-flash-message]').hasText('Failed to log in: Forbidden');
+  });
+});