Avoid NavigationDuplicated error after Login
Only redirect on mounted if already logged-in Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
parent
709d26735b
commit
3f538ccf95
|
@ -123,7 +123,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
|
import { Component, Prop, Vue } from "vue-property-decorator";
|
||||||
import { Route } from "vue-router";
|
import { Route } from "vue-router";
|
||||||
import { ICurrentUser } from "@/types/current-user.model";
|
import { ICurrentUser } from "@/types/current-user.model";
|
||||||
import { LoginError, LoginErrorCode } from "@/types/enums";
|
import { LoginError, LoginErrorCode } from "@/types/enums";
|
||||||
|
@ -207,6 +207,11 @@ export default class Login extends Vue {
|
||||||
const { query } = this.$route;
|
const { query } = this.$route;
|
||||||
this.errorCode = query.code as LoginErrorCode;
|
this.errorCode = query.code as LoginErrorCode;
|
||||||
this.redirect = query.redirect as string | undefined;
|
this.redirect = query.redirect as string | undefined;
|
||||||
|
|
||||||
|
// Already-logged-in and accessing /login
|
||||||
|
if (this.currentUser.isLoggedIn) {
|
||||||
|
this.$router.push("/");
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async loginAction(e: Event): Promise<Route | void> {
|
async loginAction(e: Event): Promise<Route | void> {
|
||||||
|
@ -240,7 +245,7 @@ export default class Login extends Vue {
|
||||||
if (window.localStorage) {
|
if (window.localStorage) {
|
||||||
window.localStorage.setItem("welcome-back", "yes");
|
window.localStorage.setItem("welcome-back", "yes");
|
||||||
}
|
}
|
||||||
this.$router.push({ name: RouteName.HOME });
|
this.$router.replace({ name: RouteName.HOME });
|
||||||
return;
|
return;
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
this.submitted = false;
|
this.submitted = false;
|
||||||
|
@ -279,13 +284,6 @@ export default class Login extends Vue {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Watch("currentUser")
|
|
||||||
redirectToHomepageIfAlreadyLoggedIn(): Promise<Route> | void {
|
|
||||||
if (this.currentUser.isLoggedIn) {
|
|
||||||
return this.$router.push("/");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
get hasCaseWarning(): boolean {
|
get hasCaseWarning(): boolean {
|
||||||
return this.credentials.email !== this.credentials.email.toLowerCase();
|
return this.credentials.email !== this.credentials.email.toLowerCase();
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,7 +22,7 @@ import { InMemoryCache } from "@apollo/client/cache";
|
||||||
const localVue = createLocalVue();
|
const localVue = createLocalVue();
|
||||||
localVue.use(Buefy);
|
localVue.use(Buefy);
|
||||||
config.mocks.$t = (key: string): string => key;
|
config.mocks.$t = (key: string): string => key;
|
||||||
const $router = { push: jest.fn() };
|
const $router = { push: jest.fn(), replace: jest.fn() };
|
||||||
|
|
||||||
describe("Render login form", () => {
|
describe("Render login form", () => {
|
||||||
let wrapper: Wrapper<Vue>;
|
let wrapper: Wrapper<Vue>;
|
||||||
|
@ -125,9 +125,9 @@ describe("Render login form", () => {
|
||||||
await flushPromises();
|
await flushPromises();
|
||||||
expect(currentUser?.email).toBe("some@email.tld");
|
expect(currentUser?.email).toBe("some@email.tld");
|
||||||
expect(currentUser?.id).toBe("1");
|
expect(currentUser?.id).toBe("1");
|
||||||
expect(jest.isMockFunction(wrapper.vm.$router.push)).toBe(true);
|
expect(jest.isMockFunction(wrapper.vm.$router.replace)).toBe(true);
|
||||||
await flushPromises();
|
await flushPromises();
|
||||||
expect($router.push).toHaveBeenCalledWith({ name: RouteName.HOME });
|
expect($router.replace).toHaveBeenCalledWith({ name: RouteName.HOME });
|
||||||
});
|
});
|
||||||
|
|
||||||
it("handles a login error", async () => {
|
it("handles a login error", async () => {
|
||||||
|
|
Loading…
Reference in a new issue