test: add ui test cases (#10179)

* test: add ui test cases --------- Co-authored-by: v-ivanchen_microsoft <[email protected]>
OfficeDev · Oct 20, 2023 · 36ed5f5 · 36ed5f5
1 parent 9dac42e
commit 36ed5f5
Show file tree

Hide file tree

Showing 6 changed files with 209 additions and 5 deletions.
diff --git a/packages/tests/scripts/randomCases.json b/packages/tests/scripts/randomCases.json
@@ -62,8 +62,7 @@
             "sample-localdebug-graph-connector-bot",
             "sample-localdebug-bot-sso",
             "sample-localdebug-dice-roller",
-            "sample-localdebug-chef-bot",
-            "sample-localdebug-bot-sso"
+            "sample-localdebug-chef-bot"
         ]
     },
     {
@@ -89,8 +88,9 @@
             "sample-remotedebug-share-now",
             "sample-remotedebug-proactive-message",
             "sample-remotedebug-assistant-dashboard",
-            "sample-remotedebug-hello-world-tab-outlook"
-
+            "sample-remotedebug-hello-world-tab-outlook",
+            "sample-remotedebug-bot-sso",
+            "sample-remotedebug-sso-tab-via-apim-proxy"
         ]
     },
     {
@@ -100,7 +100,9 @@
             }
         },
         "cases": [
-            "sample-remotedebug-todo-list-with-spfx"
+            "sample-remotedebug-todo-list-with-spfx",
+            "sample-remotedebug-react-retail-dashboard",
+            "sample-remotedebug-spfx-productivity-dashboard"
         ]
     },
     {

diff --git a/packages/tests/src/ui-test/samples/sample-remotedebug-bot-sso.test.ts b/packages/tests/src/ui-test/samples/sample-remotedebug-bot-sso.test.ts
@@ -0,0 +1,28 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+/**
+ * @author Ivan Chen <[email protected]>
+ */
+
+import { Page } from "playwright";
+import { TemplateProject } from "../../utils/constants";
+import { validateBot } from "../../utils/playwrightOperation";
+import { CaseFactory } from "./sampleCaseFactory";
+import { Env } from "../../utils/env";
+
+class BotSSOTestCase extends CaseFactory {
+  override async onValidate(page: Page): Promise<void> {
+    return await validateBot(page, {
+      botCommand: "show",
+      expected: Env.displayName,
+    });
+  }
+}
+
+new BotSSOTestCase(
+  TemplateProject.HelloWorldBotSSO,
+  14571876,
+  "[email protected]",
+  "dev"
+).test();
diff --git a/packages/tests/src/ui-test/samples/sample-remotedebug-react-retail-dashboard.test.ts b/packages/tests/src/ui-test/samples/sample-remotedebug-react-retail-dashboard.test.ts
@@ -0,0 +1,48 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+/**
+ * @author Ivan Chen <[email protected]>
+ */
+
+import { TemplateProject } from "../../utils/constants";
+import { CaseFactory } from "./sampleCaseFactory";
+import { Page } from "playwright";
+import { initTeamsPage } from "../../utils/playwrightOperation";
+import { SampledebugContext } from "./sampledebugContext";
+import { Env } from "../../utils/env";
+
+class RetailDashboardTestCase extends CaseFactory {
+  public override async onInitPage(
+    sampledebugContext: SampledebugContext,
+    teamsAppId: string,
+    options?: {
+      teamsAppName: string;
+      type: string;
+    }
+  ): Promise<Page> {
+    return await initTeamsPage(
+      sampledebugContext.context!,
+      teamsAppId,
+      Env.username,
+      Env.password,
+      {
+        teamsAppName: options?.teamsAppName,
+        type: options?.type,
+      }
+    );
+  }
+}
+
+new RetailDashboardTestCase(
+  TemplateProject.RetailDashboard,
+  25051150,
+  "[email protected]",
+  "dev",
+  [],
+  {
+    teamsAppName: "react-retail-dashboard-dev",
+    type: "spfx",
+    skipValidation: true,
+  }
+).test();
diff --git a/packages/tests/src/ui-test/samples/sample-remotedebug-spfx-productivity-dashboard.test.ts b/packages/tests/src/ui-test/samples/sample-remotedebug-spfx-productivity-dashboard.test.ts
@@ -0,0 +1,48 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+/**
+ * @author Ivan Chen <[email protected]>
+ */
+
+import { Page } from "playwright";
+import { TemplateProject, LocalDebugTaskLabel } from "../../utils/constants";
+import { initTeamsPage } from "../../utils/playwrightOperation";
+import { CaseFactory } from "./sampleCaseFactory";
+import { SampledebugContext } from "./sampledebugContext";
+import { Env } from "../../utils/env";
+
+class SpfxProductivityTestCase extends CaseFactory {
+  public override async onInitPage(
+    sampledebugContext: SampledebugContext,
+    teamsAppId: string,
+    options?: {
+      teamsAppName: string;
+      type: string;
+    }
+  ): Promise<Page> {
+    return await initTeamsPage(
+      sampledebugContext.context!,
+      teamsAppId,
+      Env.username,
+      Env.password,
+      {
+        teamsAppName: options?.teamsAppName,
+        type: options?.type,
+      }
+    );
+  }
+}
+
+new SpfxProductivityTestCase(
+  TemplateProject.SpfxProductivity,
+  24753065,
+  "[email protected]",
+  "local",
+  [LocalDebugTaskLabel.GulpServe],
+  {
+    teamsAppName: "SPFx productivity dashboard",
+    type: "spfx",
+    skipValidation: true,
+  }
+).test();
diff --git a/packages/tests/src/ui-test/samples/sample-remotedebug-sso-tab-via-apim-proxy.test.ts b/packages/tests/src/ui-test/samples/sample-remotedebug-sso-tab-via-apim-proxy.test.ts
@@ -0,0 +1,27 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+/**
+ * @author Ivan Chen <[email protected]>
+ */
+
+import { Page } from "playwright";
+import { TemplateProject } from "../../utils/constants";
+import { validateTabApim } from "../../utils/playwrightOperation";
+import { CaseFactory } from "./sampleCaseFactory";
+import { Env } from "../../utils/env";
+
+class SsotabApimTestCase extends CaseFactory {
+  override async onValidate(page: Page): Promise<void> {
+    return await validateTabApim(page, {
+      displayName: Env.displayName,
+    });
+  }
+}
+
+new SsotabApimTestCase(
+  TemplateProject.TabSSOApimProxy,
+  25191534,
+  "[email protected]",
+  "dev"
+).test();
diff --git a/packages/tests/src/utils/playwrightOperation.ts b/packages/tests/src/utils/playwrightOperation.ts
@@ -2002,3 +2002,54 @@ export async function validateUnfurlCard(page: Page) {
     throw error;
   }
 }
