From 36113586ab9dab594f0f6b37261563ad31d7110c Mon Sep 17 00:00:00 2001 From: tanishqsingla Date: Mon, 17 Jul 2023 02:30:49 +0530 Subject: [PATCH] test: Add unit tests for createCustomElement --- .../unit/createCustomElement.test.js | 76 +++++++++++++++++++ taskRequests/details/index.html | 4 +- taskRequests/index.html | 8 +- taskRequests/util.js | 4 + 4 files changed, 86 insertions(+), 6 deletions(-) create mode 100644 __tests__/taskRequests/unit/createCustomElement.test.js diff --git a/__tests__/taskRequests/unit/createCustomElement.test.js b/__tests__/taskRequests/unit/createCustomElement.test.js new file mode 100644 index 000000000..de6f67530 --- /dev/null +++ b/__tests__/taskRequests/unit/createCustomElement.test.js @@ -0,0 +1,76 @@ +const puppeteer = require('puppeteer'); +const { createCustomElement } = require('../../../taskRequests/util'); + +describe('createCustomElement', () => { + let browser; + let page; + + beforeAll(async () => { + browser = await puppeteer.launch({ + headless: true, + ignoreHTTPSErrors: true, + args: ['--incognito', '--disable-web-security'], + devtools: false, + }); + page = await browser.newPage(); + + await page.goto('http://localhost:8000/taskRequests'); + await page.waitForNetworkIdle(); + }); + + afterAll(async () => { + await browser.close(); + }); + + describe('tagName', () => { + it('should create tag with provided tagName', async () => { + const tag = await page.evaluate( + () => createCustomElement({ tagName: 'p' }).tagName, + ); + expect(tag).toMatch(/p/i); + }); + + it('should not add tagName attribute', async () => { + const tagNameAttr = await page.evaluate(() => + createCustomElement({ tagName: 'p' }).getAttribute('tagName'), + ); + + expect(tagNameAttr).toBeNull(); + }); + }); + + describe('className', () => { + it('should add the class when class key is provided using string', async () => { + const classes = await page.evaluate(() => [ + ...createCustomElement({ tagName: 'p', class: 'test-class' }).classList, + ]); + + expect(classes).toHaveLength(1); + expect(classes).toContain('test-class'); + }); + + it('should add multiple classes when class key has array as value', async () => { + const classes = await page.evaluate(() => [ + ...createCustomElement({ + tagName: 'p', + class: ['test-class-1', 'test-class-2'], + }).classList, + ]); + + expect(classes).toHaveLength(2); + expect(classes).toStrictEqual(['test-class-1', 'test-class-2']); + }); + }); + + describe('textContent', () => { + it('should add textContent key when specified', async () => { + const textContent = await page.evaluate( + () => + createCustomElement({ tagName: 'p', textContent: 'test content' }) + .textContent, + ); + + expect(textContent).toBe('test content'); + }); + }); +}); diff --git a/taskRequests/details/index.html b/taskRequests/details/index.html index 8197e1f18..730198189 100644 --- a/taskRequests/details/index.html +++ b/taskRequests/details/index.html @@ -11,12 +11,12 @@ href="https://fonts.googleapis.com/css2?family=Inter:wght@100;400;700;800&display=swap" rel="stylesheet" /> - + Task Requests | Real Dev Squad - +
diff --git a/taskRequests/index.html b/taskRequests/index.html index 76b234333..6bb2474ac 100644 --- a/taskRequests/index.html +++ b/taskRequests/index.html @@ -13,11 +13,11 @@ /> Task Requests | Real Dev Squad - + - - - + + + diff --git a/taskRequests/util.js b/taskRequests/util.js index 99a9a276a..a53d8d4c2 100644 --- a/taskRequests/util.js +++ b/taskRequests/util.js @@ -23,3 +23,7 @@ function createCustomElement(domObjectMap) { } return el; } + +module.exports = { + createCustomElement, +};