First round of authentication tests

Author: DaneEveritt

resources/assets/scripts/components/auth/LoginForm.vue

@@ -5,37 +5,38 @@
         >
             <div class="flex flex-wrap -mx-3 mb-6">
                 <div class="input-open">
-                    <input class="input" id="grid-username" type="text" name="user" aria-labelledby="grid-username" required
+                    <input class="input" id="grid-username" type="text" name="user" aria-labelledby="grid-username-label" required
                            ref="email"
                            :class="{ 'has-content' : user.email.length > 0 }"
                            :readonly="showSpinner"
                            :value="user.email"
                            v-on:input="updateEmail($event)"
                     />
-                    <label for="grid-username">{{ $t('strings.user_identifier') }}</label>
+                    <label id="grid-username-label" for="grid-username">{{ $t('strings.user_identifier') }}</label>
                 </div>
             </div>
             <div class="flex flex-wrap -mx-3 mb-6">
                 <div class="input-open">
-                    <input class="input" id="grid-password" type="password" name="password" aria-labelledby="grid-password" required
+                    <input class="input" id="grid-password" type="password" name="password" aria-labelledby="grid-password-label" required
                            ref="password"
                            :class="{ 'has-content' : user.password && user.password.length > 0 }"
                            :readonly="showSpinner"
                            v-model="user.password"
                     />
-                    <label for="grid-password">{{ $t('strings.password') }}</label>
+                    <label id="grid-password-label" for="grid-password">{{ $t('strings.password') }}</label>
                 </div>
             </div>
             <div>
-                <button class="btn btn-blue btn-jumbo" type="submit" v-bind:disabled="showSpinner">
+                <button id="grid-login-button" class="btn btn-blue btn-jumbo" type="submit" aria-label="Log in"
+                        v-bind:disabled="showSpinner">
                     <span class="spinner white" v-bind:class="{ hidden: ! showSpinner }">&nbsp;</span>
                     <span v-bind:class="{ hidden: showSpinner }">
                         {{ $t('auth.sign_in') }}
                     </span>
                 </button>
             </div>
             <div class="pt-6 text-center">
-                <router-link class="text-xs text-grey tracking-wide no-underline uppercase hover:text-grey-dark"
+                <router-link class="text-xs text-grey tracking-wide no-underline uppercase hover:text-grey-dark" aria-label="Forgot password"
                              :to="{ name: 'forgot-password' }">
                     {{ $t('auth.forgot_password.label') }}
                 </router-link>

tests/Browser/BrowserTestCase.php

@@ -41,6 +41,7 @@ protected function driver()
     {
         $options = (new ChromeOptions)->addArguments([
             '--disable-gpu',
+            '--disable-infobars',
         ]);
 
         return RemoteWebDriver::create(

tests/Browser/Pages/BasePage.php

@@ -0,0 +1,16 @@
+<?php
+
+namespace Pterodactyl\Tests\Browser\Pages;
+
+use Laravel\Dusk\Page;
+
+abstract class BasePage extends Page
+{
+    /**
+     * @return array
+     */
+    public static function siteElements()
+    {
+        return [];
+    }
+}

tests/Browser/Pages/LoginPage.php

@@ -0,0 +1,24 @@
+<?php
+
+namespace Pterodactyl\Tests\Browser\Pages;
+
+class LoginPage extends BasePage
+{
+    /**
+     * @return string
+     */
+    public function url(): string
+    {
+        return '/auth/login';
+    }
+
+    public function elements()
+    {
+        return [
+            '@username' => '#grid-username',
+            '@password' => '#grid-password',
+            '@loginButton' => '#grid-login-button',
+            '@forgotPassword' => 'a[aria-label="Forgot password"]',
+        ];
+    }
+}

tests/Browser/Processes/Authentication/LoginProcessTest.php

@@ -0,0 +1,88 @@
+<?php
+
+namespace Pterodactyl\Tests\Browser\Processes\Authentication;
+
+use Pterodactyl\Models\User;
+use Illuminate\Support\Facades\Hash;
+use Facebook\WebDriver\WebDriverKeys;
+use Pterodactyl\Tests\Browser\BrowserTestCase;
+use Pterodactyl\Tests\Browser\Pages\LoginPage;
+use Pterodactyl\Tests\Browser\PterodactylBrowser;
+
+class LoginProcessTest extends BrowserTestCase
+{
+    private $user;
+
+    /**
+     * Setup tests.
+     */
+    protected function setUp()
+    {
+        parent::setUp();
+
+        $this->user = factory(User::class)->create([
+            'email' => 'test@example.com',
+            'password' => Hash::make('Password123'),
+        ]);
+    }
+
+    /**
+     * Test that a user can login successfully using their email address.
+     */
+    public function testLoginUsingEmail()
+    {
+        $this->browse(function (PterodactylBrowser $browser) {
+            $browser->visit(new LoginPage)
+                ->waitFor('@username')
+                ->type('@username', 'test@example.com')
+                ->type('@password', 'Password123')
+                ->click('@loginButton')
+                ->waitForReload()
+                ->assertPathIs('/')
+                ->assertAuthenticatedAs($this->user);
+        });
+    }
+
+    /**
+     * Test that a user can login successfully using their username.
+     */
+    public function testLoginUsingUsername()
+    {
+        $this->browse(function (PterodactylBrowser $browser) {
+            $browser->visit(new LoginPage)
+                ->waitFor('@username')
+                ->type('@username', $this->user->username)
+                ->type('@password', 'Password123')
+                ->click('@loginButton')
+                ->waitForReload()
+                ->assertPathIs('/')
+                ->assertAuthenticatedAs($this->user);
+        });
+    }
+
+    /**
+     * Test that entering the wrong password shows the expected error and then allows
+     * us to login without clearing the username field.
+     */
+    public function testLoginWithErrors()
+    {
+        $this->browse(function (PterodactylBrowser $browser) {
+            $browser->logout()
+                ->visit(new LoginPage())
+                ->waitFor('@username')
+                ->type('@username', 'test@example.com')
+                ->type('@password', 'invalid')
+                ->click('@loginButton')
+                ->waitFor('.alert.error')
+                ->assertSeeIn('.alert.error', trans('auth.failed'))
+                ->assertValue('@username', 'test@example.com')
+                ->assertValue('@password', '')
+                ->assertFocused('@password')
+                ->type('@password', 'Password123')
+                ->keys('@password', [WebDriverKeys::ENTER])
+                ->waitForReload()
+                ->assertPathIs('/')
+                ->assertAuthenticatedAs($this->user);
+        });
+    }
+}