+
+export async function validateTabApim(
+  page: Page,
+  options?: { displayName?: string }
+) {
+  try {
+    const frameElementHandle = await page.waitForSelector(
+      "iframe.embedded-iframe"
+    );
+    const frame = await frameElementHandle?.contentFrame();
+
+    const startBtn = await frame?.waitForSelector(
+      'button:has-text("Consent and log in")'
+    );
+
+    await RetryHandler.retry(async () => {
+      console.log("Before popup");
+      const [popup] = await Promise.all([
+        page
+          .waitForEvent("popup")
+          .then((popup) =>
+            popup
+              .waitForEvent("close", {
+                timeout: Timeout.playwrightConsentPopupPage,
+              })
+              .catch(() => popup)
+          )
+          .catch(() => {}),
+        startBtn?.click(),
+      ]);
+      console.log("after popup");
+
+      if (popup && !popup?.isClosed()) {
+        await popup
+          .click('button:has-text("Reload")', {
+            timeout: Timeout.playwrightConsentPageReload,
+          })
+          .catch(() => {});
+        await popup.click("input.button[type='submit'][value='Accept']");
+      }
+    });
+
+    await frame?.waitForSelector(`div:has-text("${options?.displayName}")`);
+  } catch (error) {
+    await page.screenshot({
+      path: getPlaywrightScreenshotPath("error"),
+      fullPage: true,
+    });
+    throw error;
+  }
+}