Increase timeout for explore.e2e.spec test (janhq#1844)

* Increase timeout for explore.e2e.spec test * fix: test cases and timeout --------- Co-authored-by: Hien To <[email protected]> Co-authored-by: Louis <[email protected]>
FellowTraveler · Jan 31, 2024 · cfadd13 · cfadd13
1 parent 203f816
commit cfadd13
Show file tree

Hide file tree

Showing 9 changed files with 51 additions and 126 deletions.
diff --git a/electron/playwright.config.ts b/electron/playwright.config.ts
@@ -1,9 +1,9 @@
-import { PlaywrightTestConfig } from "@playwright/test";
+import { PlaywrightTestConfig } from '@playwright/test'
 
 const config: PlaywrightTestConfig = {
-  testDir: "./tests",
+  testDir: './tests',
   retries: 0,
-  timeout: 120000,
-};
+  globalTimeout: 300000,
+}
 
-export default config;
+export default config
diff --git a/electron/tests/explore.e2e.spec.ts → electron/tests/hub.e2e.spec.ts b/electron/tests/explore.e2e.spec.ts → electron/tests/hub.e2e.spec.ts
@@ -9,6 +9,7 @@ import {
 
 let electronApp: ElectronApplication
 let page: Page
+const TIMEOUT: number = parseInt(process.env.TEST_TIMEOUT || '300000')
 
 test.beforeAll(async () => {
   process.env.CI = 'e2e'
@@ -26,16 +27,23 @@ test.beforeAll(async () => {
   })
   await stubDialog(electronApp, 'showMessageBox', { response: 1 })
 
-  page = await electronApp.firstWindow()
+  page = await electronApp.firstWindow({
+    timeout: TIMEOUT,
+  })
 })
 
 test.afterAll(async () => {
   await electronApp.close()
   await page.close()
 })
 
-test('explores models', async () => {
-  await page.getByTestId('Hub').first().click()
-  await page.getByTestId('testid-explore-models').isVisible()
-  //   More test cases here...
+test('explores hub', async () => {
+  // Set the timeout for this test to 60 seconds
+  test.setTimeout(TIMEOUT)
+  await page.getByTestId('Hub').first().click({
+    timeout: TIMEOUT,
+  })
+  await page.getByTestId('hub-container-test-id').isVisible({
+    timeout: TIMEOUT,
+  })
 })
diff --git a/electron/tests/main.e2e.spec.ts b/electron/tests/main.e2e.spec.ts
diff --git a/electron/tests/navigation.e2e.spec.ts b/electron/tests/navigation.e2e.spec.ts
@@ -9,6 +9,7 @@ import {
 
 let electronApp: ElectronApplication
 let page: Page
+const TIMEOUT: number = parseInt(process.env.TEST_TIMEOUT || '300000')
 
 test.beforeAll(async () => {
   process.env.CI = 'e2e'
@@ -26,7 +27,9 @@ test.beforeAll(async () => {
   })
   await stubDialog(electronApp, 'showMessageBox', { response: 1 })
 
-  page = await electronApp.firstWindow()
+  page = await electronApp.firstWindow({
+    timeout: TIMEOUT,
+  })
 })
 
 test.afterAll(async () => {
@@ -35,20 +38,20 @@ test.afterAll(async () => {
 })
 
 test('renders left navigation panel', async () => {
-  // Chat section should be there
-  const chatSection = await page.getByTestId('Chat').first().isVisible()
-  expect(chatSection).toBe(false)
-
-  // Home actions
-  /* Disable unstable feature tests
-   ** const botBtn = await page.getByTestId("Bot").first().isEnabled();
-   ** Enable back when it is whitelisted
-   */
-
   const systemMonitorBtn = await page
     .getByTestId('System Monitor')
     .first()
-    .isEnabled()
-  const settingsBtn = await page.getByTestId('Settings').first().isEnabled()
+    .isEnabled({
+      timeout: TIMEOUT,
+    })
+  const settingsBtn = await page
+    .getByTestId('Thread')
+    .first()
+    .isEnabled({ timeout: TIMEOUT })
   expect([systemMonitorBtn, settingsBtn].filter((e) => !e).length).toBe(0)
+  // Chat section should be there
+  const apiServer = await page.getByTestId('Local API Server').first()
+  expect(apiServer).toBeVisible({
+    timeout: TIMEOUT,
+  })
 })
diff --git a/electron/tests/settings.e2e.spec.ts b/electron/tests/settings.e2e.spec.ts
@@ -9,6 +9,7 @@ import {
 
 let electronApp: ElectronApplication
 let page: Page
+const TIMEOUT: number = parseInt(process.env.TEST_TIMEOUT || '300000')
 
 test.beforeAll(async () => {
   process.env.CI = 'e2e'
@@ -26,7 +27,9 @@ test.beforeAll(async () => {
   })
   await stubDialog(electronApp, 'showMessageBox', { response: 1 })
 
-  page = await electronApp.firstWindow()
+  page = await electronApp.firstWindow({
+    timeout: TIMEOUT,
+  })
 })
 
 test.afterAll(async () => {
@@ -35,6 +38,7 @@ test.afterAll(async () => {
 })
 
 test('shows settings', async () => {
-  await page.getByTestId('Settings').first().click()
-  await page.getByTestId('testid-setting-description').isVisible()
+  await page.getByTestId('Settings').first().click({ timeout: TIMEOUT })
+  const settingDescription = page.getByTestId('testid-setting-description')
+  expect(settingDescription).toBeVisible({ timeout: TIMEOUT })
 })
diff --git a/electron/tests/system-monitor.e2e.spec.ts b/electron/tests/system-monitor.e2e.spec.ts
diff --git a/web/screens/ExploreModels/index.tsx b/web/screens/ExploreModels/index.tsx
@@ -52,9 +52,12 @@ const ExploreModelsScreen = () => {
   if (loading) return <Loader description="loading ..." />
 
   return (
-    <div className="flex h-full w-full overflow-y-auto bg-background">
+    <div
+      className="flex h-full w-full overflow-y-auto bg-background"
+      data-testid="hub-container-test-id"
+    >
       <div className="h-full w-full p-4">
-        <div className="h-full" data-test-id="testid-explore-models">
+        <div className="h-full">
           <ScrollArea>
             <div className="relative">
               <img

diff --git a/web/screens/Settings/index.tsx b/web/screens/Settings/index.tsx
@@ -54,7 +54,10 @@ const SettingsScreen = () => {
   }, [])
 
   return (
-    <div className="flex h-full bg-background">
+    <div
+      className="flex h-full bg-background"
+      data-testid="testid-setting-description"
+    >
       <div className="flex h-full w-64 flex-shrink-0 flex-col overflow-y-auto border-r border-border">
         <ScrollArea className="h-full w-full">
           <div className="px-6 py-4">

diff --git a/web/screens/SystemMonitor/index.tsx b/web/screens/SystemMonitor/index.tsx
@@ -35,7 +35,7 @@ export default function SystemMonitorScreen() {
   return (
     <div className="flex h-full w-full bg-background dark:bg-background">
       <ScrollArea className="h-full w-full">
-        <div className="h-full p-8" data-test-id="testid-system-monitor">
+        <div className="h-full p-8" data-testid="testid-system-monitor">
           <div className="grid grid-cols-2 gap-8 lg:grid-cols-3">
             <div className="rounded-xl border border-border p-4">
               <div className="flex items-center justify-between">