refactor: cleanup and use utils in e2e tests

src/domains/dashboard/e2e/navbar-routing.e2e.ts

@@ -1,55 +1,50 @@
-import { ClientFunction, Selector } from "testcafe";
+import { Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
-import { getPageURL } from "../../../utils/e2e-utils";
+import { buildTranslations } from "../../../app/i18n/helpers";
+import { getLocation, getPageURL } from "../../../utils/e2e-utils";
 
-fixture`NavBar routing`.page(getPageURL());
-
-const scrollTop = ClientFunction(() => {
-	window.scrollTo({ top: 0 });
-});
+const translations = buildTranslations();
 
-const getLocation = ClientFunction(() => document.location.href);
+fixture`NavBar routing`.page(getPageURL());
 
 test("should navigate to profile dashboard", async (t) => {
 	await t.click(Selector("p").withExactText("John Doe"));
 });
 
 test("should navigate to plugins", async (t) => {
 	await t.click(Selector("p").withExactText("John Doe"));
-	await t.click(Selector("a").withExactText(translations().COMMON.PLUGINS));
+	await t.click(Selector("a").withExactText(translations.COMMON.PLUGINS));
 	await t.expect(getLocation()).contains("/plugins");
-	await t.expect(Selector("h1").withExactText(translations().PLUGINS.PAGE_PLUGIN_MANAGER.TITLE).exists).ok();
+	await t.expect(Selector("h1").withExactText(translations.PLUGINS.PAGE_PLUGIN_MANAGER.TITLE).exists).ok();
 });
 
 test("should navigate to exchange", async (t) => {
 	await t.click(Selector("p").withExactText("John Doe"));
-	await t.click(Selector("a").withExactText(translations().EXCHANGE.PAGE_EXCHANGE.TITLE));
+	await t.click(Selector("a").withExactText(translations.EXCHANGE.PAGE_EXCHANGE.TITLE));
 	await t.expect(getLocation()).contains("/exchange");
-	await t.expect(Selector("h1").withExactText(translations().EXCHANGE.PAGE_EXCHANGE.TITLE).exists).ok();
+	await t.expect(Selector("h1").withExactText(translations.EXCHANGE.PAGE_EXCHANGE.TITLE).exists).ok();
 });
 
 test("should navigate to news", async (t) => {
 	await t.click(Selector("p").withExactText("John Doe"));
-	await t.click(Selector("a").withExactText(translations().NEWS.NEWS));
+	await t.click(Selector("a").withExactText(translations.NEWS.NEWS));
 	await t.expect(getLocation()).contains("/news");
-	await t.expect(Selector("h1").withExactText(translations().NEWS.PAGE_NEWS.TITLE).exists).ok();
+	await t.expect(Selector("h1").withExactText(translations.NEWS.PAGE_NEWS.TITLE).exists).ok();
 });
 
 // TODO: Update send button in navbar to use a wallet by default
 // test("should navigate to transaction send page", async (t) => {
 // 	await t.click(Selector("p").withExactText("John Doe"));
 // 	await t.click(Selector("[data-testid=navbar__buttons--send]"));
 // 	await t.click(
-// 		Selector("div").withExactText(translations().TRANSACTION.PAGE_TRANSACTION_SEND.FIRST_STEP.DESCRIPTION),
+// 		Selector("div").withExactText(translations.TRANSACTION.PAGE_TRANSACTION_SEND.FIRST_STEP.DESCRIPTION),
 // 	);
 // 	await t.expect(getLocation()).contains("/transactions/transfer");
 // });
 
 test("should navigate back to portfolio", async (t) => {
 	await t.click(Selector("p").withExactText("John Doe"));
-	await t.click(Selector("a").withExactText(translations().NEWS.NEWS));
-	await scrollTop();
-	await t.click(Selector("a").withExactText(translations().COMMON.GO_BACK_TO_PORTFOLIO));
+	await t.click(Selector("a").withExactText(translations.NEWS.NEWS));
+	await t.click(Selector("a").withExactText(translations.COMMON.GO_BACK_TO_PORTFOLIO));
 	await t.expect(getLocation()).contains("/dashboard");
 });

src/domains/news/e2e/common.ts

@@ -1,9 +1,11 @@
 import { Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
+import { buildTranslations } from "../../../app/i18n/helpers";
+
+const translations = buildTranslations();
 
 export const goToNews = async (t: any) => {
 	await t.click(Selector("p").withText("John Doe"));
-	await t.click(Selector("a").withText(translations().NEWS.NEWS));
-	await t.expect(Selector("h1").withText(translations().NEWS.PAGE_NEWS.TITLE).exists).ok();
+	await t.click(Selector("a").withText(translations.NEWS.NEWS));
+	await t.expect(Selector("h1").withText(translations.NEWS.PAGE_NEWS.TITLE).exists).ok();
 };

src/domains/news/e2e/filtering.e2e.ts

@@ -1,45 +1,23 @@
-import { ClientFunction, Selector } from "testcafe";
+import { Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
+import { buildTranslations } from "../../../app/i18n/helpers";
 import { getPageURL } from "../../../utils/e2e-utils";
 import { goToNews } from "./common";
 
-const scrollTop = ClientFunction(() => {
-	window.scrollTo({ top: 0 });
-});
-
-fixture`News screen routing`.page(getPageURL()).beforeEach(goToNews);
 const itemsPerPage = 15;
 
-test("should display news feed", async (t) => {
-	await scrollTop();
-
-	await t.expect(Selector('[data-testid="NewsCard"]').exists).ok();
-	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
-});
+const translations = buildTranslations();
 
-test("should navigate between pages", async (t) => {
-	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
-
-	await t.hover(Selector('[data-testid="CompactPagination__next"]'));
-
-	await t.expect(Selector('[data-testid="CompactPagination__previous"]').hasAttribute("disabled")).ok();
-
-	await t.click(Selector('[data-testid="CompactPagination__next"]'));
-	await t.expect(Selector('[data-testid="NewsCard"]').exists).ok();
-	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
-
-	await t.expect(Selector('[data-testid="CompactPagination__previous"]').hasAttribute("disabled")).notOk();
-	await t.hover(Selector('[data-testid="CompactPagination__previous"]'));
-	await t.click(Selector('[data-testid="CompactPagination__previous"]'));
+fixture`News filtering`.page(getPageURL()).beforeEach(async (t) => await goToNews(t));
 
+test("should display news feed", async (t) => {
 	await t.expect(Selector('[data-testid="NewsCard"]').exists).ok();
 	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
 });
 
 test("should filter news results", async (t) => {
 	// Filter technical category
-	const technical = translations().NEWS.CATEGORIES.TECHNICAL;
+	const technical = translations.NEWS.CATEGORIES.TECHNICAL;
 	const eth = "network__option--1";
 	const query = "the block";
 

src/domains/news/e2e/news-routing.e2e.ts

@@ -1,6 +1,31 @@
+import { Selector } from "testcafe";
+
 import { getPageURL } from "../../../utils/e2e-utils";
 import { goToNews } from "./common";
 
-fixture`News page filtering`.page(getPageURL());
+const itemsPerPage = 15;
+
+fixture`News routing`.page(getPageURL());
+
+test("should navigate to news page", async (t) => await goToNews(t));
+
+test("should navigate between pages", async (t) => {
+	await goToNews(t);
+
+	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
+
+	await t.hover(Selector('[data-testid="CompactPagination__next"]'));
+
+	await t.expect(Selector('[data-testid="CompactPagination__previous"]').hasAttribute("disabled")).ok();
+
+	await t.click(Selector('[data-testid="CompactPagination__next"]'));
+	await t.expect(Selector('[data-testid="NewsCard"]').exists).ok();
+	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
+
+	await t.expect(Selector('[data-testid="CompactPagination__previous"]').hasAttribute("disabled")).notOk();
+	await t.hover(Selector('[data-testid="CompactPagination__previous"]'));
+	await t.click(Selector('[data-testid="CompactPagination__previous"]'));
 
-test("should navigate to news page", goToNews);
+	await t.expect(Selector('[data-testid="NewsCard"]').exists).ok();
+	await t.expect(Selector('[data-testid="NewsCard"]').count).eql(itemsPerPage);
+});

src/domains/plugin/e2e/common.ts

@@ -0,0 +1,11 @@
+import { Selector } from "testcafe";
+
+import { buildTranslations } from "../../../app/i18n/helpers";
+
+const translations = buildTranslations();
+
+export const goToPlugins = async (t: any) => {
+	await t.click(Selector("p").withText("John Doe"));
+	await t.click(Selector("a").withText(translations.COMMON.PLUGINS));
+	await t.expect(Selector("h1").withText(translations.PLUGINS.PAGE_PLUGIN_MANAGER.TITLE).exists).ok();
+};

src/domains/plugin/e2e/plugins-routing.e2e.ts

@@ -1,56 +1,45 @@
-import { ClientFunction, Selector } from "testcafe";
+import { Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
-import { getPageURL } from "../../../utils/e2e-utils";
+import { buildTranslations } from "../../../app/i18n/helpers";
+import { getPageURL, scrollToTop } from "../../../utils/e2e-utils";
+import { goToPlugins } from "./common";
 
-const scrollTop = ClientFunction(() => {
-	window.scrollTo({ top: 0 });
-});
+const translations = buildTranslations();
 
-fixture`Plugins screen routing`.page(getPageURL());
+fixture`Plugins routing`.page(getPageURL()).beforeEach(async (t) => await goToPlugins(t));
 
 test("should navigate and apply filters", async (t) => {
-	await t.click(Selector("p").withText("John Doe"));
-	await t.click(Selector("a").withText(translations().COMMON.PLUGINS));
-	await t.expect(Selector("h1").withText(translations().PLUGINS.PAGE_PLUGIN_MANAGER.TITLE).exists).ok();
-
 	// Filtering by game
-	await t.click(Selector("span").withExactText(translations().PLUGINS.CATEGORIES.GAME));
-	await t.expect(Selector("h2").withExactText(translations().PLUGINS.CATEGORIES.GAME).exists).ok();
+	await t.click(Selector("span").withExactText(translations.PLUGINS.CATEGORIES.GAME));
+	await t.expect(Selector("h2").withExactText(translations.PLUGINS.CATEGORIES.GAME).exists).ok();
 
 	// Filtering by utility
-	await t.click(Selector("span").withExactText(translations().PLUGINS.CATEGORIES.UTILITY));
-	await t.expect(Selector("h2").withExactText(translations().PLUGINS.CATEGORIES.UTILITY).exists).ok();
+	await t.click(Selector("span").withExactText(translations.PLUGINS.CATEGORIES.UTILITY));
+	await t.expect(Selector("h2").withExactText(translations.PLUGINS.CATEGORIES.UTILITY).exists).ok();
 
 	// Filtering by themes
-	await t.click(Selector("span").withExactText(translations().PLUGINS.CATEGORIES.THEMES));
-	await t.expect(Selector("h2").withExactText(translations().PLUGINS.CATEGORIES.THEMES).exists).ok();
+	await t.click(Selector("span").withExactText(translations.PLUGINS.CATEGORIES.THEMES));
+	await t.expect(Selector("h2").withExactText(translations.PLUGINS.CATEGORIES.THEMES).exists).ok();
 
 	// Filtering by other
-	await t.click(Selector("span").withExactText(translations().PLUGINS.CATEGORIES.OTHER));
-	await t.expect(Selector("h2").withExactText(translations().PLUGINS.CATEGORIES.OTHER).exists).ok();
+	await t.click(Selector("span").withExactText(translations.PLUGINS.CATEGORIES.OTHER));
+	await t.expect(Selector("h2").withExactText(translations.PLUGINS.CATEGORIES.OTHER).exists).ok();
 
 	// Filtering by user plugins
 	await t.click(Selector("span").withExactText("MyPlugin"));
-	await t.expect(Selector("h2").withExactText(translations().PLUGINS.CATEGORIES.MY_PLUGINS).exists).ok();
+	await t.expect(Selector("h2").withExactText(translations.PLUGINS.CATEGORIES.MY_PLUGINS).exists).ok();
 });
 
 test("should navigate to plugin details", async (t) => {
-	await t.click(Selector("p").withText("John Doe"));
-	await t.click(Selector("a").withText(translations().COMMON.PLUGINS));
-	await t.expect(Selector("h1").withText(translations().PLUGINS.PAGE_PLUGIN_MANAGER.TITLE).exists).ok();
-
 	await t.click(Selector('[data-testid="PluginCard--ark-explorer-0"]'));
 	await t.expect(Selector("span").withExactText("ARK Explorer").exists).ok();
 });
 
 test("should navigate back to plugin store from plugin details", async (t) => {
-	await t.click(Selector("p").withText("John Doe"));
-	await t.click(Selector("a").withText(translations().COMMON.PLUGINS));
-	await t.expect(Selector("h1").withText(translations().PLUGINS.PAGE_PLUGIN_MANAGER.TITLE).exists).ok();
 	await t.click(Selector('[data-testid="PluginCard--ark-explorer-0"]'));
 	await t.expect(Selector("span").withExactText("ARK Explorer").exists).ok();
-	await scrollTop();
 
-	await t.click(Selector("span").withExactText(translations().PLUGINS.GO_BACK_TO_PLUGIN_STORE));
+	await scrollToTop();
+
+	await t.click(Selector("span").withExactText(translations.PLUGINS.GO_BACK_TO_PLUGIN_STORE));
 });

src/domains/profile/e2e/common.ts

@@ -0,0 +1,10 @@
+import { Selector } from "testcafe";
+
+import { buildTranslations } from "../../../app/i18n/helpers";
+
+const translations = buildTranslations();
+
+export const goToProfile = async (t: any) => {
+	await t.click(Selector("p").withText("John Doe"));
+	await t.expect(Selector("div").withText(translations.COMMON.WALLETS).exists).ok();
+};

src/domains/profile/e2e/create-profile-action.e2e.ts

@@ -1,24 +1,26 @@
 import { Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
+import { buildTranslations } from "../../../app/i18n/helpers";
 import { getLocation, getPageURL } from "../../../utils/e2e-utils";
 
+const translations = buildTranslations();
+
 fixture`Create Profile action`.page(getPageURL());
 
 const nameInput = Selector("input[name=name]");
 
 test("should return an error when submit without required fields", async (t) => {
-	await t.click(Selector("button").withExactText(translations().PROFILE.CREATE_PROFILE));
+	await t.click(Selector("button").withExactText(translations.PROFILE.CREATE_PROFILE));
 
-	await t.click(Selector("button").withExactText(translations().COMMON.COMPLETE));
+	await t.click(Selector("button").withExactText(translations.COMMON.COMPLETE));
 	await t.click(Selector("fieldset p").withText("Name is required"));
 	await t.click(Selector("fieldset p").withText("Market Provider is required"));
 	await t.click(Selector("fieldset p").withText("Currency is required"));
-	await t.click(Selector("h1").withExactText(translations().PROFILE.PAGE_CREATE_PROFILE.TITLE));
+	await t.click(Selector("h1").withExactText(translations.PROFILE.PAGE_CREATE_PROFILE.TITLE));
 });
 
 test("should create a profile and navigate to welcome screen", async (t) => {
-	await t.click(Selector("button").withExactText(translations().PROFILE.CREATE_PROFILE));
+	await t.click(Selector("button").withExactText(translations.PROFILE.CREATE_PROFILE));
 
 	await t.expect(getLocation()).contains("/profiles/create");
 
@@ -28,7 +30,7 @@ test("should create a profile and navigate to welcome screen", async (t) => {
 	await t.click(Selector("button").withText("Select Currency"));
 	await t.click(Selector("li.select-list-option").withText("ETH"));
 	await t.click(Selector("input[name=isDarkMode]").parent());
-	await t.click(Selector("button").withExactText(translations().COMMON.COMPLETE));
+	await t.click(Selector("button").withExactText(translations.COMMON.COMPLETE));
 
 	await t.wait(1000); // TODO: the profile loading is async so we need to give it a moment
 
@@ -39,7 +41,7 @@ test("should create a profile and navigate to welcome screen", async (t) => {
 });
 
 test("should create a profile with password and navigate to welcome screen", async (t) => {
-	await t.click(Selector("button").withExactText(translations().PROFILE.CREATE_PROFILE));
+	await t.click(Selector("button").withExactText(translations.PROFILE.CREATE_PROFILE));
 
 	await t.expect(getLocation()).contains("/profiles/create");
 
@@ -50,7 +52,7 @@ test("should create a profile with password and navigate to welcome screen", asy
 	await t.click(Selector("button").withText("Select Currency"));
 	await t.click(Selector("li.select-list-option").withText("ETH"));
 	await t.click(Selector("input[name=isDarkMode]").parent());
-	await t.click(Selector("button").withExactText(translations().COMMON.COMPLETE));
+	await t.click(Selector("button").withExactText(translations.COMMON.COMPLETE));
 
 	await t.wait(1000); // TODO: the profile loading is async so we need to give it a moment
 

src/domains/profile/e2e/create-profile-routing.e2e.ts

@@ -1,18 +1,20 @@
 import { ClientFunction, Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
+import { buildTranslations } from "../../../app/i18n/helpers";
 import { getPageURL } from "../../../utils/e2e-utils";
 
+const translations = buildTranslations();
+
 fixture`Welcome -> Create Profile routing`.page(getPageURL());
 
 const getLocation = ClientFunction(() => document.location.href);
 
 test("should navigate to create profile and back to welcome screen", async (t) => {
-	await t.click(Selector("button").withExactText(translations().PROFILE.CREATE_PROFILE));
+	await t.click(Selector("button").withExactText(translations.PROFILE.CREATE_PROFILE));
 	await t.expect(getLocation()).contains("/profiles/create");
-	await t.click(Selector("h1").withExactText(translations().PROFILE.PAGE_CREATE_PROFILE.TITLE));
+	await t.click(Selector("h1").withExactText(translations.PROFILE.PAGE_CREATE_PROFILE.TITLE));
 
 	// Navigate back
 	await t.click(Selector("button").withExactText("Back"));
-	await t.click(Selector("h1").withExactText(translations().COMMON.WELCOME));
+	await t.click(Selector("h1").withExactText(translations.COMMON.WELCOME));
 });

src/domains/profile/e2e/delete-profile-action.e2e.ts

@@ -1,15 +1,17 @@
 import { Selector } from "testcafe";
 
-import { buildTranslations as translations } from "../../../app/i18n/helpers";
+import { buildTranslations } from "../../../app/i18n/helpers";
 import { getPageURL } from "../../../utils/e2e-utils";
 
+const translations = buildTranslations();
+
 fixture`Delete Profile action`.page(getPageURL());
 
 test("should delete profile from profile card menu", async (t) => {
 	await t.click(Selector('[data-testid="ProfileCard"] [data-testid="dropdown__toggle"]'));
 	await t.click(
 		Selector('[data-testid="ProfileCard"] [data-testid="dropdown__option--1"]').withText(
-			translations().COMMON.DELETE,
+			translations.COMMON.DELETE,
 		),
 	);
 	await t.click(Selector('[data-testid="DeleteResource__submit-button"]'));