Skip to content

Commit

Permalink
Fix e2e tests to take advantage of BASIC login for fakeuser
Browse files Browse the repository at this point in the history
  • Loading branch information
blacelle committed Sep 24, 2024
1 parent 2ac66ce commit 4283b9c
Show file tree
Hide file tree
Showing 20 changed files with 210 additions and 126 deletions.
7 changes: 5 additions & 2 deletions js/e2e-tests/fake-player.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,15 @@ export default {

async showLoginOptions(page) {
await page.getByRole("link", { name: /You need to login/ }).click();

await expect(page.getByRole("link", { name: /github/ })).toBeVisible();
await expect(page.getByRole("link", { name: /BASIC/ })).toBeVisible();
},

async login(page) {
await this.showLoginOptions(page);
await page.getByRole("link", { name: /github/ }).click();
// How can we login automatically?
await page.getByRole("link", { name: /BASIC/ }).click();
await page.getByRole("button", { name: /Login fakeUser/ }).click();
},

async playOptimization(page) {
Expand Down
28 changes: 0 additions & 28 deletions js/e2e-tests/localhost-login-dev.spec.js

This file was deleted.

16 changes: 11 additions & 5 deletions js/e2e-tests/localhost8080-dev.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,19 @@ test.beforeAll(async ({ request }) => {
expect(response.ok()).toBeTruthy();
});

// FakeUser skips the login phase
//test('login', async ({ page }) => {
// await page.goto(url);
// await fakePlayer.login(page);
//});
// We just check the login page is working OK
test("showLoginOptions", async ({ page }) => {
await page.goto(url);
await fakePlayer.showLoginOptions(page);
});

test("login", async ({ page }) => {
await page.goto(url);
await fakePlayer.login(page);
});

test("play-optimization", async ({ page }) => {
await page.goto(url);
await fakePlayer.login(page);
await fakePlayer.playOptimization(page);
});
1 change: 0 additions & 1 deletion js/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@
"lint_debug": "eslint --fix src/main/resources/static --debug",
"preview": "vite preview",
"pw_localhost8080": "SPRING_ACTIVE_PROFILES=unsafe,inmemory,fakeuser npx playwright test localhost8080 --project=chromium",
"pw_localhost8080_nofakeuser": "SPRING_ACTIVE_PROFILES=unsafe,inmemory npx playwright test localhost-login --project=chromium",
"pw_localhost8080_ui": "SPRING_ACTIVE_PROFILES=unsafe,inmemory,fakeuser npx playwright test localhost8080 --project=chromium --ui"
},
"type": "module",
Expand Down
4 changes: 2 additions & 2 deletions js/playwright.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@ const config = defineConfig({
},

// https://playwright.dev/docs/test-timeouts
timeout: 5000,
expect: { timeout: 3000 },
timeout: 3000,
expect: { timeout: 2000 },

// https://github.com/microsoft/playwright/issues/14854
use: {
Expand Down
7 changes: 7 additions & 0 deletions js/src/main/resources/static/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@
import KumiteContest from "./ui/js/kumite-contest.js";
import KumiteBoard from "./ui/js/kumite-board.js";
import LoginChecker from "./ui/js/login-checker.js";
import LoginBasic from "./ui/js/login-basic.js";
import AboutView from "./ui/js/about.js";

// Some routes prefix are forbidden as they would match API
Expand Down Expand Up @@ -107,6 +108,12 @@
// https://stackoverflow.com/questions/44783787/bind-query-to-props-with-vue-router
// props: route => Object.assign({}, route.query, route.params)
},
{
path: "/html/login/basic",
component: LoginBasic,
// https://stackoverflow.com/questions/44783787/bind-query-to-props-with-vue-router
// props: route => Object.assign({}, route.query, route.params)
},
{ path: "/html/about", component: AboutView },
];

Expand Down
2 changes: 1 addition & 1 deletion js/src/main/resources/static/ui/js/kumite-account-ref.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default {
...mapState(useKumiteStore, ["nbAccountFetching", "account", "needsToLogin"]),
...mapState(useKumiteStore, {
player(store) {
return store.players[this.playerId] || { status: "not_loaded" };
return store.players[this.playerId] || { error: "not_loaded" };
},
}),
},
Expand Down
6 changes: 3 additions & 3 deletions js/src/main/resources/static/ui/js/kumite-board-join.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,15 +27,15 @@ export default {
...mapState(useKumiteStore, ["nbGameFetching", "nbContestFetching", "nbBoardFetching", "playingPlayerId"]),
...mapState(useKumiteStore, {
game(store) {
return store.games[this.gameId] || { status: "not_loaded" };
return store.games[this.gameId] || { error: "not_loaded" };
},
contest(store) {
return store.contests[this.contestId] || { status: "not_loaded" };
return store.contests[this.contestId] || { error: "not_loaded" };
},
board(store) {
return (
store.contests[this.contestId].board || {
status: "not_loaded",
error: "not_loaded",
}
);
},
Expand Down
4 changes: 1 addition & 3 deletions js/src/main/resources/static/ui/js/kumite-contest-delete.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,5 @@ export default {

return {};
},
template: /* HTML */ `
<button class="btn btn-danger">Archive this contest (force gameOver)</button>
`,
template: /* HTML */ ` <button class="btn btn-danger">Archive this contest (force gameOver)</button> `,
};
7 changes: 3 additions & 4 deletions js/src/main/resources/static/ui/js/kumite-contest-form.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,8 @@ export default {
method: {},
setup(props) {
const store = useKumiteStore();


const contestName = ref('');

const contestName = ref("");
const createdContest = ref({});

const submitContestForm = function () {
Expand Down Expand Up @@ -82,7 +81,7 @@ export default {
return { contestName, submitContestForm, createdContest };
},
template: /* HTML */ `
<div v-if="(!game)">
<div v-if="(!game) || game.error">
<div v-if="(nbGameFetching > 0)">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading gameId={{gameId}}</span>
Expand Down
8 changes: 4 additions & 4 deletions js/src/main/resources/static/ui/js/kumite-contest-header.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import KumiteContestDelete from "./kumite-contest-delete.js";
export default {
components: {
KumiteAccountRef,
KumiteContestDelete,
KumiteContestDelete,
},
props: {
contestId: {
Expand All @@ -22,7 +22,7 @@ export default {
},
},
computed: {
...mapState(useKumiteStore, ["nbGameFetching", "nbContestFetching"]),
...mapState(useKumiteStore, ["nbGameFetching", "nbContestFetching", "isLoggedIn", "account"]),
...mapState(useKumiteStore, {
game(store) {
return store.games[this.gameId];
Expand Down Expand Up @@ -95,8 +95,8 @@ export default {
<ul>
<li>author: <KumiteAccountRef :accountId="contest.constantMetadata.author" /></li>
<li>created: {{contest.constantMetadata.created}}</li>
<li v-if="contest.constantMetadata.author == account.accountId">
<KumiteContestDelete :contestId="contestId" />
<li v-if="isLoggedIn && contest.constantMetadata.author == account.accountId">
<KumiteContestDelete :gameId="gameId" :contestId="contestId" />
</li>
</ul>
</span>
Expand Down
14 changes: 7 additions & 7 deletions js/src/main/resources/static/ui/js/kumite-navbar.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@ import { useKumiteStore } from "./store.js";
import Logout from "./login-logout.js";

export default {
components: {
Logout,
},
components: {
Logout,
},
computed: {
...mapState(useKumiteStore, ["needsToLogin", "isLoggedIn", "account", "tokens", "nbAccountFetching", "playingPlayerId"]),
},
Expand Down Expand Up @@ -45,17 +45,17 @@ components: {
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<RouterLink class="nav-link" to="/html/games"><i class="bi bi-puzzle"/>Games</RouterLink>
<RouterLink class="nav-link" to="/html/games"><i class="bi bi-puzzle" />Games</RouterLink>
</li>
<li class="nav-item">
<RouterLink class="nav-link" to="/html/contests"><i class="bi bi-trophy"/>Contests</RouterLink>
<RouterLink class="nav-link" to="/html/contests"><i class="bi bi-trophy" />Contests</RouterLink>
</li>
<li class="nav-item">
<RouterLink class="nav-link" to="/html/about"><i class="bi bi-info-lg"/>About</RouterLink>
<RouterLink class="nav-link" to="/html/about"><i class="bi bi-info-lg" />About</RouterLink>
</li>
<li class="nav-item" v-if="isLoggedIn">
<RouterLink class="nav-link" to="/html/me"><i class="bi bi-person"/>Account Settings</RouterLink>
<RouterLink class="nav-link" to="/html/me"><i class="bi bi-person" />Account Settings</RouterLink>
</li>
</ul>
<span v-if="isLoggedIn">
Expand Down
2 changes: 1 addition & 1 deletion js/src/main/resources/static/ui/js/kumite-player-ref.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default {
...mapState(useKumiteStore, ["nbAccountFetching", "account", "needsToLogin"]),
...mapState(useKumiteStore, {
player(store) {
return store.players[this.playerId] || { status: "not_loaded" };
return store.players[this.playerId] || { error: "not_loaded" };
},
}),
},
Expand Down
2 changes: 1 addition & 1 deletion js/src/main/resources/static/ui/js/kumite-player.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export default {
...mapState(useKumiteStore, ["nbAccountFetching", "account", "needsToLogin"]),
...mapState(useKumiteStore, {
player(store) {
return store.players[this.playerId] || { status: "not_loaded" };
return store.players[this.playerId] || { error: "not_loaded" };
},
}),
},
Expand Down
86 changes: 86 additions & 0 deletions js/src/main/resources/static/ui/js/login-basic.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
import { ref, watch } from "vue";

import { mapState } from "pinia";
import { useKumiteStore } from "./store.js";

import { useRouter } from "vue-router";
import Logout from "./login-logout.js";

export default {
components: {
Logout,
},
props: {
logout: {
type: String,
required: false,
},
},
computed: {
...mapState(useKumiteStore, ["nbAccountFetching", "account", "needsToLogin"]),
...mapState(useKumiteStore, {
user(store) {
return store.account;
},
}),
},
setup(props) {
const store = useKumiteStore();
const router = useRouter();

store.loadUser();

const username = ref("11111111-1111-1111-1111-000000000000");
const password = ref("no_password");

const doLoginBasic = function () {
console.info("Login BASIC");
async function fetchFromUrl(url, csrfToken) {
// https://stackoverflow.com/questions/60265617/how-do-you-include-a-csrf-token-in-a-vue-js-application-with-a-spring-boot-backe
const headers = {
[csrfToken.header]: csrfToken.token,
// https://stackoverflow.com/questions/43842793/basic-authentication-with-fetch
Authorization: "Basic " + btoa(username.value + ":" + password.value),
};

try {
const response = await fetch(url, {
method: "POST",
headers: headers,
});
if (!response.ok) {
throw new Error("Rejected request for logout");
}

const json = await response.json();

console.info("Login BASIC", json);

const loginSuccessHtmlRoute = json.Location;
router.push(loginSuccessHtmlRoute);
} catch (e) {
console.error("Issue on Network: ", e);
}
}

store.fetchCsrfToken().then((csrfToken) => {
fetchFromUrl(`/api/login/v1/basic`, csrfToken);
});
};

return { username, password, doLoginBasic };
},
template: /* HTML */ `
<span v-if="needsToLogin">
<div class="input-group mb-3">
<input type="text" class="form-control" placeholder="Username" aria-label="Username" v-model="username" />
<span class="input-group-text">:</span>
<input type="text" class="form-control" placeholder="Password" aria-label="Password" v-model="password" />
<button type="button" @click="doLoginBasic" class="btn btn-primary">Login fakeUser</button>
</div>
</span>
<span v-else>
<Logout />
</span>
`,
};
8 changes: 3 additions & 5 deletions js/src/main/resources/static/ui/js/login-checker.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import Logout from "./login-logout.js";
export default {
components: {
LoginOptions,
Logout,
Logout,
},
props: {
logout: {
Expand All @@ -32,7 +32,7 @@ export default {

store.loadUser();

return { };
return {};
},
template: /* HTML */ `
<div v-if="needsToLogin">
Expand All @@ -41,8 +41,6 @@ export default {
<LoginOptions />
</div>
</div>
<div v-else>
Welcome {{user.raw.name}}. <Logout />
</div>
<div v-else>Welcome {{user.raw.name}}. <Logout /></div>
`,
};
Loading

0 comments on commit 4283b9c

Please sign in to comment.