Real-Dev-Squad · prakashchoudhary07 · Nov 30, 2023 · Nov 20, 2023 · Nov 20, 2023 · Nov 20, 2023
diff --git a/__tests__/taskRequests/taskRequest.test.js b/__tests__/taskRequests/taskRequest.test.js
@@ -12,7 +12,7 @@ describe('Task Requests', () => {
 
   jest.setTimeout(60000);
 
-  beforeAll(async () => {
+  beforeEach(async () => {
     browser = await puppeteer.launch({
       headless: 'new',
       ignoreHTTPSErrors: true,
@@ -27,7 +27,9 @@ describe('Task Requests', () => {
     page.on('request', (request) => {
       if (
         request.url() === `${API_BASE_URL}/taskRequests` ||
-        request.url() === `${API_BASE_URL}/taskRequests?dev=true`
+        request.url() === `${API_BASE_URL}/taskRequests?dev=true` ||
+        request.url() ===
+          `${API_BASE_URL}/taskRequests?size=20&q=status%3Apending+sort%3Acreated-asc&dev=true`
       ) {
         request.respond({
           status: 200,
@@ -39,16 +41,31 @@ describe('Task Requests', () => {
             'Access-Control-Allow-Headers': 'Content-Type, Authorization',
           },
         });
+      } else if (
+        request.url() ===
+        `${API_BASE_URL}/taskRequests?size=20&q=status%3Aapproved++sort%3Acreated-asc&dev=true`
+      ) {
+        const list = [];
+        for (let i = 0; i < 20; i++) {
+          list.push(fetchedTaskRequests[0]);
+        }
+        request.respond({
+          status: 200,
+          contentType: 'application/json',
+          body: JSON.stringify({
+            data: list,
+            next: '/taskRequests?size=20&q=status%3Aapproved++sort%3Acreated-asc&dev=true',
+          }),
+        });
       } else {
         request.continue();
       }
     });
-
     await page.goto(`${SITE_URL}/taskRequests`);
     await page.waitForNetworkIdle();
   });
 
-  afterAll(async () => {
+  afterEach(async () => {
     await browser.close();
   });
 
@@ -68,11 +85,6 @@ describe('Task Requests', () => {
       expect(purpose).toMatch(/test purpose/i);
     });
     describe('Filter Modal', () => {
-      beforeAll(async () => {
-        await page.goto(`${SITE_URL}/taskRequests/?dev=true`);
-        await page.waitForNetworkIdle();
-      });
-
       it('should be hidden initially', async () => {
         const modal = await page.$('.filter-modal');
         expect(
@@ -84,28 +96,59 @@ describe('Task Requests', () => {
         const modal = await page.$('.filter-modal');
         const filterHead = await page.$('.filter-head');
         const filterContainer = await page.$('.filters-container');
-
         expect(filterHead).toBeTruthy();
         expect(filterContainer).toBeTruthy();
-
         await page.click('#filter-button');
         expect(modal).not.toBeNull();
         expect(
           await modal.evaluate((el) => el.classList.contains('hidden')),
         ).toBe(false);
-
         await page.mouse.click(20, 20);
         expect(
           await modal.evaluate((el) => el.classList.contains('hidden')),
         ).toBe(true);
       });
+
+      it('checks if PENDING is checked by default', async () => {
+        const filterButton = await page.$('#filter-button');
+        await filterButton.click();
+        await page.waitForSelector('.filter-modal');
+        const activeFilter = await page.$('input[value="PENDING"]');
+        const currentState = await activeFilter.getProperty('checked');
+        const isChecked = await currentState.jsonValue();
+        expect(isChecked).toBe(true);
+      });
+
+      it('Selecting filters and clicking on apply should filter task request list', async () => {
+        await page.click('#filter-button');
+        await page.click('input[value="PENDING"]');
+        await page.click('input[value="APPROVED"]');
+        await page.click('#apply-filter-button');
+        await page.waitForNetworkIdle();
+        const cardsList = await page.$$('.taskRequest__card');
+        expect(cardsList).not.toBeNull();
+        expect(cardsList.length).toBeGreaterThanOrEqual(0);
+      });
+
+      it('clears the filter when the Clear button is clicked', async () => {
+        const filterButton = await page.$('#filter-button');
+        await filterButton.click();
+        await page.waitForSelector('.filter-modal');
+        const activeFilter = await page.$('input[value="APPROVED"]');
+        await activeFilter.click();
+        const clearButton = await page.$('.filter-modal #clear-button');
+        await clearButton.click();
+        await page.waitForSelector('.filter-modal', { hidden: true });
+        const currentState = await activeFilter.getProperty('checked');
+        const isChecked = await currentState.jsonValue();
+        expect(isChecked).toBe(false);
+      });
     });
 
     describe('Sort Modal', () => {
       it('should be hidden initially', async () => {
         const sortModal = await page.$('.sort-modal');
-        const assigneButton = await page.$('#ASSIGNEE_COUNT');
-
+        const assigneButton = await page.$('#REQUESTORS_COUNT_ASC');
         expect(
           await sortModal.evaluate((el) => el.classList.contains('hidden')),
         ).toBe(true);
@@ -114,15 +157,15 @@ describe('Task Requests', () => {
 
       it('should toggle visibility sort modal by clicking the sort button and selecting an option', async () => {
         const sortModal = await page.$('.sort-modal');
-        const assigneButton = await page.$('#ASSIGNEE_COUNT');
+        const assigneButton = await page.$('#REQUESTORS_COUNT_ASC');
         const sortHead = await page.$('.sort-head');
         const sortContainer = await page.$('.sorts-container');
 
         expect(sortHead).toBeTruthy();
         expect(sortContainer).toBeTruthy();
 
         await page.click('.sort-button');
-        await page.click('#ASSIGNEE_COUNT');
+        await page.click('#REQUESTORS_COUNT_ASC');
         expect(
           await assigneButton.evaluate((el) =>
             el.classList.contains('selected'),
@@ -131,9 +174,8 @@ describe('Task Requests', () => {
         expect(
           await sortModal.evaluate((el) => el.classList.contains('hidden')),
         ).toBe(true);
-
         await page.click('.sort-button');
-        await page.click('#ASSIGNEE_COUNT');
+        await page.click('#REQUESTORS_COUNT_ASC');
         expect(
           await assigneButton.evaluate((el) =>
             el.classList.contains('selected'),
@@ -144,6 +186,25 @@ describe('Task Requests', () => {
         ).toBe(true);
       });
     });
+
+    it('Checks that new items are loaded when scrolled to the bottom', async () => {
+      await page.click('#filter-button');
+      await page.click('input[value="PENDING"]');
+      await page.click('input[value="APPROVED"]');
+      await page.click('#apply-filter-button');
+      await page.waitForNetworkIdle();
+      let taskRequestList = await page.$$('.taskRequest__card');
+      expect(taskRequestList.length).toBe(20);
+      await page.evaluate(() => {
+        const element = document.querySelector('.virtual');
+        if (element) {
+          element.scrollIntoView({ behavior: 'auto' });
+        }
+      });
+      await page.waitForNetworkIdle();
+      taskRequestList = await page.$$('.taskRequest__card');
+      expect(taskRequestList.length).toBe(40);
+    });
   });
 });
 

diff --git a/__tests__/taskRequests/taskRequestDetails.test.js b/__tests__/taskRequests/taskRequestDetails.test.js
@@ -4,7 +4,7 @@ const {
   defaultMockResponseHeaders,
 } = require('../../mock-data/taskRequests');
 
-describe('Tests the User Management User Listing Screen', () => {
+describe('Task request details page', () => {
   let browser;
   let page;
   jest.setTimeout(60000);
@@ -32,18 +32,18 @@ describe('Tests the User Management User Listing Screen', () => {
     await page.goto(
       'http://localhost:8000/taskRequests/details/?id=dM5wwD9QsiTzi7eG7Oq5',
     );
-    await page.waitForNetworkIdle();
-    await page.click('.requestors__container__list__userDetails');
-    await page.waitForSelector('#requestor_details_modal_content', {
-      visible: true,
-    });
   });
 
   afterAll(async () => {
     await browser.close();
   });
 
   it('Checks the Modal working as expected', async () => {
+    await page.waitForNetworkIdle();
+    await page.click('.info__more');
+    await page.waitForSelector('#requestor_details_modal_content', {
+      visible: true,
+    });
     const modalHeading = await page.$eval(
       '[data-modal-header="requestor-details-header"]',
       (element) => element.textContent,
@@ -88,4 +88,11 @@ describe('Tests the User Management User Listing Screen', () => {
       'code change 3 days , testing - 2 days. total - 5 days',
     );
   });
+
+  it('Should contain Approve and Reject buttons', async function () {
+    const approveButton = await page.$('.requestors__conatainer__list__button');
+    const rejectButton = await page.$('.request-details__reject__button');
+    expect(approveButton).toBeTruthy();
+    expect(rejectButton).toBeTruthy();
+  });
 });
diff --git a/mock-data/taskRequests/index.js b/mock-data/taskRequests/index.js
@@ -14,27 +14,14 @@ const fetchedTaskRequests = [
       priority: 'HIGH',
       status: 'ASSIGNED',
     },
-    requestors: [
+    users: [
       {
-        userExists: true,
-        user: {
-          id: 'V4rqL1aDecNGoa1IxiCu',
-          incompleteUserDetails: false,
-          discordId: '12345',
-          roles: {
-            archived: false,
-          },
-          linkedin_id: 'uiram',
-          last_name: 'Raghunathan',
-          yoe: '5',
-          github_display_name: 'Sriram',
-          company_name: 'Juniper networks ',
-          github_id: '19sriram',
-          designation: 'Front end engineer',
-          twitter_id: '19sriram',
-          first_name: 'Sriram',
-          username: '19sriram',
-        },
+        proposedStartDate: 1700304616479,
+        proposedDeadline: 1700909416479,
+        userId: 'eChYAP0kUwLo4wQ1gqMV',
+        status: 'PENDING',
+        username: 'ajeyak',
+        first_name: 'Test first_name',
       },
     ],
   },
@@ -47,23 +34,21 @@ const individualTaskReqDetail = {
     lastModifiedAt: 1698837978463,
     requestType: 'ASSIGNMENT',
     createdBy: 'randhir',
-    requestors: ['SooJK37gzjIZfFNH0tlL'],
     lastModifiedBy: 'randhir',
     taskTitle: 'sample golang task s402',
     externalIssueUrl:
       'https://api.github.com/repos/Real-Dev-Squad/website-backend/issues/1310',
     taskId: '44SwDPe1r6AgoOtWq8EN',
-    approvedTo: 'SooJK37gzjIZfFNH0tlL',
     users: [
       {
         proposedStartDate: 1698684354000,
         proposedDeadline: 1699142400000,
         description: 'code change 3 days , testing - 2 days. total - 5 days',
         userId: 'SooJK37gzjIZfFNH0tlL',
-        status: 'APPROVED',
+        status: 'PENDING',
       },
     ],
-    status: 'APPROVED',
+    status: 'PENDING',
     id: 'dM5wwD9QsiTzi7eG7Oq5',
     url: 'http://localhost:3000/taskRequests/dM5wwD9QsiTzi7eG7Oq5',
   },
@@ -142,6 +127,14 @@ const urlMappings = {
     userInformation,
   'https://staging-api.realdevsquad.com/users/userId/SooJK37gzjIZfFNH0tlL':
     userInformation,
+  'https://staging-api.realdevsquad.com/taskRequests?action=approve':
+    fetchedTaskRequests,
+  'https://api.realdevsquad.com/taskRequests?action=approve':
+    fetchedTaskRequests,
+  'https://staging-api.realdevsquad.com/taskRequests?action=reject':
+    fetchedTaskRequests,
+  'https://api.realdevsquad.com/taskRequests?action=reject':
+    fetchedTaskRequests,
 };
 
 module.exports = {

diff --git a/taskRequests/constants.js b/taskRequests/constants.js
@@ -3,26 +3,44 @@ const taskRequestStatus = {
   APPROVED: 'APPROVED',
 };
 const DEV_FEATURE_FLAG = 'dev';
+const DEFAULT_PAGE_SIZE = 20;
+const Status = {
+  APPROVED: 'approved',
+  PENDING: 'pending',
+  DENIED: 'denied',
+};
+
+const Order = {
+  REQUESTORS_COUNT_ASC: { requestors: 'asc' },
+  REQUESTORS_COUNT_DESC: { requestors: 'desc' },
+  CREATED_TIME_DESC: { created: 'desc' },
+  CREATED_TIME_ASC: { created: 'asc' },
+};
 
 const FILTER_MODAL = 'filter-modal';
 const FILTER_BUTTON = 'filter-button';
 const APPLY_FILTER_BUTTON = 'apply-filter-button';
 const SEARCH_ELEMENT = 'assignee-search';
 const SORT_BUTTON = '.sort-button';
-const OLD_FILTER = '.container__filters';
+const CLEAR_BUTTON = 'clear-button';
 const FILTER_CONTAINER = '.sort-filters';
 const SORT_MODAL = 'sort-modal';
-const ASSIGNEE_COUNT = 'ASSIGNEE_COUNT';
-const ASSIGNEE_DESC = 'ASSIGNEE_COUNT-desc';
-const CREATED_TIME = 'CREATED_TIME';
-const CREATED_TIME_DESC = 'CREATED_TIME-desc';
+const ASSIGNEE_COUNT = 'REQUESTORS_COUNT_ASC';
+const ASSIGNEE_DESC = 'REQUESTORS_COUNT_DESC';
+const CREATED_TIME = 'CREATED_TIME_ASC';
+const CREATED_TIME_DESC = 'CREATED_TIME_DESC';
 const BACKDROP = '.backdrop';
+const LAST_ELEMENT_CONTAINER = '.virtual';
 
 const MessageStatus = {
   SUCCESS: 'SUCCESS',
   ERROR: 'ERROR',
 };
 
+const TaskRequestAction = {
+  APPROVE: 'approve',
+  REJECT: 'reject',
+};
 const ErrorMessages = {
   UNAUTHENTICATED:
     'You are unauthenticated to view this section, please login!',