Skip to content

Commit 56dd16e

Browse files
Ajeyakrishna-kAjeyakrishna-k
committed
chore: rename taskRequest page url to task-requests
1 parent fce902b commit 56dd16e

File tree

15 files changed

+2751
-0
lines changed

15 files changed

+2751
-0
lines changed

‎__tests__/task-requests/task-request.test.js‎

Lines changed: 289 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,289 @@
1+
const puppeteer = require('puppeteer');
2+
3+
const { fetchedTaskRequests } = require('../../mock-data/taskRequests');
4+
5+
const SITE_URL = 'http://localhost:8000';
6+
// helper/loadEnv.js file causes API_BASE_URL to be stagin-api on local env url in taskRequest/index.html
7+
const API_BASE_URL = 'https://staging-api.realdevsquad.com';
8+
9+
describe('Task Requests', () => {
10+
let browser;
11+
let page;
12+
13+
jest.setTimeout(60000);
14+
15+
beforeEach(async () => {
16+
browser = await puppeteer.launch({
17+
headless: 'new',
18+
ignoreHTTPSErrors: true,
19+
args: ['--incognito', '--disable-web-security'],
20+
devtools: false,
21+
});
22+
});
23+
beforeEach(async () => {
24+
page = await browser.newPage();
25+
26+
await page.setRequestInterception(true);
27+
28+
page.on('request', (request) => {
29+
if (
30+
request.url() === `${API_BASE_URL}/taskRequests` ||
31+
request.url() === `${API_BASE_URL}/taskRequests?dev=true` ||
32+
request.url() ===
33+
`${API_BASE_URL}/taskRequests?size=20&q=status%3Apending+sort%3Acreated-asc&dev=true`
34+
) {
35+
request.respond({
36+
status: 200,
37+
contentType: 'application/json',
38+
body: JSON.stringify({ data: fetchedTaskRequests }),
39+
headers: {
40+
'Access-Control-Allow-Origin': '*',
41+
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
42+
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
43+
},
44+
});
45+
} else if (
46+
request.url() ===
47+
`${API_BASE_URL}/taskRequests?size=20&q=status%3Aapproved++sort%3Acreated-asc&dev=true`
48+
) {
49+
const list = [];
50+
for (let i = 0; i < 20; i++) {
51+
list.push(fetchedTaskRequests[0]);
52+
}
53+
request.respond({
54+
status: 200,
55+
contentType: 'application/json',
56+
body: JSON.stringify({
57+
data: list,
58+
next: '/taskRequests?size=20&q=status%3Aapproved++sort%3Acreated-asc&dev=true',
59+
}),
60+
});
61+
} else {
62+
request.continue();
63+
}
64+
});
65+
await page.goto(`${SITE_URL}/taskRequests`);
66+
await page.waitForNetworkIdle();
67+
});
68+
69+
afterEach(async () => {
70+
await page.close();
71+
});
72+
73+
afterAll(async () => {
74+
await browser.close();
75+
});
76+
describe('When the user is super user', () => {
77+
it('should display the task requests card', async () => {
78+
const url = await page.evaluate(() => API_BASE_URL);
79+
const taskCards = await page.$$('.taskRequest__card');
80+
const title = await taskCards[0].evaluate(
81+
(el) => el.children[0].textContent,
82+
);
83+
const purpose = await taskCards[0].evaluate(
84+
(el) => el.children[1].textContent,
85+
);
86+
87+
expect(taskCards).toHaveLength(1);
88+
expect(title).toMatch(/test title/i);
89+
expect(purpose).toMatch(/test purpose/i);
90+
});
91+
describe('Filter Modal', () => {
92+
it('should be hidden initially', async () => {
93+
const modal = await page.$('.filter-modal');
94+
expect(
95+
await modal.evaluate((el) => el.classList.contains('hidden')),
96+
).toBe(true);
97+
});
98+
99+
it('should be displayed after clicking the filter button and hidden on outside click', async () => {
100+
const modal = await page.$('.filter-modal');
101+
const filterHead = await page.$('.filter-head');
102+
const filterContainer = await page.$('.filters-container');
103+
expect(filterHead).toBeTruthy();
104+
expect(filterContainer).toBeTruthy();
105+
await page.click('#filter-button');
106+
expect(modal).not.toBeNull();
107+
expect(
108+
await modal.evaluate((el) => el.classList.contains('hidden')),
109+
).toBe(false);
110+
await page.mouse.click(200, 200);
111+
expect(
112+
await modal.evaluate((el) => el.classList.contains('hidden')),
113+
).toBe(true);
114+
});
115+
116+
it('checks if PENDING is checked by default', async () => {
117+
const filterButton = await page.$('#filter-button');
118+
await filterButton.click();
119+
await page.waitForSelector('.filter-modal');
120+
const activeFilter = await page.$('input[value="PENDING"]');
121+
const currentState = await activeFilter.getProperty('checked');
122+
const isChecked = await currentState.jsonValue();
123+
expect(isChecked).toBe(true);
124+
});
125+
126+
it('Selecting filters and clicking on apply should filter task request list', async () => {
127+
let cardsList = await page.$$('.taskRequest__card');
128+
expect(cardsList).not.toBeNull();
129+
const initialLength = cardsList.length;
130+
await page.click('#filter-button');
131+
await page.click('input[value="PENDING"]');
132+
await page.click('input[value="APPROVED"]');
133+
await page.click('#apply-filter-button');
134+
await page.waitForNetworkIdle();
135+
cardsList = await page.$$('.taskRequest__card');
136+
expect(cardsList).not.toBeNull();
137+
expect(cardsList.length).toBeGreaterThanOrEqual(0);
138+
expect(cardsList.length).not.toBe(initialLength);
139+
});
140+
141+
it('clears the filter when the Clear button is clicked', async () => {
142+
const filterButton = await page.$('#filter-button');
143+
await filterButton.click();
144+
await page.waitForSelector('.filter-modal');
145+
const activeFilter = await page.$('input[value="APPROVED"]');
146+
await activeFilter.click();
147+
const clearButton = await page.$('.filter-modal #clear-button');
148+
await clearButton.click();
149+
await page.waitForSelector('.filter-modal', { hidden: true });
150+
const currentState = await activeFilter.getProperty('checked');
151+
const isChecked = await currentState.jsonValue();
152+
expect(isChecked).toBe(false);
153+
});
154+
});
155+
156+
describe('Sort Modal', () => {
157+
it('should be hidden initially', async () => {
158+
const sortModal = await page.$('.sort-modal');
159+
const assigneButton = await page.$('#REQUESTORS_COUNT_ASC');
160+
expect(
161+
await sortModal.evaluate((el) => el.classList.contains('hidden')),
162+
).toBe(true);
163+
expect(assigneButton).toBeTruthy();
164+
});
165+
166+
it('should toggle visibility sort modal by clicking the sort button and selecting an option', async () => {
167+
const sortModal = await page.$('.sort-modal');
168+
const assigneButton = await page.$('#REQUESTORS_COUNT_ASC');
169+
const sortHead = await page.$('.sort-head');
170+
const sortContainer = await page.$('.sorts-container');
171+
172+
expect(sortHead).toBeTruthy();
173+
expect(sortContainer).toBeTruthy();
174+
175+
await page.click('.sort-button');
176+
await page.click('#REQUESTORS_COUNT_ASC');
177+
expect(
178+
await assigneButton.evaluate((el) =>
179+
el.classList.contains('selected'),
180+
),
181+
).toBe(true);
182+
expect(
183+
await sortModal.evaluate((el) => el.classList.contains('hidden')),
184+
).toBe(true);
185+
await page.click('.sort-button');
186+
await page.click('#REQUESTORS_COUNT_ASC');
187+
expect(
188+
await assigneButton.evaluate((el) =>
189+
el.classList.contains('selected'),
190+
),
191+
).toBe(false);
192+
expect(
193+
await sortModal.evaluate((el) => el.classList.contains('hidden')),
194+
).toBe(true);
195+
});
196+
});
197+
198+
it('Checks that new items are loaded when scrolled to the bottom', async () => {
199+
await page.click('#filter-button');
200+
await page.click('input[value="PENDING"]');
201+
await page.click('input[value="APPROVED"]');
202+
await page.click('#apply-filter-button');
203+
await page.waitForNetworkIdle();
204+
let taskRequestList = await page.$$('.taskRequest__card');
205+
expect(taskRequestList.length).toBe(20);
206+
await page.evaluate(() => {
207+
const element = document.querySelector('.virtual');
208+
if (element) {
209+
element.scrollIntoView({ behavior: 'auto' });
210+
}
211+
});
212+
await page.waitForNetworkIdle();
213+
taskRequestList = await page.$$('.taskRequest__card');
214+
expect(taskRequestList.length).toBe(40);
215+
});
216+
});
217+
});
218+
219+
describe('createCustomElement', () => {
220+
let browser;
221+
let page;
222+
223+
beforeAll(async () => {
224+
browser = await puppeteer.launch({
225+
headless: 'new',
226+
});
227+
228+
page = await browser.newPage();
229+
230+
await page.goto(`${SITE_URL}/taskRequests`);
231+
await page.waitForNetworkIdle();
232+
});
233+
234+
afterAll(async () => {
235+
await browser.close();
236+
});
237+
238+
describe('tagName', () => {
239+
it('should create tag with provided tagName', async () => {
240+
const tag = await page.evaluate(
241+
() => createCustomElement({ tagName: 'p' }).tagName,
242+
);
243+
expect(tag).toMatch(/p/i);
244+
});
245+
246+
it('should not add tagName attribute', async () => {
247+
const tagNameAttr = await page.evaluate(() =>
248+
createCustomElement({ tagName: 'p' }).getAttribute('tagName'),
249+
);
250+
251+
expect(tagNameAttr).toBeNull();
252+
});
253+
});
254+
255+
describe('className', () => {
256+
it('should add the class when class key is provided using string', async () => {
257+
const classes = await page.evaluate(() => [
258+
...createCustomElement({ tagName: 'p', class: 'test-class' }).classList,
259+
]);
260+
261+
expect(classes).toHaveLength(1);
262+
expect(classes).toContain('test-class');
263+
});
264+
265+
it('should add multiple classes when class key has array as value', async () => {
266+
const classes = await page.evaluate(() => [
267+
...createCustomElement({
268+
tagName: 'p',
269+
class: ['test-class-1', 'test-class-2'],
270+
}).classList,
271+
]);
272+
273+
expect(classes).toHaveLength(2);
274+
expect(classes).toStrictEqual(['test-class-1', 'test-class-2']);
275+
});
276+
});
277+
278+
describe('textContent', () => {
279+
it('should add textContent key when specified', async () => {
280+
const textContent = await page.evaluate(
281+
() =>
282+
createCustomElement({ tagName: 'p', textContent: 'test content' })
283+
.textContent,
284+
);
285+
286+
expect(textContent).toBe('test content');
287+
});
288+
});
289+
});

0 commit comments

Comments
 (0)