Skip to content

Commit

Permalink
Merge branch 'feature/edit-er-before-approval-or-rejection' of https:…
Browse files Browse the repository at this point in the history 
…//github.com/tanu-chahal/website-dashboard into feature/edit-er-before-approval-or-rejection
  • Loading branch information
@tanu-chahal
tanu-chahal committed Dec 8, 2024
2 parents f64ab02 + c696963 commit e952d6d
Show file tree
Hide file tree
Showing 10 changed files with 358 additions and 155 deletions.
36 changes: 24 additions & 12 deletions __tests__/groups/group.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -313,7 +313,7 @@ describe('Discord Groups Page', () => {

test('Should display delete button for super users', async () => {
setSuperUserPermission();
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups?dev=true`);
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups`);
await page.waitForNetworkIdle();
await page.waitForTimeout(1000);

Expand All @@ -325,15 +325,6 @@ describe('Discord Groups Page', () => {

test('Should not display delete button when user is normal user', async () => {
resetUserPermission();
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups?dev=true`);
await page.waitForNetworkIdle();

const deleteButtons = await page.$$('.delete-group');
expect(deleteButtons.length).toBe(0);
});

test('Should not display delete button when dev=false', async () => {
setSuperUserPermission();
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups`);
await page.waitForNetworkIdle();

Expand All @@ -343,7 +334,7 @@ describe('Discord Groups Page', () => {

test('Should display delete confirmation modal on click of delete button', async () => {
setSuperUserPermission();
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups?dev=true`);
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups`);
await page.waitForNetworkIdle();
await page.waitForTimeout(1000);

Expand All @@ -359,7 +350,7 @@ describe('Discord Groups Page', () => {

test('Should close delete confirmation modal when cancel button is clicked', async () => {
setSuperUserPermission();
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups?dev=true`);
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups`);
await page.waitForNetworkIdle();
await page.waitForTimeout(1000);

Expand All @@ -372,4 +363,25 @@ describe('Discord Groups Page', () => {
const modalClosed = await page.$('.delete-confirmation-modal');
expect(modalClosed).toBeFalsy();
});

test('Should render loader when deleting a group', async () => {
setSuperUserPermission();
await page.goto(`${LOCAL_TEST_PAGE_URL}/groups`);
await page.waitForNetworkIdle();
await page.waitForTimeout(1000);

const deleteButton = await page.$('.delete-group');
await deleteButton.click();

const confirmButton = await page.waitForSelector('#confirm-delete');
confirmButton.click();

const loader = await page.waitForSelector('.loader');
expect(loader).toBeTruthy();

await page.waitForTimeout(1000);

const loaderAfter = await page.$('.loader');
expect(loaderAfter).toBeFalsy();
});
});
210 changes: 146 additions & 64 deletions __tests__/tasks/task-dependency.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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();
});
});
});
2 changes: 1 addition & 1 deletion groups/createElements.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ const createCard = (
.querySelector('.delete-group')
.addEventListener('click', (e) => {
e.stopPropagation();
onDelete(rawGroup.id, rawGroup.roleId);
onDelete(rawGroup.id);
});
}

Expand Down
23 changes: 23 additions & 0 deletions groups/render.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,27 @@ const removeLoadingCards = () => {
loadingCards.forEach((card) => mainContainer.removeChild(card));
};

const renderLoader = () => {
const loaderContainer = document.querySelector('.loader');

if (!loaderContainer) {
const loaderContainer = document.createElement('div');
loaderContainer.className = 'loader';
loaderContainer.innerHTML = `
<div class="loader-spin"></div>
`;

document.body.appendChild(loaderContainer);
}
};

const removeLoader = () => {
const loader = document.querySelector('.loader');
if (loader) {
document.body.removeChild(loader);
}
};

const renderGroupById = ({
group,
cardOnClick = () => {},
Expand Down Expand Up @@ -148,4 +169,6 @@ export {
renderNoGroupFound,
renderDeleteConfirmationModal,
removeDeleteConfirmationModal,
renderLoader,
removeLoader,
};
14 changes: 8 additions & 6 deletions groups/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ import {
renderNotAuthenticatedPage,
renderDeleteConfirmationModal,
removeDeleteConfirmationModal,
renderLoader,
removeLoader,
} from './render.js';

import {
Expand All @@ -32,7 +34,6 @@ const QUERY_PARAM_KEY = {
DEV_FEATURE_FLAG: 'dev',
GROUP_SEARCH: 'name',
};
const isDev = getParamValueFromURL(QUERY_PARAM_KEY.DEV_FEATURE_FLAG) === 'true';

const handler = {
set: (obj, prop, value) => {
Expand Down Expand Up @@ -287,23 +288,23 @@ function renderAllGroups({ cardOnClick }) {
renderGroupById({
group: group,
cardOnClick: () => cardOnClick(id),
onDelete: isDev ? showDeleteModal : undefined,
isSuperUser: dataStore.isSuperUser && isDev,
onDelete: showDeleteModal,
isSuperUser: dataStore.isSuperUser,
});
}
});
}
}

function showDeleteModal(groupId, roleId) {
if (!isDev) return;
function showDeleteModal(groupId) {
renderDeleteConfirmationModal({
onClose: () => {
removeDeleteConfirmationModal();
},
onConfirm: async () => {
renderLoader();
try {
await deleteDiscordGroupRole(groupId, roleId);
await deleteDiscordGroupRole(groupId);
showToaster('Group deleted successfully');

updateGroup(groupId, { isDeleted: true });
Expand All @@ -318,6 +319,7 @@ function showDeleteModal(groupId, roleId) {
showToaster(error.message || 'Failed to delete group');
} finally {
removeDeleteConfirmationModal();
removeLoader();
}
},
});
Expand Down
Loading

0 comments on commit e952d6d

Please sign in to comment.