Skip to content
Open
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
233 changes: 228 additions & 5 deletions __tests__/applications/applications.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ const {
fetchedApplications,
acceptedApplications,
pendingApplications,
changesRequestedApplications,
} = require('../../mock-data/applications');
const { superUserForAudiLogs } = require('../../mock-data/users');
const {
Expand Down Expand Up @@ -73,13 +74,13 @@ describe('Applications page', () => {
body: JSON.stringify(superUserForAudiLogs),
});
} else if (
url === `${STAGING_API_URL}/applications/lavEduxsb2C5Bl4s289P`
url === `${STAGING_API_URL}/applications/lavEduxsb2C5Bl4s289P/feedback`
) {
interceptedRequest.respond({
status: 200,
contentType: 'application/json',
body: JSON.stringify({
message: 'application updated successfully!',
message: 'Application feedback submitted successfully',
}),
headers: {
'Access-Control-Allow-Origin': '*',
Expand Down Expand Up @@ -120,6 +121,23 @@ describe('Applications page', () => {
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
},
});
} else if (
url ===
`${STAGING_API_URL}/applications?size=6&status=changes_requested&dev=true`
) {
interceptedRequest.respond({
status: 200,
contentType: 'application/json',
body: JSON.stringify({
applications: changesRequestedApplications,
totalCount: changesRequestedApplications.length,
}),
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
},
});
} else {
interceptedRequest.continue();
}
Expand Down Expand Up @@ -285,7 +303,7 @@ describe('Applications page', () => {

it.skip('should show toast message with application updated successfully', async function () {
await page.click('.view-details-button');
await page.click('.application-details-accept');
await page.click('[data-testid="application-details-accept"]');
const toast = await page.$('#toast');
expect(await toast.evaluate((el) => el.classList.contains('hidden'))).toBe(
false,
Expand Down Expand Up @@ -334,7 +352,7 @@ describe('Applications page', () => {
await page.waitForSelector('.application-card');
await page.click('.application-card');

await page.click('.application-details-accept');
await page.click('[data-testid="application-details-accept"]');
await page.waitForSelector('[data-testid="toast-component"].show');
const toastComponent = await page.$('[data-testid="toast-component"]');
expect(
Expand All @@ -355,7 +373,7 @@ describe('Applications page', () => {
).toBe(false);
const toastMessage = await page.$('[data-testid="toast-message"]');
expect(await toastMessage.evaluate((el) => el.textContent)).toBe(
'application updated successfully!',
'Application feedback submitted successfully',
);
});

Expand All @@ -371,4 +389,209 @@ describe('Applications page', () => {
const applicationCardElements = await page.$$('.application-card');
expect(applicationCardElements.length).toBe(acceptedApplications.length);
});

it('should show success toast after requesting changes for an application', async function () {
await page.goto(
`${LOCAL_TEST_PAGE_URL}/applications?dev=true&status=pending`,
);
await page.waitForSelector('.application-card');
await page.click('.application-card');

await page.type(
'.application-textarea',
'Please update your introduction.',
);

await page.click('[data-testid="application-details-request-changes"]');
await page.waitForSelector('[data-testid="toast-component"].show');
const toastComponent = await page.$('[data-testid="toast-component"]');
expect(
await toastComponent.evaluate((el) => el.classList.contains('show')),
).toBe(true);
expect(
await toastComponent.evaluate((el) => el.classList.contains('hide')),
).toBe(false);
expect(
await toastComponent.evaluate((el) =>
el.classList.contains('success__toast'),
),
).toBe(true);
expect(
await toastComponent.evaluate((el) =>
el.classList.contains('error__toast'),
),
).toBe(false);
const toastMessage = await page.$('[data-testid="toast-message"]');
expect(await toastMessage.evaluate((el) => el.textContent)).toBe(
'Application feedback submitted successfully',
);
});

it('should show error toast when requesting changes without providing feedback', async function () {
await page.goto(
`${LOCAL_TEST_PAGE_URL}/applications?dev=true&status=pending`,
);
await page.waitForSelector('.application-card');
await page.click('.application-card');

await page.$eval('.application-textarea', (el) => (el.value = ''));
await page.click('[data-testid="application-details-request-changes"]');
await page.waitForSelector('[data-testid="toast-component"].show');
const toastComponent = await page.$('[data-testid="toast-component"]');
expect(
await toastComponent.evaluate((el) => el.classList.contains('show')),
).toBe(true);
expect(
await toastComponent.evaluate((el) =>
el.classList.contains('error__toast'),
),
).toBe(true);
const toastMessage = await page.$('[data-testid="toast-message"]');
expect(await toastMessage.evaluate((el) => el.textContent)).toBe(
'Please provide feedback before requesting changes.',
);
});

it('should hide action buttons after successfully updating application status to changes_requested', async function () {
await page.goto(
`${LOCAL_TEST_PAGE_URL}/applications?dev=true&status=pending`,
);
await page.waitForSelector('.application-card');
await page.click('.application-card');

await page.type(
'.application-textarea',
'Please update your introduction.',
);

await page.click('[data-testid="application-details-request-changes"]');
await page.waitForSelector('[data-testid="toast-component"].show');

const acceptBtn = await page.$(
'[data-testid="application-details-accept"]',
);
const rejectBtn = await page.$(
'[data-testid="application-details-reject"]',
);
const requestChangesBtn = await page.$(
'[data-testid="application-details-request-changes"]',
);

expect(
await acceptBtn.evaluate((el) => el.classList.contains('hidden')),
).toBe(true);
expect(
await rejectBtn.evaluate((el) => el.classList.contains('hidden')),
).toBe(true);
expect(
await requestChangesBtn.evaluate((el) => el.classList.contains('hidden')),
).toBe(true);
});

it('should display "Changes were already requested" message after successfully requesting changes', async function () {
await page.goto(
`${LOCAL_TEST_PAGE_URL}/applications?dev=true&status=pending`,
);
await page.waitForSelector('.application-card');
await page.click('.application-card');

await page.type(
'.application-textarea',
'Please update your introduction.',
);

await page.click('[data-testid="application-details-request-changes"]');
await page.waitForSelector('[data-testid="toast-component"].show');

const statusMsg = await page.$(
'.application-details-changes-requested-msg',
);
expect(statusMsg).toBeTruthy();
expect(await statusMsg.evaluate((el) => el.textContent)).toBe(
'Changes were already requested',
);
});

it('should send correct PATCH request when requesting changes', async function () {
let feedbackRequestBody = null;
let feedbackRequestMethod = null;

await page.goto(
`${LOCAL_TEST_PAGE_URL}/applications?dev=true&status=pending`,
);
await page.waitForSelector('.application-card');

page.on('request', (request) => {
if (
request.url().includes('/applications/') &&
request.url().includes('/feedback')
) {
feedbackRequestMethod = request.method();
feedbackRequestBody = JSON.parse(request.postData());
}
});

await page.click('.application-card');

await page.$eval('.application-textarea', (el) => (el.value = ''));
await page.type(
'.application-textarea',
'Please update your introduction.',
);

await page.click('[data-testid="application-details-request-changes"]');
await page.waitForSelector('[data-testid="toast-component"].show');

expect(feedbackRequestBody).toEqual({
status: 'changes_requested',
feedback: 'Please update your introduction.',
});
});

it('should display existing feedback in a list', async function () {
await page.click('.view-details-button');
await page.waitForSelector('.feedback-list');
const feedbackItems = await page.$$('.feedback-item');
expect(feedbackItems.length).toBe(1);

const feedbackText = await feedbackItems[0].$eval(
'.feedback-text',
(el) => el.innerText,
);
expect(feedbackText).toBe('estee');

const feedbackMeta = await feedbackItems[0].$eval(
'.feedback-meta',
(el) => el.innerText,
);
expect(feedbackMeta).toContain('Reviewer');
});

it('should show action buttons when application status is changes_requested', async function () {
await page.goto(
`${LOCAL_TEST_PAGE_URL}/applications?dev=true&status=changes_requested`,
);
await page.waitForSelector('.application-card');
await page.click('.application-card');

const acceptBtn = await page.$(
'[data-testid="application-details-accept"]',
);
const rejectBtn = await page.$(
'[data-testid="application-details-reject"]',
);
const requestChangesBtn = await page.$(
'[data-testid="application-details-request-changes"]',
);

expect(
await acceptBtn.evaluate((el) => el.classList.contains('hidden')),
).toBe(false);
expect(
await rejectBtn.evaluate((el) => el.classList.contains('hidden')),
).toBe(false);
expect(
await requestChangesBtn.evaluate((el) => el.classList.contains('hidden')),
).toBe(false);
});
});
17 changes: 16 additions & 1 deletion applications/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -125,15 +125,30 @@ <h2>Status</h2>
/>
</button>
<div class="application-details-main"></div>
<div class="application-details-actions">
<div
class="application-details-actions"
id="application-details-actions"
>
<button
class="application-details-accept"
id="application-details-accept"
data-testid="application-details-accept"
aria-label="Accept Application"
>
Accept
</button>
<button
class="application-details-request-changes"
aria-label="Request changes for this application"
id="application-details-request-changes"
data-testid="application-details-request-changes"
>
Request Changes
</button>
<button
class="application-details-reject"
id="application-details-reject"
data-testid="application-details-reject"
aria-label="Reject Application"
>
Reject
Expand Down
Loading
Loading