Web Dev Solutions

Catalin Mititiuc

From d826a01ff91301d88762a59881ac53053926b5be Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Sun, 2 Jun 2024 14:46:27 -0700 Subject: Add integration test-helpers and refactor integration tests --- test/integration/select.test.js | 172 ++++++++++++++++++---------------------- 1 file changed, 77 insertions(+), 95 deletions(-) (limited to 'test/integration/select.test.js') diff --git a/test/integration/select.test.js b/test/integration/select.test.js index d9b632e..acde0f0 100644 --- a/test/integration/select.test.js +++ b/test/integration/select.test.js @@ -1,136 +1,118 @@ -const { Builder, By, until } = require('selenium-webdriver'), +const { Builder, By } = require('selenium-webdriver'), chrome = require('selenium-webdriver/chrome.js'), chromeOptions = new chrome.Options(), - { readFile, readdir } = require('node:fs/promises'), - { HttpResponse } = require('selenium-webdriver/devtools/networkinterceptor'); + { readFile, readdir } = require('node:fs/promises'); chromeOptions.addArguments('--headless', '--disable-gpu', '--no-sandbox'); const buildPath = 'build/assets/images'; const defaultScenario = 'scenario-side_show'; -const fixtureFilePath = './test/integration/fixtures/scenario-test.svg'; +const fixtureFilePath = './test/integration/fixtures/scenario.svg'; -const selected = expect.stringContaining('selected'); -const notSelected = expect.not.stringContaining('selected'); - -let driver, httpResponse; +let driver, fixture, scenario; beforeAll(async () => { - const filenames = await readdir(buildPath); - const scenario = filenames.find(filename => filename.includes(defaultScenario)); - - httpResponse = new HttpResponse(url(`/assets/images/${scenario}`)); - httpResponse.body = await readFile(fixtureFilePath, 'utf8'); - httpResponse.addHeaders('Content-Type', 'image/svg+xml'); + const dirread = readdir(buildPath); + const fileRead = readFile(fixtureFilePath, 'utf8'); + const filenames = await dirread; + scenario = filenames.find(filename => filename.includes(defaultScenario)); + fixture = await fileRead; }); beforeEach(async () => { driver = new Builder().forBrowser('chrome').setChromeOptions(chromeOptions).build(); - const connection = await driver.createCDPConnection('page') - await driver.onIntercept(connection, httpResponse, async () => {}); - await driver.get(url('/')); - const mapPlaceholderEl = await driver.findElement(By.css('.map-placeholder')); - await driver.wait(until.elementIsNotVisible(mapPlaceholderEl), 1000); }); -it('selects and deselects a trooper by clicking on its counter', async () => { - const record = await driver.findElement(By.css('.soldier-record')); - const objectEl = await driver.findElement(By.css('object')); - const selector = '.counter[data-allegiance="attacker"][data-number="1"]'; - - expect(await record.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().frame(objectEl); - const svg = await driver.findElement(By.css('svg')); - const counter = await driver.findElement(By.css(selector), svg); - expect(await counter.getAttribute('class')).toEqual(notSelected); +describe('a trooper', () => { + beforeEach(async () => { + await mockResponse(driver, `/assets/images/${scenario}`, fixture, (document) => { + placeCounter(document, createTroopCounter(), { x: 1, y: 1 }); + return `\n` + document.querySelector('svg').outerHTML; + }); + }); - await counter.click(); + it('is selected by clicking on its counter', async () => { + await driver.get(url('/')); + await page.waitUntilMapLoaded(driver); - expect(await counter.getAttribute('class')).toEqual(selected); - await driver.switchTo().defaultContent(); - expect(await record.getAttribute('class')).toEqual(selected); + const record = page.findTroopRecordEl(driver); + const mapResource = page.findMapResourceEl(driver); - await driver.switchTo().frame(objectEl); - await counter.click(); + await page.expectNotSelected(await record); + const counter = await page.findElInFrame(await mapResource, By.css(page.troopCounterSelector())); + await page.expectNotSelected(counter); - expect(await counter.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().defaultContent(); - expect(await record.getAttribute('class')).toEqual(notSelected); -}); + await counter.click(); -it('selects and deselects trooper by clicking on its record', async () => { - const record = await driver.findElement(By.css('.soldier-record')); - const objectEl = await driver.findElement(By.css('object')); - const selector = '.counter[data-allegiance="attacker"][data-number="1"]'; + await page.expectSelected(counter); + await driver.switchTo().defaultContent(); + await page.expectSelected(await record); + }); - expect(await record.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().frame(objectEl); - const svg = await driver.findElement(By.css('svg')); - const counter = await driver.findElement(By.css(selector), svg); - expect(await counter.getAttribute('class')).toEqual(notSelected); + it('is selected by clicking on its record', async () => { + await driver.get(url('/')); + await page.waitUntilMapLoaded(driver); - await driver.switchTo().defaultContent(); - await record.click(); + const record = page.findTroopRecordEl(driver); + const mapResource = page.findMapResourceEl(driver); - expect(await record.getAttribute('class')).toEqual(selected); - await driver.switchTo().frame(objectEl); - expect(await counter.getAttribute('class')).toEqual(selected); + await page.expectNotSelected(await record); + const counter = await page.findElInFrame(await mapResource, By.css(page.troopCounterSelector())); + await page.expectNotSelected(counter); - await driver.switchTo().defaultContent(); - await record.click(); + await driver.switchTo().defaultContent(); + await record.click(); - expect(await record.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().frame(objectEl); - expect(await counter.getAttribute('class')).toEqual(notSelected); + await page.expectSelected(await record); + await driver.switchTo().frame(await mapResource); + await page.expectSelected(counter); + }); }); -it('selects a trooper by clicking on its counter and deselects it by clicking on its record', async () => { - const record = await driver.findElement(By.css('.soldier-record')); - const objectEl = await driver.findElement(By.css('object')); - const selector = '.counter[data-allegiance="attacker"][data-number="1"]'; - - expect(await record.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().frame(objectEl); - const svg = await driver.findElement(By.css('svg')); - const counter = await driver.findElement(By.css(selector), svg); - expect(await counter.getAttribute('class')).toEqual(notSelected); +describe('a selected trooper', () => { + beforeEach(async () => { + await mockResponse(driver, `/assets/images/${scenario}`, fixture, (document) => { + placeCounter(document, selectCounter(createTroopCounter()), { x: 1, y: 1 }); + return `\n` + document.querySelector('svg').outerHTML; + }); + }); - await counter.click(); + it('is deselected by clicking on its counter', async () => { + await driver.get(url('/')); + await page.waitUntilMapLoaded(driver); - expect(await counter.getAttribute('class')).toEqual(selected); - await driver.switchTo().defaultContent(); - expect(await record.getAttribute('class')).toEqual(selected); + const record = page.findTroopRecordEl(driver); + const mapResource = page.findMapResourceEl(driver); - await record.click(); + await page.expectSelected(await record); + const counter = await page.findElInFrame(await mapResource, By.css(page.troopCounterSelector())); + await page.expectSelected(counter); - expect(await record.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().frame(objectEl); - expect(await counter.getAttribute('class')).toEqual(notSelected); -}); + await counter.click(); -it('selects a trooper by clicking on its record and deselects it by clicking on its counter', async () => { - const record = await driver.findElement(By.css('.soldier-record')); - const objectEl = await driver.findElement(By.css('object')); - const selector = '.counter[data-allegiance="attacker"][data-number="1"]'; + await page.expectNotSelected(counter); + await driver.switchTo().defaultContent(); + await page.expectNotSelected(await record); + }); - expect(await record.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().frame(objectEl); - const svg = await driver.findElement(By.css('svg')); - const counter = await driver.findElement(By.css(selector), svg); - expect(await counter.getAttribute('class')).toEqual(notSelected); + it('is deselected by clicking on its record', async () => { + await driver.get(url('/')); + await page.waitUntilMapLoaded(driver); - await driver.switchTo().defaultContent(); - await record.click(); + const record = page.findTroopRecordEl(driver); + const mapResource = page.findMapResourceEl(driver); - expect(await record.getAttribute('class')).toEqual(selected); - await driver.switchTo().frame(objectEl); - expect(await counter.getAttribute('class')).toEqual(selected); + await page.expectSelected(await record); + const counter = await page.findElInFrame(await mapResource, By.css(page.troopCounterSelector())); + await page.expectSelected(counter); - await counter.click(); + await driver.switchTo().defaultContent(); + await record.click(); - expect(await counter.getAttribute('class')).toEqual(notSelected); - await driver.switchTo().defaultContent(); - expect(await record.getAttribute('class')).toEqual(notSelected); + await page.expectNotSelected(await record); + await driver.switchTo().frame(await mapResource); + await page.expectNotSelected(counter); + }); }); afterEach(async () => { -- cgit v1.2.3