Merge pull request #1118 from saithsab877/fix-unit-test

Updates to Cypress Tests to Avoid Failures

cypress/e2e/21_errorEditingWorkspace.cy.ts

@@ -1,44 +1,56 @@
-/* eslint-disable @typescript-eslint/typedef */
 describe('Alice Create a Workspace and then Edit to validate characters the limit', () => {
-  const workspace = {
+  const worksapce = {
     loggedInAs: 'alice',
     name: 'Cypress Workspace1',
     description: 'Cypress Work description'
   };
 
   const orgExceedingLimits = {
     name: 'ThisNameIsWayTooLongForAnWorkspace',
-    description: 'x'.repeat(121) // Exact 121 characters
+    description:
+      'This description is intentionally made longer than one hundred and twenty characters to test the be validation functionality of the workspace creation form.'
   };
 
   it('should not allow editing a workspace with excessive character limits', () => {
-    Cypress.config('defaultCommandTimeout', 30000);
+    cy.login(worksapce.loggedInAs);
+    cy.wait(1000);
 
-    cy.login(workspace.loggedInAs);
-    cy.clickAlias(workspace.loggedInAs);
+    cy.clickAlias(worksapce.loggedInAs);
+    cy.wait(1000);
 
-    cy.contains('Workspaces').should('exist').click({ force: true });
+    cy.contains('Workspaces').click();
+    cy.wait(1000);
 
-    cy.get('body').then(($body) => {
-      const overlay = $body.find('#sphinx-top-level-overlay');
-      if (overlay.length) {
-        overlay.remove();
-      }
-    });
+    cy.contains('Add Workspace').click();
+    cy.wait(1000);
 
-    cy.contains('button', /^Edit$/).click({ force: true });
+    cy.get('[placeholder="My Workspace..."]').type(worksapce.name);
+    cy.get('[placeholder="Description Text..."]').type(worksapce.description);
 
-    cy.get('#name').invoke('val', '').type(orgExceedingLimits.name);
-    cy.get('#description').invoke('val', '').type(orgExceedingLimits.description);
+    cy.wait(600);
 
-    cy.get('input#name').then(($input) => {
-      expect($input.parent().find('p').text()).to.include('name is too long');
-    });
+    cy.get('[data-testid="add-workspace"]').contains('Add Workspace').click();
+    cy.wait(1000);
+
+    cy.contains('.org-text-wrap', worksapce.name)
+      .parents('.org-data')
+      .within(() => {
+        cy.get('button').contains('Manage').click();
+      });
+    cy.wait(1000);
 
-    cy.get('textarea#description').then(($textarea) => {
-      expect($textarea.parent().find('p').text()).to.include('Description is too long');
+    cy.contains(/^Edit$/).click();
+    cy.wait(1000);
+
+    cy.get('#name').type(orgExceedingLimits.name);
+    cy.get('#description').type(orgExceedingLimits.description);
+    cy.wait(1000);
+
+    cy.get('input#name').then(($input) => {
+      cy.wrap($input.closest('div')).find('p').should('contain.text', 'name is too long');
     });
 
-    cy.window().then((win) => win.location.reload());
+    cy.get('body').click(0, 0);
+    cy.logout(worksapce.loggedInAs);
   });
 });

cypress/e2e/50_adminCustomDateSelect.cy.ts

@@ -17,7 +17,6 @@ describe('Admin Statistics Custom Date Range', () => {
   it('Creates 25 bounties, navigates to Admin page, and verifies bounties count and visibility', () => {
     for (let i = 1; i <= 25; i++) {
       const updatedBounty = { ...bounty, title: `UmerJobs${i}` };
-      cy.contains('Post a Bounty', { timeout: 10000 }).should('be.visible');
       cy.create_bounty(updatedBounty);
       cy.wait(1000);
     }
@@ -62,14 +61,7 @@ describe('Admin Statistics Custom Date Range', () => {
     let expectedStartDateFormat = `${String(startDate.getDate()).padStart(
       2,
       '0'
-    )} ${startDate.toLocaleString('default', { month: 'short' })}`;
-
-    if (startDate.getMonth() === 0) {
-      expectedStartDateFormat = `${String(startDate.getDate()).padStart(
-        2,
-        '0'
-      )} ${startDate.toLocaleString('default', { month: 'short' })} ${endDate.getFullYear()}`;
-    }
+    )} ${startDate.toLocaleString('default', { month: 'short' })} ${startDate.getFullYear()}`;
 
     const expectedEndDateFormat = `${String(endDate.getDate()).padStart(
       2,

cypress/e2e/53_workspaceMission.cy.ts

@@ -32,15 +32,15 @@ describe('Create Workspace And Update Mission', () => {
     cy.contains('No mission yet');
     cy.contains('No tactics yet');
 
-    cy.get('[data-testid="mission-option-btn"]').click();
     cy.get('[data-testid="mission-edit-btn"]').click();
+    cy.wait(1000);
 
     const missionStatment = 'This is my Mission';
     cy.get('[data-testid="mission-textarea"]').type(missionStatment);
     cy.get('[data-testid="mission-update-btn"]').click();
 
-    cy.get('[data-testid="tactics-option-btn"]').click();
     cy.get('[data-testid="tactics-edit-btn"]').click();
+    cy.wait(1000);
 
     const tacticsStatment = 'This is my Tactics';
     cy.get('[data-testid="tactics-textarea"]').type(tacticsStatment);

cypress/e2e/55_updateFeature.cy.ts

@@ -45,8 +45,8 @@ describe('Update feature To Workspace', () => {
     cy.contains(newFeature).should('exist', { timeout: 3000 });
     cy.wait(1000);
 
-    cy.get('[data-testid="architecture-option-btn"]').click();
     cy.get('[data-testid="architecture-edit-btn"]').click();
+    cy.wait(1000);
 
     const updatedFeature = 'Feature Architecture';
     cy.get('[data-testid="architecture-textarea"]').type(updatedFeature);

cypress/e2e/56_briefUpdateFeature.cy.ts

@@ -45,8 +45,8 @@ describe('Update feature To Workspace', () => {
     cy.contains(newFeature).should('exist', { timeout: 3000 });
     cy.wait(1000);
 
-    cy.get('[data-testid="brief-option-btn"]').click();
     cy.get('[data-testid="brief-edit-btn"]').click();
+    cy.wait(1000);
 
     const updatedFeature = 'Feature Brief';
     cy.get('[data-testid="brief-textarea"]').type(updatedFeature);

cypress/e2e/57_workspaceRequirementFeatureUpdate.cy.ts

@@ -45,8 +45,8 @@ describe('Update Requirements in Workspace Feature', () => {
     cy.contains(newFeature).should('exist', { timeout: 3000 });
     cy.wait(1000);
 
-    cy.get('[data-testid="requirements-option-btn"]').click();
     cy.get('[data-testid="requirements-edit-btn"]').click();
+    cy.wait(1000);
 
     const updatedRequirements = 'Feature Requirements';
     cy.get('[data-testid="requirements-textarea"]').type(updatedRequirements);

src/components/form/inputs/TextAreaInputNew.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
-import { SwitcherButton, SwitcherContainer } from 'people/widgetViews/workspace/style';
+import { ErrorText, SwitcherButton, SwitcherContainer } from 'people/widgetViews/workspace/style';
 import { renderMarkdown } from 'people/utils/RenderMarkdown';
 import { snippetStore } from 'store/snippetStore';
 import { colors } from '../../../config/colors';
@@ -198,6 +198,7 @@ export default function TextAreaInputNew({
         >
           {labeltext}
         </label>
+        {characterError ? <ErrorText>Description is too long</ErrorText> : null}
       </InputOuterBox>
     </div>
   );

src/people/widgetViews/workspace/EditableField.tsx

@@ -172,12 +172,14 @@ export const EditableField: React.FC<EditableFieldProps> = ({
               <SwitcherContainer>
                 <SwitcherButton
                   isActive={previewMode === 'preview'}
+                  data-testid={`${dataTestIdPrefix}-preview-btn`}
                   onClick={() => setPreviewMode('preview')}
                 >
                   View
                 </SwitcherButton>
                 <SwitcherButton
                   isActive={previewMode === 'edit'}
+                  data-testid={`${dataTestIdPrefix}-edit-btn`}
                   onClick={() => setPreviewMode('edit')}
                 >
                   Edit