Fix race condition

client/cypress/integration/frontend/onboarding.spec.js

@@ -7,17 +7,25 @@ describe('Onboarding', () => {
     cy.setup();
   });
 
-  it('shows the onboarding steps and finishes them', () => {
+  it.only('shows the onboarding steps and finishes them', () => {
+    let onboardingVisited = false;
     cy.mockGraphqlOps({
       operations: {
-        MeQuery: {
+        MeQuery: () => ({
           me: {
-            ...me.me,
-            onboardingVisited: false
-          }
+            onboardingVisited,
+          },
+        }),
+        UpdateOnboardingProgress: () => {
+          onboardingVisited = true;
+          return {
+            updateOnboardingProgress: {
+              success: true,
+            },
+          };
         },
-        ...mockUpdateOnboardingProgress()
-      }
+        NewsTeasers: {}
+      },
     });
 
     cy.visit('/');
@@ -30,18 +38,23 @@ describe('Onboarding', () => {
   });
 
   it('shows the onboarding steps and skips them', () => {
-    cy.fakeLogin('hansli', 'test');
-
+    let onboardingVisited = false;
     cy.mockGraphqlOps({
       operations: {
         MeQuery: {
           me: {
-            ...me.me,
-            onboardingVisited: false
-          }
+            onboardingVisited,
+          },
         },
-        ...mockUpdateOnboardingProgress()
-      }
+        UpdateOnboardingProgress: () => {
+          onboardingVisited = true;
+          return {
+            updateOnboardingProgress: {
+              success: true,
+            },
+          };
+        },
+      },
     });
 
     cy.visit('/');
@@ -51,13 +64,12 @@ describe('Onboarding', () => {
   });
 
   it('does not show the onboarding', () => {
-    cy.fakeLogin('hansli', 'test');
-
     cy.mockGraphqlOps({
       operations: {
-        MeQuery: me,
-        ...mockUpdateOnboardingProgress()
-      }
+        MeQuery: {
+          me: {}
+        }
+      },
     });
 
     cy.visit('/');

client/src/pages/onboarding.vue

@@ -27,7 +27,7 @@
       },
       illustration() {
         return this.$route.meta.illustration;
-      }
+      },
     },
 
     methods: {
@@ -35,11 +35,11 @@
         const next = this.$route.meta.next;
         if (next === 'home') {
           this.completeOnboarding();
+        } else {
+          this.$router.push({name: next});
         }
-        this.$router.push({name: next});
       },
       completeOnboarding() {
-        const router = this.$router;
         this.$apollo.mutate({
           mutation: UPDATE_ONBOARDING_PROGRESS,
           update(store, {data: {updateOnboardingProgress: {success}}}) {
@@ -49,11 +49,12 @@
               data.me.onboardingVisited = success;
               store.writeQuery({query, data});
             }
-            router.push({name: 'home'});
-          }
+          },
+        }).then(() => {
+          this.$router.push({name: 'home'});
         });
-      }
-    }
+      },
+    },
   };
 </script>