e2e tests for deployment/licenses (#12926)

mtojek · web-flow · commit 2f2a395ba946 · 2024-04-10T15:00:39.000+02:00
diff --git a/site/e2e/tests/deployment/licenses.spec.ts b/site/e2e/tests/deployment/licenses.spec.ts
@@ -0,0 +1,30 @@
+import { expect, test } from "@playwright/test";
+import { requiresEnterpriseLicense } from "../../helpers";
+
+test("license was added successfully", async ({ page }) => {
+  requiresEnterpriseLicense();
+
+  await page.goto("/deployment/licenses", { waitUntil: "domcontentloaded" });
+  const firstLicense = page.locator(".licenses > .license-card", {
+    hasText: "#1",
+  });
+  await expect(firstLicense).toBeVisible();
+
+  // Trial vs. Enterprise?
+  const accountType = firstLicense.locator(".account-type");
+  await expect(accountType).toHaveText("Enterprise");
+
+  // User limit 1/1
+  const userLimit = firstLicense.locator(".user-limit");
+  await expect(userLimit).toHaveText("1 / 1");
+
+  // License should not be expired yet
+  const licenseExpires = firstLicense.locator(".license-expires");
+  const licenseExpiresDate = new Date(await licenseExpires.innerText());
+  const now = new Date();
+  expect(licenseExpiresDate.getTime()).toBeGreaterThan(now.getTime());
+
+  // "Remove" button should be visible
+  const removeButton = firstLicense.locator(".remove-button");
+  await expect(removeButton).toBeVisible();
+});
diff --git a/site/e2e/tests/enterprise.spec.ts b/site/e2e/tests/enterprise.spec.ts
diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx
@@ -32,7 +32,12 @@ export const LicenseCard: FC<LicenseCardProps> = ({
     license.claims.features["user_limit"] || userLimitLimit;
 
   return (
-    <Paper key={license.id} elevation={2} css={styles.licenseCard}>
+    <Paper
+      key={license.id}
+      elevation={2}
+      css={styles.licenseCard}
+      className="license-card"
+    >
       <ConfirmDialog
         type="delete"
         hideCancel={false}
@@ -58,7 +63,7 @@ export const LicenseCard: FC<LicenseCardProps> = ({
         alignItems="center"
       >
         <span css={styles.licenseId}>#{license.id}</span>
-        <span css={styles.accountType}>
+        <span css={styles.accountType} className="account-type">
           {license.claims.trial ? "Trial" : "Enterprise"}
         </span>
         <Stack
@@ -72,7 +77,7 @@ export const LicenseCard: FC<LicenseCardProps> = ({
         >
           <Stack direction="column" spacing={0} alignItems="center">
             <span css={styles.secondaryMaincolor}>Users</span>
-            <span css={styles.userLimit}>
+            <span css={styles.userLimit} className="user-limit">
               {userLimitActual} {` / ${currentUserLimit || "Unlimited"}`}
             </span>
           </Stack>
@@ -92,7 +97,7 @@ export const LicenseCard: FC<LicenseCardProps> = ({
             ) : (
               <span css={styles.secondaryMaincolor}>Valid Until</span>
             )}
-            <span css={styles.licenseExpires}>
+            <span css={styles.licenseExpires} className="license-expires">
               {dayjs
                 .unix(license.claims.license_expires)
                 .format("MMMM D, YYYY")}
@@ -104,6 +109,7 @@ export const LicenseCard: FC<LicenseCardProps> = ({
               variant="contained"
               size="small"
               onClick={() => setLicenseIDMarkedForRemoval(license.id)}
+              className="remove-button"
             >
               Remove&hellip;
             </Button>
diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx
@@ -84,7 +84,7 @@ const LicensesSettingsPageView: FC<Props> = ({
       {isLoading && <Skeleton variant="rectangular" height={200} />}
 
       {!isLoading && licenses && licenses?.length > 0 && (
-        <Stack spacing={4}>
+        <Stack spacing={4} className="licenses">
           {licenses
             ?.sort(
               (a, b) =>
