Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dev to Main Sync #923

Merged
merged 4 commits into from
Dec 19, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
161 changes: 160 additions & 1 deletion __tests__/extension-requests/extension-requests.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -281,7 +281,7 @@ describe('Tests the Extension Requests Screen', () => {
},
body: JSON.stringify(extensionRequestListForAuditLogs),
});
} else if (url === `${STAGING_API_URL}/users/self`) {
} else if (url === `${STAGING_API_URL}/users?profile=true`) {
interceptedRequest.respond({
status: 200,
contentType: 'application/json',
Expand Down Expand Up @@ -654,6 +654,165 @@ describe('Tests the Extension Requests Screen', () => {
expect(hasSkeletonClassAfter).toBe(false);
});

it('shows error messages for empty title and reason inputs on update under dev feature flag', async () => {
await page.goto(`${LOCAL_TEST_PAGE_URL}/extension-requests/?dev=true`);
const editButtonSelector = '[data-testid="edit-button"]';
const editButton = await page.$(editButtonSelector);
if (!editButton) {
return;
}
await page.click(editButtonSelector);
const updateButtonSelector = '[data-testid="update-button"]';
const titleInputSelector = '[data-testid="title-text-input"]';
const reasonInputSelector = '[data-testid="reason-input-text-area"]';
const titleErrorSelector = '[data-testid="title-input-error"]';
const reasonErrorSelector = '[data-testid="reason-input-error"]';

await page.evaluate((selector) => {
const element = document.querySelector(selector);
if (element) element.value = '';
}, titleInputSelector);

await page.evaluate((selector) => {
const element = document.querySelector(selector);
if (element) element.value = '';
}, reasonInputSelector);

await page.click(updateButtonSelector);

const isTitleErrorVisible = await page
.$eval(titleErrorSelector, (el) => el && !el.classList.contains('hidden'))
.catch(() => false);

const isReasonErrorVisible = await page
.$eval(
reasonErrorSelector,
(el) => el && !el.classList.contains('hidden'),
)
.catch(() => false);
expect(isTitleErrorVisible).toBe(true);
expect(isReasonErrorVisible).toBe(true);
});

it('shows error message if deadline is set to past date under dev feature flag', async () => {
await page.goto(`${LOCAL_TEST_PAGE_URL}/extension-requests/?dev=true`);
const editButtonSelector = '[data-testid="edit-button"]';
const editButton = await page.$(editButtonSelector);
if (!editButton) {
return;
}

await page.click(editButtonSelector);

const extensionInputSelector = '[data-testid="extension-input"]';
const extensionErrorSelector = '[data-testid="extension-input-error"]';
await page.$eval(extensionInputSelector, (input) => {
input.value = '2020-01-01';
});
await page.click('[data-testid="update-button"]');
const isExtensionErrorVisible = await page.$eval(
extensionErrorSelector,
(el) =>
!el.classList.contains('hidden') &&
el.innerText.includes("Past date can't be the new deadline"),
);
expect(isExtensionErrorVisible).toBe(true);
});

it('hides edit button and displays update wrapper on successful update under dev feature flag', async () => {
await page.goto(`${LOCAL_TEST_PAGE_URL}/extension-requests/?dev=true`);
const editButtonSelector = '[data-testid="edit-button"]';
const editButton = await page.$(editButtonSelector);
if (!editButton) {
return;
}

await page.click(editButtonSelector);

const updateButtonSelector = '[data-testid="update-button"]';
const updateWrapperSelector = '[data-testid="update-wrapper"]';

await page.type('[data-testid="title-text-input"]', 'Valid Title');
await page.type('[data-testid="reason-input-text-area"]', 'Valid Reason');
await page.type('[data-testid="extension-input"]', '2050-01-01');

await page.click(updateButtonSelector);

const isEditButtonHidden = await page.$eval(editButtonSelector, (el) =>
el.classList.contains('hidden'),
);
const isUpdateWrapperVisible = await page.$eval(
updateWrapperSelector,
(el) => !el.classList.contains('hidden'),
);
expect(isEditButtonHidden).toBe(true);
expect(isUpdateWrapperVisible).toBe(true);
});

it('handles long title and long reason properly under dev feature flag', async () => {
await page.goto(`${LOCAL_TEST_PAGE_URL}/extension-requests/?dev=true`);

const editButtonSelector = '[data-testid="edit-button"]';
const titleInputSelector = '[data-testid="title-text-input"]';
const reasonInputSelector = '[data-testid="reason-input-text-area"]';
const titleDisplaySelector = '.title-text';
const reasonDisplaySelector = '.reason-text';

const longTitle = 'A'.repeat(300);
const longReason = 'This is a very long reason '.repeat(50);

const editButton = await page.$(editButtonSelector);
if (!editButton) {
return;
}
await page.click(editButtonSelector);

await page.type(titleInputSelector, longTitle);
await page.type(reasonInputSelector, longReason);

const isTitleTruncated = await page.$eval(
titleDisplaySelector,
(el) => window.getComputedStyle(el).textOverflow === 'ellipsis',
);

const isReasonWrapped = await page.$eval(
reasonDisplaySelector,
(el) => window.getComputedStyle(el).whiteSpace === 'normal',
);

expect(isTitleTruncated).toBe(true);
expect(isReasonWrapped).toBe(true);
});

it('displays an error message for invalid date format under dev feature flag', async () => {
await page.goto(`${LOCAL_TEST_PAGE_URL}/extension-requests/?dev=true`);

const editButtonSelector = '[data-testid="edit-button"]';
const editButton = await page.$(editButtonSelector);
if (!editButton) {
return;
}

await page.click(editButtonSelector);

const extensionInputSelector = '[data-testid="extension-input"]';
const extensionErrorSelector = '[data-testid="extension-input-error"]';

await page.$eval(extensionInputSelector, (input) => {
input.value = 'invalid-date';
});
await page.click('[data-testid="update-button"]');

const isExtensionErrorVisible = await page.$eval(
extensionErrorSelector,
(el) =>
!el.classList.contains('hidden') &&
el.innerText.includes('Invalid date format.'),
);

expect(isExtensionErrorVisible).toBe(true);
});

it('Checks whether the card is not removed from display when api call is unsuccessful', async () => {
const extensionCards = await page.$$('.extension-card');

Expand Down
36 changes: 24 additions & 12 deletions __tests__/groups/group.test.js
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();
});
});
Loading
Loading