Add integration test-helpers and refactor integration tests

This commit is contained in:
2025-06-16 22:41:31 -07:00
parent c46c361217
commit 6960fcc79b
6 changed files with 161 additions and 112 deletions

View File

@@ -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"]';
describe('a trooper', () => {
beforeEach(async () => {
await mockResponse(driver, `/assets/images/${scenario}`, fixture, (document) => {
placeCounter(document, createTroopCounter(), { x: 1, y: 1 });
return `<?xml version="1.0" standalone="yes"?>\n` + document.querySelector('svg').outerHTML;
});
});
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 counter', async () => {
await driver.get(url('/'));
await page.waitUntilMapLoaded(driver);
await counter.click();
const record = page.findTroopRecordEl(driver);
const mapResource = page.findMapResourceEl(driver);
expect(await counter.getAttribute('class')).toEqual(selected);
await driver.switchTo().defaultContent();
expect(await record.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().frame(objectEl);
await counter.click();
await counter.click();
expect(await counter.getAttribute('class')).toEqual(notSelected);
await driver.switchTo().defaultContent();
expect(await record.getAttribute('class')).toEqual(notSelected);
await page.expectSelected(counter);
await driver.switchTo().defaultContent();
await page.expectSelected(await record);
});
it('is selected by clicking on its record', async () => {
await driver.get(url('/'));
await page.waitUntilMapLoaded(driver);
const record = page.findTroopRecordEl(driver);
const mapResource = page.findMapResourceEl(driver);
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 page.expectSelected(await record);
await driver.switchTo().frame(await mapResource);
await page.expectSelected(counter);
});
});
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"]';
describe('a selected trooper', () => {
beforeEach(async () => {
await mockResponse(driver, `/assets/images/${scenario}`, fixture, (document) => {
placeCounter(document, selectCounter(createTroopCounter()), { x: 1, y: 1 });
return `<?xml version="1.0" standalone="yes"?>\n` + document.querySelector('svg').outerHTML;
});
});
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 counter', 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 driver.switchTo().defaultContent();
await record.click();
await counter.click();
expect(await record.getAttribute('class')).toEqual(notSelected);
await driver.switchTo().frame(objectEl);
expect(await counter.getAttribute('class')).toEqual(notSelected);
});
await page.expectNotSelected(counter);
await driver.switchTo().defaultContent();
await page.expectNotSelected(await record);
});
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"]';
it('is deselected by clicking on its record', async () => {
await driver.get(url('/'));
await page.waitUntilMapLoaded(driver);
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);
const record = page.findTroopRecordEl(driver);
const mapResource = page.findMapResourceEl(driver);
await counter.click();
await page.expectSelected(await record);
const counter = await page.findElInFrame(await mapResource, By.css(page.troopCounterSelector()));
await page.expectSelected(counter);
expect(await counter.getAttribute('class')).toEqual(selected);
await driver.switchTo().defaultContent();
expect(await record.getAttribute('class')).toEqual(selected);
await driver.switchTo().defaultContent();
await record.click();
await record.click();
expect(await record.getAttribute('class')).toEqual(notSelected);
await driver.switchTo().frame(objectEl);
expect(await counter.getAttribute('class')).toEqual(notSelected);
});
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"]';
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);
await driver.switchTo().defaultContent();
await record.click();
expect(await record.getAttribute('class')).toEqual(selected);
await driver.switchTo().frame(objectEl);
expect(await counter.getAttribute('class')).toEqual(selected);
await counter.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 () => {