Fix/remove outdated fields

__tests__/tasks/task-dependency.test.js

@@ -16,79 +16,161 @@ describe('Input box', () => {
       args: ['--incognito', '--disable-web-security'],
       devtools: false,
     });
-    page = await browser.newPage();
 
-    await page.setRequestInterception(true);
-
-    page.on('request', (interceptedRequest) => {
-      const url = interceptedRequest.url();
-      if (url === `${STAGING_API_URL}/levels`) {
-        interceptedRequest.respond({
-          status: 200,
-          contentType: 'application/json',
-          headers: {
-            'Access-Control-Allow-Origin': '*',
-            'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
-            'Access-Control-Allow-Headers': 'Content-Type, Authorization',
-          },
-          body: JSON.stringify(levels),
-        });
-      } else if (url === `${STAGING_API_URL}/users`) {
-        interceptedRequest.respond({
-          status: 200,
-          contentType: 'application/json',
-          headers: {
-            'Access-Control-Allow-Origin': '*',
-            'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
-            'Access-Control-Allow-Headers': 'Content-Type, Authorization',
-          },
-          body: JSON.stringify(users),
-        });
-      } else if (url === `${STAGING_API_URL}/tags`) {
-        interceptedRequest.respond({
-          status: 200,
-          contentType: 'application/json',
-          headers: {
-            'Access-Control-Allow-Origin': '*',
-            'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
-            'Access-Control-Allow-Headers': 'Content-Type, Authorization',
-          },
-          body: JSON.stringify(tags),
-        });
-      } else {
-        interceptedRequest.continue();
-      }
-    });
+    // Mock API response setup
+    const interceptAPI = async (page) => {
+      await page.setRequestInterception(true);
+      page.on('request', (interceptedRequest) => {
+        const url = interceptedRequest.url();
+
+        const mockResponses = {
+          [`${STAGING_API_URL}/levels`]: levels,
+          [`${STAGING_API_URL}/users`]: users,
+          [`${STAGING_API_URL}/tags`]: tags,
+        };
+
+        if (mockResponses[url]) {
+          interceptedRequest.respond({
+            status: 200,
+            contentType: 'application/json',
+            headers: {
+              'Access-Control-Allow-Origin': '*',
+            },
+            body: JSON.stringify(mockResponses[url]),
+          });
+        } else {
+          interceptedRequest.continue();
+        }
+      });
+    };
+
+    // Open a shared page instance and intercept API for all tests
+    page = await browser.newPage();
+    await interceptAPI(page);
     await page.goto('http://localhost:8000/task');
     await page.waitForNetworkIdle();
   });
 
   afterAll(async () => {
     await browser.close();
   });
