E2E Helper `visitQuestion`: Ensure that the query loaded before moving forward...

E2E Helper `visitQuestion`: Ensure that the query loaded before moving forward with the test (#20630)

* Add `visitQuestion` helper function

* Apply `visitQuestion` to specs related to alerts

frontend/test/__support__/e2e/helpers/e2e-misc-helpers.js

@@ -145,3 +145,19 @@ export const cypressWaitAll = function(commands) {
 
   return p;
 };
+
+/**
+ * Visit a question and wait for its query to load.
+ *
+ * @param {number} id
+ */
+export function visitQuestion(id) {
+  // In case we use this function multiple times in a test, make sure aliases are unique for each question
+  const alias = "cardQuery" + id;
+
+  cy.intercept("POST", `/api/card/${id}/query`).as(alias);
+
+  cy.visit(`/question/${id}`);
+
+  cy.wait("@" + alias);
+}

frontend/test/metabase/scenarios/sharing/alert/alert-permissions.cy.spec.js

-import { restore, setupSMTP } from "__support__/e2e/cypress";
+import { restore, setupSMTP, visitQuestion } from "__support__/e2e/cypress";
 
 describe("scenarios > alert > alert permissions", () => {
   // Intentional use of before (not beforeEach) hook because the setup is quite long.
@@ -10,16 +10,16 @@ describe("scenarios > alert > alert permissions", () => {
     setupSMTP();
 
     // Create alert as admin
-    cy.visit("/question/1");
+    visitQuestion(1);
     createBasicAlert({ firstAlert: true });
 
     // Create alert as admin that user can see
-    cy.visit("/question/2");
+    visitQuestion(2);
     createBasicAlert({ includeNormal: true });
 
     // Create alert as normal user
     cy.signInAsNormalUser();
-    cy.visit("/question/3");
+    visitQuestion(3);
     createBasicAlert();
   });
 
@@ -56,7 +56,7 @@ describe("scenarios > alert > alert permissions", () => {
     beforeEach(cy.signInAsNormalUser);
 
     it("should not let you see other people's alerts", () => {
-      cy.visit("/question/1");
+      visitQuestion(1);
       cy.icon("bell").click();
 
       cy.findByText("Unsubscribe").should("not.exist");
@@ -64,7 +64,7 @@ describe("scenarios > alert > alert permissions", () => {
     });
 
     it("should let you see other alerts where you are a recipient", () => {
-      cy.visit("/question/2");
+      visitQuestion(2);
       cy.icon("bell").click();
 
       cy.findByText("You're receiving Bobby's alerts");
@@ -72,7 +72,7 @@ describe("scenarios > alert > alert permissions", () => {
     });
 
     it("should let you see your own alerts", () => {
-      cy.visit("/question/3");
+      visitQuestion(3);
       cy.icon("bell").click();
 
       cy.findByText("You set up an alert");
@@ -80,14 +80,14 @@ describe("scenarios > alert > alert permissions", () => {
 
     it("should let you unsubscribe from both your own and others' alerts", () => {
       // Unsubscribe from your own alert
-      cy.visit("/question/3");
+      visitQuestion(3);
       cy.icon("bell").click();
       cy.findByText("Unsubscribe").click();
 
       cy.findByText("Okay, you're unsubscribed");
 
       // Unsubscribe from others' alerts
-      cy.visit("/question/2");
+      visitQuestion(2);
       cy.icon("bell").click();
       cy.findByText("Unsubscribe").click();
 

frontend/test/metabase/scenarios/sharing/alert/alert.cy.spec.js

@@ -2,6 +2,7 @@ import {
   restore,
   setupSMTP,
   mockSlackConfigured,
+  visitQuestion,
 } from "__support__/e2e/cypress";
 
 const channels = { slack: mockSlackConfigured, email: setupSMTP };
@@ -13,7 +14,7 @@ describe("scenarios > alert", () => {
   });
   describe("with nothing set", () => {
     it("should prompt you to add email/slack credentials", () => {
-      cy.visit("/question/1");
+      visitQuestion(1);
       cy.icon("bell").click();
 
       cy.findByText(
@@ -24,7 +25,7 @@ describe("scenarios > alert", () => {
     it("should say to non-admins that admin must add email credentials", () => {
       cy.signInAsNormalUser();
 
-      cy.visit("/question/1");
+      visitQuestion(1);
       cy.icon("bell").click();
 
       cy.findByText(
@@ -42,7 +43,7 @@ describe("scenarios > alert", () => {
         cy.intercept("POST", "/api/card/2/query").as("questionLoaded");
 
         // Open the first alert screen and create an alert
-        cy.visit("/question/1");
+        visitQuestion(1);
         cy.icon("bell").click();
 
         cy.findByText("The wide world of alerts");
@@ -58,7 +59,7 @@ describe("scenarios > alert", () => {
         cy.wait("@savedAlert");
 
         // Open the second alert screen
-        cy.visit("/question/2");
+        visitQuestion(2);
         cy.wait("@questionLoaded");
 
         cy.icon("bell").click();