add playwright test cases

Signed-off-by: Amit Amrutiya <[email protected]>

.github/workflows/playwright.yml

@@ -1,6 +1,11 @@
 name: Playwright Tests
 on:
-  workflow_dispatch:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
 
 jobs:
   build:
@@ -16,6 +21,7 @@ jobs:
         run: |
           echo "AUTH_SECRET=secrec777" >> apps/web/.env
           echo "NEXTAUTH_URL=https://meetn-chat.vercel.app" >> apps/web/.env
+          echo "DATABASE_URL=DATABASE_URL" >> apps/web/.env
       - name: Print .env file
         run: cat apps/web/.env
       - name: Run Playwright tests

apps/web/components/sign-in-form.tsx

@@ -24,7 +24,7 @@ function SignInForm() {
     <ShineBorder color={["#A07CFE", "#FE8FB5", "#FFBE7B"]} duration={7} borderWidth={4}>
       <div className="bg-background w-full max-w-md space-y-6 rounded-lg p-8 shadow-md">
         <div className="text-center">
-          <h1 className="mb-6 text-2xl font-extrabold text-white">Please Login to Use</h1>
+          <p className="mb-6 text-2xl font-extrabold text-white">Please Login to Use</p>
           <p className="mb-4 text-white">Sign in to start your anonymous adventure</p>
         </div>
         <Form {...signinForm}>

apps/web/components/sign-up-form.tsx

@@ -135,7 +135,7 @@ function SignupForm() {
       <div className="flex items-start justify-start">
         <div className="bg-background w-full max-w-md space-y-8 rounded-lg p-8 shadow-md">
           <div className="text-center">
-            <h1 className="mb-6 text-2xl font-extrabold tracking-tighter text-white">Please SignUp to Use</h1>
+            <p className="mb-6 text-2xl font-extrabold tracking-tighter text-white">Please SignUp to Use</p>
             <p className="mb-4 text-white">Sign up to start your anonymous adventure</p>
           </div>
           <Form {...sendVerificationEmailForm}>

apps/web/package.json

@@ -1,9 +1,12 @@
 {
+
   "name": "web",
   "version": "0.1.0",
   "private": true,
   "scripts": {
     "dev": "next dev",
+    "prisma:generate": "prisma generate",
+    "prisma:push": "prisma db push",
     "build": "prisma generate && next build",
     "start": "next start",
     "lint": "next lint"

package.json

@@ -6,11 +6,13 @@
     "build": "turbo build",
     "dev": "turbo dev",
     "lint": "turbo lint",
-    "format": "prettier --write \"**/*.{ts,tsx,md}\""
+    "format": "prettier --write \"**/*.{ts,tsx,md}\"",
+    "prisma:generate": "turbo prisma:generate",
+    "prisma:push": "turbo prisma:push"
   },
   "devDependencies": {
     "prettier": "^3.2.5",
-    "turbo": "^2.0.6",
+    "turbo": "^2.0.12",
     "typescript": "^5.4.5"
   },
   "engines": {

packages/ui/src/shad/ui/globe.tsx

@@ -95,7 +95,7 @@ export function Globe({ className, config = GLOBE_CONFIG }: { className?: string
   return (
     <div className={cn("inset-0 mx-auto aspect-[1/1] w-full max-w-[600px]", className)}>
       <h2 className="mt-14 text-center text-xl font-bold text-white md:text-4xl">Best way to connect with people</h2>
-      <p className="mx-auto mt-2 max-w-md text-center font-sans text-base font-normal text-neutral-300 md:text-lg">
+      <p className="globe-description mx-auto mt-2 max-w-md text-center font-sans text-base font-normal text-neutral-300 md:text-lg">
         Connect with people around the world with just a click of a button. Best way to connect with people.
       </p>
       <canvas

packages/web-tests/playwright.config.ts

@@ -1,4 +1,4 @@
-import { defineConfig, devices } from '@playwright/test';
+import { defineConfig, devices } from "@playwright/test";
 
 /**
  * Read environment variables from file.
@@ -11,7 +11,7 @@ import { defineConfig, devices } from '@playwright/test';
  * See https://playwright.dev/docs/test-configuration.
  */
 export default defineConfig({
-  testDir: './tests',
+  timeout: 60000,
   /* Run tests in files in parallel */
   fullyParallel: true,
   /* Fail the build on CI if you accidentally left test.only in the source code. */
@@ -21,31 +21,32 @@ export default defineConfig({
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: 'html',
+  reporter: "html",
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
     // baseURL: 'http://127.0.0.1:3000',
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: 'on-first-retry',
+    actionTimeout: 100000,
+    trace: "on-first-retry",
   },
 
   /* Configure projects for major browsers */
   projects: [
     {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] },
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"] },
     },
 
     {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] },
+      name: "firefox",
+      use: { ...devices["Desktop Firefox"] },
     },
 
     {
-      name: 'webkit',
-      use: { ...devices['Desktop Safari'] },
+      name: "webkit",
+      use: { ...devices["Desktop Safari"] },
     },
 
     /* Test against mobile viewports. */

packages/web-tests/tests/icon-cart-button.test.ts

@@ -0,0 +1,87 @@
+import { test, expect } from '@playwright/test';
+
+const functions = [
+  {
+    title: "One-to-One Video Call",
+    subtitle: "Fast and Direct Communication",
+    description:
+      "Connect instantly with another user for a direct video call. Experience seamless communication with real-time video streaming, ensuring a swift exchange of information.",
+    link: `/room/one-video/`, // Use a placeholder for dynamic UUIDs
+  },
+  {
+    title: "Group Video Call",
+    subtitle: "Collaborate with Multiple Participants",
+    description:
+      "Host video calls with multiple participants for collaborative discussions. Although slightly slower due to increased data transfer, enjoy the benefits of real-time interaction with multiple team members or friends.",
+    link: `/room/group-video/`,
+  },
+  {
+    title: "One-to-One Meeting Call",
+    subtitle: "Efficient and Personalized Meetings",
+    description:
+      "Conduct efficient one-to-one meetings with colleagues or clients. Enjoy faster connection speeds for personalized discussions, allowing for effective communication and decision-making.",
+    link: `/room/one-meet/`,
+  },
+  {
+    title: "Group Meeting Call",
+    subtitle: "Coordinate with Large Groups",
+    description:
+      "Organize meetings with larger groups for discussions, presentations, or brainstorming sessions. While slightly slower due to increased data handling, benefit from the ability to engage with multiple participants simultaneously.",
+    link: `/room/group-meet/`,
+  },
+  {
+    title: "One-to-One User Chat",
+    subtitle: "Instant Text Communication",
+    description:
+      "Engage in private text conversations with individual users. Experience instantaneous message delivery for seamless communication, enabling quick exchange of ideas, information, or updates.",
+    link: `/room/one-chat`,
+  },
+  {
+    title: "Group User Chat",
+    subtitle: "Collaborative Text Communication",
+    description:
+      "Participate in group chats with multiple users for collaborative discussions or coordination. Enjoy real-time messaging with the added benefit of engaging with a larger community simultaneously.",
+    link: `/room/group-chat`,
+  },
+  {
+    title: "Random Video Call",
+    subtitle: "Connect with Random Users",
+    description:
+      "Connect with random users for spontaneous video calls. Experience the excitement of meeting new people while engaging in real-time video conversations.",
+    link: `/room/random-video`,
+  },
+];
+
+test.describe('IconCardButton component tests', () => {
+  test.beforeEach(async ({ page }) => {
+    // Navigate to the target URL
+    await page.goto('http://localhost:3000');
+  });
+
+  functions.forEach((func, index) => {
+    test(`should display correct information for ${func.title}`, async ({ page }) => {
+      // Verify the title
+      await expect(page.locator(`text=${func.title}`)).toBeVisible();
+
+      // Verify the subtitle
+      await expect(page.locator(`text=${func.subtitle}`)).toBeVisible();
+
+      // Verify the description in the hover card content
+      await page.hover(`text=${func.title}`);
+      await expect(page.locator('text=' + func.description)).toBeVisible();
+    });
+
+    test(`should navigate to correct link when ${func.title} is clicked`, async ({ page }) => {
+      // Click the element
+      await page.click(`text=${func.title}`);
+
+      // Construct the expected URL pattern
+      const baseURL = func.link.replace(/\/\{.+\}$/, '');
+      // const expectedURLPattern = new RegExp(`${baseURL}/[a-f0-9-]{36}$`); // UUID regex pattern
+
+      // Verify the URL after clicking
+      await expect(page).toHaveURL(baseURL);
+    });
+
+  });
+});

packages/web-tests/tests/index.test.ts

@@ -1,10 +1,24 @@
 import { test, expect } from "@playwright/test";
 
-test("homapge has title", async ({ page }) => {
-  page.on("console", (msg) => console.log(msg.text()));
-
+test("homapge text", async ({ page }) => {
   await page.goto("http://localhost:3000");
+  await page.waitForLoadState("domcontentloaded");
+
+  await expect(page.locator("text=ChillChat")).toBeVisible();
+  await expect(page.locator("text=Miss")).toBeVisible();
+  await expect(page.locator("text=All in one Website for Meet")).toBeVisible();
+  await expect(page.locator("text=Please Login to Use")).toBeVisible();
+  await expect(page.locator("text=Sign in to start your anonymous adventure")).toBeVisible();
+  await expect(page.locator('input[name="identifier"]')).toBeVisible();
+  await expect(page.locator('input[name="password"]')).toBeVisible();
+  await expect(page.locator("text=Log In")).toBeVisible();
+  await expect(page.locator("text=Sign in with Google")).toBeVisible();
 
-  // Expect a title "to contain" a substring.
-  await expect(page).toHaveTitle(/MeetnChillChat/);
+  await expect(page.locator('h2:has-text("Best way to connect with people")')).toBeVisible();
+  await expect(
+    page.locator(
+      "text=Connect with people around the world with just a click of a button. Best way to connect with people."
+    )
+  ).toBeVisible();
+  await expect(page.locator("canvas")).toBeVisible();
 });

packages/web-tests/tests/login.test.ts

@@ -0,0 +1,23 @@
+import { test, expect } from "@playwright/test";
+
+test("should allow a user to sign up", async ({ page }) => {
+  await page.goto("http://localhost:3000");
+
+  await expect(page.locator("text=Please Login to Use")).toBeVisible();
+  await expect(page.locator("text=Sign in to start your anonymous adventure")).toBeVisible();
+
+  await expect(page.locator("text=Please enter a valid email address")).toBeHidden();
+  await expect(page.locator("text=Password must be at least 6 characters")).toBeHidden();
+
+  await page.click('button:has-text("Log In")');
+
+  await expect(page.locator("text=Please enter a valid email address")).toBeVisible();
+  await expect(page.locator("text=Password must be at least 6 characters")).toBeVisible();
+
+  await page.fill('input[placeholder="Email/Username"]', "testuser");
+  await page.fill('input[placeholder="Password"]', "TestPassword123");
+
+  await expect(page.locator("text=Please enter a valid email address")).toBeHidden();
+  await expect(page.locator("text=Password must be at least 6 characters")).toBeHidden();
+
+});

packages/web-tests/tests/signup.test.ts

@@ -0,0 +1,29 @@
+import { test, expect } from "@playwright/test";
+
+test("should allow a user to sign up", async ({ page }) => {
+  // Navigate to the signup page
+  await page.goto("http://localhost:3000");
+
+  // Click on the 'SignUp' tab
+  await expect(page.locator("text=Please SignUp to Use")).toBeHidden();
+  await expect(page.locator("text=Sign up to start your anonymous adventure")).toBeHidden();
+
+  await page.click("text=SignUp");
+
+  await expect(page.locator("text=Please SignUp to Use")).toBeVisible();
+  await expect(page.locator("text=Sign up to start your anonymous adventure")).toBeVisible();
+
+  // Fill out the signup form
+  await page.fill('input[placeholder="Enter Full Name"]', "Test User");
+  await page.fill('input[placeholder="Username"]', "testuser");
+  await page.fill('input[placeholder="Email"]', "[email protected]");
+  await page.fill('input[placeholder="Password"]', "TestPassword123");
+
+  // Click the 'Sign Up' button
+  // await page.click('button:has-text("Sign Up")');
+
+  // You might want to check for a success message or redirection
+  // await expect(page).toHaveURL(/.*dashboard/); // Adjust the URL or condition as needed
+  // Or check for a success message
+  // await expect(page.locator('text=Signup successful')).toBeVisible();
+});

yarn.lock

@@ -7453,47 +7453,47 @@ tsutils@^3.21.0:
   dependencies:
     tslib "^1.8.1"
 
-[email protected].6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/turbo-darwin-64/-/turbo-darwin-64-2.0.6.tgz#b916d810bb10b2abdf6da5a830b9db67ff783b2b"
-  integrity sha512-XpgBwWj3Ggmz/gQVqXdMKXHC1iFPMDiuwugLwSzE7Ih0O13JuNtYZKhQnopvbDQnFQCeRq2Vsm5OTWabg/oB/g==
-
-[email protected].6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/turbo-darwin-arm64/-/turbo-darwin-arm64-2.0.6.tgz#61877ed515513ccdc39d750d88fa6ec2cd61af26"
-  integrity sha512-RfeZYXIAkiA21E8lsvfptGTqz/256YD+eI1x37fedfvnHFWuIMFZGAOwJxtZc6QasQunDZ9TRRREbJNI68tkIw==
-
-[email protected].6:
-  version "2.0.6"
-  resolved "https://registry.npmjs.org/turbo-linux-64/-/turbo-linux-64-2.0.6.tgz"
-  integrity sha512-92UDa0xNQQbx0HdSp9ag3YSS3xPdavhc7q9q9mxIAcqyjjD6VElA4Y85m4F/DDGE5SolCrvBz2sQhVmkOd6Caw==
-
-[email protected].6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/turbo-linux-arm64/-/turbo-linux-arm64-2.0.6.tgz#a0366816c0a9c08966b6cc5358fd9097c153722a"
-  integrity sha512-eQKu6utCVUkIH2kqOzD8OS6E0ba6COjWm6PRDTNCHQRljZW503ycaTUIdMOiJrVg1MkEjDyOReUg8s8D18aJ4Q==
-
-[email protected].6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/turbo-windows-64/-/turbo-windows-64-2.0.6.tgz#4ea229c9e615ad9d56faa9cacf9afa9f5eb43cd4"
-  integrity sha512-+9u4EPrpoeHYCQ46dRcou9kbkSoelhOelHNcbs2d86D6ruYD/oIAHK9qgYK8LeARRz0jxhZIA/dWYdYsxJJWkw==
-
-[email protected].6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/turbo-windows-arm64/-/turbo-windows-arm64-2.0.6.tgz#466fa8ae4b43b29feefddff22384299d7482aef9"
-  integrity sha512-rdrKL+p+EjtdDVg0wQ/7yTbzkIYrnb0Pw4IKcjsy3M0RqUM9UcEi67b94XOAyTa5a0GqJL1+tUj2ebsFGPgZbg==
-
-turbo@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.npmjs.org/turbo/-/turbo-2.0.6.tgz"
-  integrity sha512-/Ftmxd5Mq//a9yMonvmwENNUN65jOVTwhhBPQjEtNZutYT9YKyzydFGLyVM1nzhpLWahQSMamRc/RDBv5EapzA==
+[email protected].12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo-darwin-64/-/turbo-darwin-64-2.0.12.tgz#3ca5b781adf0bb68a5e35bc70ce35c791ae52145"
+  integrity sha512-NAgfgbXxX/JScWQmmQnGbPuFZq7LIswHfcMk5JwyBXQM/xmklNOxxac7MnGGIOf19Z2f6S3qHy17VIj0SeGfnA==
+
+[email protected].12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo-darwin-arm64/-/turbo-darwin-arm64-2.0.12.tgz#563af59a4629f2741f4e1fda68f47ff756f3c71c"
+  integrity sha512-cP02uer5KSJ+fXL+OfRRk5hnVjV0c60hxDgNcJxrZpfhun7HHoKDDR7w2xhQntiA45aC6ZZEXRqMKpj6GAmKbg==
+
+[email protected].12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo-linux-64/-/turbo-linux-64-2.0.12.tgz#7714dd67f8f8514ef19cce47d42de185c45f52ac"
+  integrity sha512-+mQgGfg1eq5qF+wenK/FKJaNMNAo5DQLC4htQy+8osW+fx6U+8+6UlPQPaycAWDEqwOI7NwuqkeHfkEQLQUTyQ==
+
+[email protected].12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo-linux-arm64/-/turbo-linux-arm64-2.0.12.tgz#04f54cddbb80db532151efffec556e363399737d"
+  integrity sha512-KFyEZDXfPU1DK4zimxdCcqAcK7IIttX4mfsgB7NsSEOmH0dhHOih/YFYiyEDC1lTRx0C2RlzQ0Kjjdz48AN5Eg==
+
+[email protected].12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo-windows-64/-/turbo-windows-64-2.0.12.tgz#b10d9190bee532d4989ab7acf637e4643c50eac3"
+  integrity sha512-kJj4KCkZTkDTDCqsSw1m1dbO4WeoQq1mYUm/thXOH0OkeqYbSMt0EyoTcJOgKUDsrMnzZD2gPfYrlYHtV69lVA==
+
+[email protected].12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo-windows-arm64/-/turbo-windows-arm64-2.0.12.tgz#35548e30614d6cc15bc4486d609335dfc971cd76"
+  integrity sha512-TY3ROxguDilN2olCwcZMaePdW01Xhma0pZU7bNhsQEqca9RGAmsZBuzfGnTMcWPmv4tpnb/PlX1hrt1Hod/44Q==
+
+turbo@^2.0.12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/turbo/-/turbo-2.0.12.tgz#0a3221d1cfc83b4631552a18f1b982e84ec3fb0e"
+  integrity sha512-8s2KwqjwQj7z8Z53SUZSKVkQOZ2/Sl4D2F440oaBY/k2lGju60dW6srEpnn8/RIDeICZmQn3pQHF79Jfnc5Skw==
   optionalDependencies:
-    turbo-darwin-64 "2.0.6"
-    turbo-darwin-arm64 "2.0.6"
-    turbo-linux-64 "2.0.6"
-    turbo-linux-arm64 "2.0.6"
-    turbo-windows-64 "2.0.6"
-    turbo-windows-arm64 "2.0.6"
+    turbo-darwin-64 "2.0.12"
+    turbo-darwin-arm64 "2.0.12"
+    turbo-linux-64 "2.0.12"
+    turbo-linux-arm64 "2.0.12"
+    turbo-windows-64 "2.0.12"
+    turbo-windows-arm64 "2.0.12"
 
 type-check@^0.4.0, type-check@~0.4.0:
   version "0.4.0"