-  it('DependsOn input box should exist', async () => {
-    const inputBox = await page.evaluate(() =>
-      document.querySelector('.inputBox'),
-    );
-    const linksDisplay = await page.evaluate(() =>
-      document.querySelector('#linksDisplay'),
-    );
+
+  // Form Presence Tests
+  describe('Form Field Presence', () => {
+    it('should display the title field', async () => {
+      const titleField = await page.$('[data-testid="title"]');
+      expect(titleField).toBeTruthy();
+    });
+
+    it('should display the status field', async () => {
+      const statusField = await page.$('[data-testid="status"]');
+      expect(statusField).toBeTruthy();
+    });
+
+    it('should display the priority field', async () => {
+      const priorityField = await page.$('[data-testid="priority"]');
+      expect(priorityField).toBeTruthy();
+    });
+
+    it('should display the isNoteworthy checkbox', async () => {
+      const noteworthyField = await page.$('[data-testid="isNoteworthy"]');
+      expect(noteworthyField).toBeTruthy();
+    });
+
+    it('should display the purpose field', async () => {
+      const purposeField = await page.$('[data-testid="purpose"]');
+      expect(purposeField).toBeTruthy();
+    });
+
+    it('should display the dependsOn field', async () => {
+      const dependsOnField = await page.$('[data-testid="dependsOn"]');
+      expect(dependsOnField).toBeTruthy();
+    });
   });
 
-  it('DependsOn input should have correct attributes', async () => {
-    const input = await page.$('#dependsOn');
-    const type = await input.evaluate((el) => el.getAttribute('type'));
-    const name = await input.evaluate((el) => el.getAttribute('name'));
-    const id = await input.evaluate((el) => el.getAttribute('id'));
-    const placeholder = await input.evaluate((el) =>
-      el.getAttribute('placeholder'),
-    );
-    const classList = await input.evaluate((el) => Array.from(el.classList));
-
-    expect(type).toBe('text');
-    expect(name).toBe('dependsOn');
-    expect(id).toBe('dependsOn');
-    expect(placeholder).toBe('Task ID separated with comma ');
-    expect(classList.includes('notEditing')).toBeTruthy();
+  // Status Field Behavior Tests
+  describe('Status Field Behavior', () => {
+    beforeEach(async () => {
+      await page.goto('http://localhost:8000/task');
+      await page.waitForNetworkIdle();
+    });
+
+    it('should have default status as "available"', async () => {
+      const defaultStatus = await page.$eval(
+        '[data-testid="status"] select',
+        (el) => el.value,
+      );
+      expect(defaultStatus).toBe('AVAILABLE');
+    });
+
+    it('should show/hide fields based on "status" selection', async () => {
+      // Change status to "assigned"
+      await page.select('[data-testid="status"] select', 'ASSIGNED');
+
+      const assigneeVisible = await page.$eval(
+        '[data-testid="assignee"]',
+        (el) => window.getComputedStyle(el).display !== 'none',
+      );
+      const endsOnVisible = await page.$eval(
+        '[data-testid="endsOn"]',
+        (el) => window.getComputedStyle(el).display !== 'none',
+      );
+      expect(assigneeVisible).toBeTruthy();
+      expect(endsOnVisible).toBeTruthy();
+
+      // Change status back to "available"
+      await page.select('[data-testid="status"] select', 'available');
+
+      const assigneeHidden = await page.$eval(
+        '[data-testid="assignee"]',
+        (el) => window.getComputedStyle(el).display === 'none',
+      );
+      const endsOnHidden = await page.$eval(
+        '[data-testid="endsOn"]',
+        (el) => window.getComputedStyle(el).display === 'none',
+      );
+      expect(assigneeHidden).toBeTruthy();
+      expect(endsOnHidden).toBeTruthy();
+    });
+  });
+
+  // Dev Mode Tests
+  describe('Dev Mode Behavior', () => {
+    beforeAll(async () => {
+      await page.goto('http://localhost:8000/task?dev=true');
+      await page.waitForNetworkIdle();
+    });
+
+    it('should hide feature URL field in dev mode', async () => {
+      const featureUrlField = await page.$('[data-testid="featureUrl"]');
+      const display = await page.$eval(
+        '[data-testid="featureUrl"]',
+        (el) => window.getComputedStyle(el).display,
+      );
+      expect(display).toBe('none');
+    });
+
+    it('should hide task level field in dev mode', async () => {
+      const taskLevelField = await page.$('[data-testid="taskLevel"]');
+      const display = await page.$eval(
+        '[data-testid="taskLevel"]',
+        (el) => window.getComputedStyle(el).display,
+      );
+      expect(display).toBe('none');
+    });
+
+    it('should hide feature/group radio buttons in dev mode', async () => {
+      const radioButtons = await page.$('[data-testid="radioButtons"]');
+      const display = await page.$eval(
+        '[data-testid="radioButtons"]',
+        (el) => window.getComputedStyle(el).display,
+      );
+      expect(display).toBe('none');
+    });
+
+    it('should display the dependsOn field in dev mode', async () => {
+      const dependsOnField = await page.$('[data-testid="dependsOn"]');
+      expect(dependsOnField).toBeTruthy();
+    });
   });
 });

task/constants.js

@@ -0,0 +1,4 @@
+const StatusType = {
+  AVAILABLE: 'AVAILABLE',
+  ASSIGNED: 'ASSIGNED',
+};