diff --git a/js/package.json b/js/package.json
index 304800f91..00dbee656 100644
--- a/js/package.json
+++ b/js/package.json
@@ -28,7 +28,6 @@
"bulma-divider": "^0.2.0",
"core-js": "^3.6.4",
"date-fns": "^2.16.0",
- "eslint-plugin-cypress": "^2.10.3",
"graphql": "^15.0.0",
"graphql-tag": "^2.10.3",
"intersection-observer": "^0.12.0",
@@ -80,9 +79,11 @@
"@vue/test-utils": "^1.1.0",
"eslint": "^6.7.2",
"eslint-config-prettier": "^7.0.0",
+ "eslint-plugin-cypress": "^2.10.3",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-prettier": "^3.1.3",
- "eslint-plugin-vue": "^7.0.0",
+ "eslint-plugin-vue": "^7.9.0",
+ "flush-promises": "^1.0.2",
"jest-junit": "^12.0.0",
"mock-apollo-client": "^0.6",
"prettier": "2.2.1",
diff --git a/js/src/router/index.ts b/js/src/router/index.ts
index 6336e886e..d986a0512 100644
--- a/js/src/router/index.ts
+++ b/js/src/router/index.ts
@@ -158,10 +158,14 @@ const router = new Router({
router.beforeEach(authGuardIfNeeded);
router.afterEach(() => {
- if (router.app.$children[0]) {
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
- // @ts-ignore
- router.app.$children[0].error = null;
+ try {
+ if (router.app.$children[0]) {
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-ignore
+ router.app.$children[0].error = null;
+ }
+ } catch (e) {
+ console.error(e);
}
});
diff --git a/js/src/views/User/Login.vue b/js/src/views/User/Login.vue
index 44f38cc53..b21f28443 100644
--- a/js/src/views/User/Login.vue
+++ b/js/src/views/User/Login.vue
@@ -67,7 +67,7 @@
-
@@ -222,44 +222,51 @@ export default class Login extends Vue {
}
saveUserData(data.login);
-
- await this.$apollo.mutate({
- mutation: UPDATE_CURRENT_USER_CLIENT,
- variables: {
- id: data.login.user.id,
- email: this.credentials.email,
- isLoggedIn: true,
- role: data.login.user.role,
- },
- });
- try {
- await initializeCurrentActor(this.$apollo.provider.defaultClient);
- } catch (err) {
- if (err instanceof NoIdentitiesException) {
- this.$router.push({
- name: RouteName.REGISTER_PROFILE,
- params: {
- email: this.currentUser.email,
- userAlreadyActivated: "true",
- },
- });
- }
- }
+ await this.setupClientUserAndActors(data.login);
if (this.$route.query.redirect) {
- console.log("redirect", this.$route.query.redirect);
this.$router.push(this.$route.query.redirect as string);
return;
}
- window.localStorage.setItem("welcome-back", "yes");
+ if (window.localStorage) {
+ window.localStorage.setItem("welcome-back", "yes");
+ }
this.$router.push({ name: RouteName.HOME });
return;
} catch (err) {
this.submitted = false;
- console.error(err);
- err.graphQLErrors.forEach(({ message }: { message: string }) => {
- this.errors.push(message);
- });
+ if (err.graphQLErrors) {
+ err.graphQLErrors.forEach(({ message }: { message: string }) => {
+ this.errors.push(message);
+ });
+ } else if (err.networkError) {
+ this.errors.push(err.networkError.message);
+ }
+ }
+ }
+
+ private async setupClientUserAndActors(login: ILogin): Promise {
+ await this.$apollo.mutate({
+ mutation: UPDATE_CURRENT_USER_CLIENT,
+ variables: {
+ id: login.user.id,
+ email: this.credentials.email,
+ isLoggedIn: true,
+ role: login.user.role,
+ },
+ });
+ try {
+ await initializeCurrentActor(this.$apollo.provider.defaultClient);
+ } catch (err) {
+ if (err instanceof NoIdentitiesException) {
+ this.$router.push({
+ name: RouteName.REGISTER_PROFILE,
+ params: {
+ email: this.currentUser.email,
+ userAlreadyActivated: "true",
+ },
+ });
+ }
}
}
}
diff --git a/js/tests/unit/specs/boot/routes.spec.ts b/js/tests/unit/specs/boot/routes.spec.ts
index d4d715266..bed0a1093 100644
--- a/js/tests/unit/specs/boot/routes.spec.ts
+++ b/js/tests/unit/specs/boot/routes.spec.ts
@@ -2,23 +2,45 @@ import { config, createLocalVue, mount } from "@vue/test-utils";
import { routes } from "@/router";
import App from "@/App.vue";
import VueRouter from "vue-router";
-import Home from "@/views/Home.vue";
+import Buefy from "buefy";
const localVue = createLocalVue();
config.mocks.$t = (key: string): string => key;
localVue.use(VueRouter);
-
-const router = new VueRouter({ routes });
-const wrapper = mount(App, {
- localVue,
- router,
- stubs: ["NavBar", "mobilizon-footer"],
-});
+localVue.use(Buefy);
describe("routing", () => {
test("Homepage", async () => {
- router.push("/");
+ const router = new VueRouter({ routes, mode: "history" });
+ const wrapper = mount(App, {
+ localVue,
+ router,
+ stubs: {
+ NavBar: true,
+ "mobilizon-footer": true,
+ },
+ });
+
+ expect(wrapper.html()).toContain('');
+ });
+
+ test("About", async () => {
+ const router = new VueRouter({ routes, mode: "history" });
+ const wrapper = mount(App, {
+ localVue,
+ router,
+ stubs: {
+ NavBar: true,
+ "mobilizon-footer": true,
+ },
+ });
+
+ router.push("/about");
await wrapper.vm.$nextTick();
- expect(wrapper.findComponent(Home).exists()).toBe(true);
+ await wrapper.vm.$nextTick();
+ expect(wrapper.vm.$route.path).toBe("/about/instance");
+ expect(wrapper.html()).toContain(
+ '
key;
+const $router = { push: jest.fn() };
+
+describe("Render login form", () => {
+ let wrapper: Wrapper;
+ let mockClient: MockApolloClient | null;
+ let apolloProvider;
+ let requestHandlers: Record;
+
+ const generateWrapper = (
+ handlers: Record = {},
+ customProps: Record = {},
+ baseData: Record = {},
+ customMocks: Record = {}
+ ) => {
+ const cache = new InMemoryCache({ addTypename: true });
+
+ mockClient = createMockClient({
+ cache,
+ resolvers: buildCurrentUserResolver(cache),
+ });
+
+ requestHandlers = {
+ configQueryHandler: jest.fn().mockResolvedValue(configMock),
+ loginMutationHandler: jest.fn().mockResolvedValue(loginResponseMock),
+ ...handlers,
+ };
+ mockClient.setRequestHandler(CONFIG, requestHandlers.configQueryHandler);
+ mockClient.setRequestHandler(LOGIN, requestHandlers.loginMutationHandler);
+
+ apolloProvider = new VueApollo({
+ defaultClient: mockClient,
+ });
+
+ wrapper = mount(Login, {
+ localVue,
+ i18n,
+ apolloProvider,
+ propsData: {
+ ...customProps,
+ },
+ mocks: {
+ $route: { query: {} },
+ $router,
+ ...customMocks,
+ },
+ stubs: ["router-link", "router-view"],
+ data() {
+ return {
+ ...baseData,
+ };
+ },
+ });
+ };
+
+ afterEach(() => {
+ wrapper.destroy();
+ mockClient = null;
+ apolloProvider = null;
+ $router.push.mockReset();
+ });
+
+ it("requires email and password to be filled", async () => {
+ generateWrapper();
+ await wrapper.vm.$nextTick();
+ await wrapper.vm.$nextTick();
+
+ expect(wrapper.exists()).toBe(true);
+ expect(requestHandlers.configQueryHandler).toHaveBeenCalled();
+ expect(wrapper.vm.$apollo.queries.config).toBeTruthy();
+ wrapper.find('form input[type="email"]').setValue("");
+ wrapper.find('form input[type="password"]').setValue("");
+ wrapper.find("form button.button").trigger("click");
+ const form = wrapper.find("form");
+ expect(form.exists()).toBe(true);
+ const formElement = form.element as HTMLFormElement;
+ expect(formElement.checkValidity()).toBe(false);
+ });
+
+ it("renders and submits the login form", async () => {
+ generateWrapper();
+ await wrapper.vm.$nextTick();
+ await wrapper.vm.$nextTick();
+
+ expect(wrapper.exists()).toBe(true);
+ expect(requestHandlers.configQueryHandler).toHaveBeenCalled();
+ expect(wrapper.vm.$apollo.queries.config).toBeTruthy();
+ wrapper.find('form input[type="email"]').setValue("some@email.tld");
+ wrapper.find('form input[type="password"]').setValue("somepassword");
+ wrapper.find("form").trigger("submit");
+ await wrapper.vm.$nextTick();
+ expect(requestHandlers.loginMutationHandler).toHaveBeenCalledWith({
+ ...loginMock,
+ });
+ await wrapper.vm.$nextTick();
+ await wrapper.vm.$nextTick();
+ const currentUser = mockClient?.cache.readQuery<{
+ currentUser: ICurrentUser;
+ }>({
+ query: CURRENT_USER_CLIENT,
+ })?.currentUser;
+ expect(currentUser?.email).toBe("some@email.tld");
+ expect(currentUser?.id).toBe("1");
+ expect(jest.isMockFunction(wrapper.vm.$router.push)).toBe(true);
+ await flushPromises();
+ expect($router.push).toHaveBeenCalledWith({ name: RouteName.HOME });
+ });
+
+ it("handles a login error", async () => {
+ generateWrapper({
+ loginMutationHandler: jest.fn().mockResolvedValue({
+ errors: [
+ {
+ message:
+ '"Impossible to authenticate, either your email or password are invalid."',
+ },
+ ],
+ }),
+ });
+
+ await wrapper.vm.$nextTick();
+ await wrapper.vm.$nextTick();
+
+ expect(wrapper.exists()).toBe(true);
+ expect(requestHandlers.configQueryHandler).toHaveBeenCalled();
+ expect(wrapper.vm.$apollo.queries.config).toBeTruthy();
+ wrapper.find('form input[type="email"]').setValue("some@email.tld");
+ wrapper.find('form input[type="password"]').setValue("somepassword");
+ wrapper.find("form").trigger("submit");
+ await wrapper.vm.$nextTick();
+ expect(requestHandlers.loginMutationHandler).toHaveBeenCalledWith({
+ ...loginMock,
+ });
+ await flushPromises();
+ expect(wrapper.find("article.message.is-danger").text()).toContain(
+ "Impossible to authenticate, either your email or password are invalid."
+ );
+ expect($router.push).not.toHaveBeenCalled();
+ });
+
+ it("handles redirection after login", async () => {
+ generateWrapper(
+ {},
+ {},
+ {},
+ {
+ $route: { query: { redirect: "/about/instance" } },
+ }
+ );
+
+ await wrapper.vm.$nextTick();
+ await wrapper.vm.$nextTick();
+
+ wrapper.find('form input[type="email"]').setValue("some@email.tld");
+ wrapper.find('form input[type="password"]').setValue("somepassword");
+ wrapper.find("form").trigger("submit");
+ await flushPromises();
+ expect($router.push).toHaveBeenCalledWith("/about/instance");
+ });
+});
diff --git a/js/tests/unit/specs/mocks/auth.ts b/js/tests/unit/specs/mocks/auth.ts
new file mode 100644
index 000000000..3caba2803
--- /dev/null
+++ b/js/tests/unit/specs/mocks/auth.ts
@@ -0,0 +1,20 @@
+export const loginMock = {
+ email: "some@email.tld",
+ password: "somepassword",
+};
+
+export const loginResponseMock = {
+ data: {
+ login: {
+ __typename: "Login",
+ accessToken: "some access token",
+ refreshToken: "some refresh token",
+ user: {
+ __typename: "User",
+ email: "some@email.tld",
+ id: "1",
+ role: "ADMINISTRATOR",
+ },
+ },
+ },
+};
diff --git a/js/yarn.lock b/js/yarn.lock
index b9fee932f..cb0594e42 100644
--- a/js/yarn.lock
+++ b/js/yarn.lock
@@ -4448,9 +4448,9 @@ date-fns@^1.27.2:
integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
date-fns@^2.16.0:
- version "2.20.3"
- resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.20.3.tgz#5a28718edb95a80db96187b25340959867d36bc8"
- integrity sha512-BbiJSlfmr1Fnfi1OHY8arklKdwtZ9n3NkjCeK8G9gtEe0ZSUwJuwHc6gYBl0uoC0Oa5RdpJV1gBBdXcZi8Efdw==
+ version "2.21.1"
+ resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.21.1.tgz#679a4ccaa584c0706ea70b3fa92262ac3009d2b0"
+ integrity sha512-m1WR0xGiC6j6jNFAyW4Nvh4WxAi4JF4w9jRJwSI8nBmNcyZXPcP9VUQG+6gHQXAmqaGEKDKhOqAtENDC941UkA==
de-indent@^1.0.2:
version "1.0.2"
@@ -5081,13 +5081,13 @@ eslint-plugin-import@^2.20.2:
tsconfig-paths "^3.9.0"
eslint-plugin-prettier@^3.1.3:
- version "3.3.1"
- resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.3.1.tgz#7079cfa2497078905011e6f82e8dd8453d1371b7"
- integrity sha512-Rq3jkcFY8RYeQLgk2cCwuc0P7SEFwDravPhsJZOQ5N4YI4DSg50NyqJ/9gdZHzQlHf8MvafSesbNJCcP/FF6pQ==
+ version "3.4.0"
+ resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.4.0.tgz#cdbad3bf1dbd2b177e9825737fe63b476a08f0c7"
+ integrity sha512-UDK6rJT6INSfcOo545jiaOwB701uAIt2/dR7WnFQoGCVl1/EMqdANBmwUaqqQ45aXprsTGzSa39LI1PyuRBxxw==
dependencies:
prettier-linter-helpers "^1.0.0"
-eslint-plugin-vue@^7.0.0:
+eslint-plugin-vue@^7.9.0:
version "7.9.0"
resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-7.9.0.tgz#f8e83a2a908f4c43fc8304f5401d4ff671f3d560"
integrity sha512-2Q0qQp5+5h+pZvJKCbG1/jCRUYrdgAz5BYKGyTlp2NU8mx09u3Hp7PsH6d5qef6ojuPoCXMnrbbDxeoplihrSw==
@@ -5825,6 +5825,11 @@ flow-static-land@0.2.8:
resolved "https://registry.yarnpkg.com/flow-static-land/-/flow-static-land-0.2.8.tgz#49617e531396928bae6eb5d8ba32e7071637e5b9"
integrity sha512-pOZFExu2rbscCgcEo7nL7FNhBubMi18dn1Un4lm8LOmQkYhgsHLsrBGMWmuJXRWcYMrOC7I/bPsiqqVjdD3K1g==
+flush-promises@^1.0.2:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/flush-promises/-/flush-promises-1.0.2.tgz#4948fd58f15281fed79cbafc86293d5bb09b2ced"
+ integrity sha512-G0sYfLQERwKz4+4iOZYQEZVpOt9zQrlItIxQAAYAWpfby3gbHrx0osCHz5RLl/XoXevXk0xoN4hDFky/VV9TrA==
+
flush-write-stream@^1.0.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.1.1.tgz#8dd7d873a1babc207d94ead0c2e0e44276ebf2e8"