4 files changed, 16 insertions, 24 deletions
diff --git a/test/integration/fixtures/scenario.svg b/test/integration/fixtures/scenario.svg
index e5b7121..522c431 100644
--- a/test/integration/fixtures/scenario.svg
+++ b/test/integration/fixtures/scenario.svg
@@ -2,23 +2,15 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 -10 200 300">
   <g class="gameboard">
     <g class="grid">
-      <g data-y="0">
-        <g data-x="0"><use href="#hex"/></g>
-        <g data-x="1"><use href="#hex"/></g>
-        <g data-x="2"><use href="#hex"/></g>
-      </g>
-      <g data-y="1">
-        <g data-x="0"><use href="#hex"/></g>
-        <g data-x="1"><use href="#hex"/></g>
-        <g data-x="2"><use href="#hex"/></g>
-      </g>
-      <g data-y="2">
-        <g data-x="0"><use href="#hex"/></g>
-        <g data-x="1"><use href="#hex"/></g>
-        <g data-x="2"><use href="#hex"/></g>
+      <g class="elevation-0">
+        <g data-q="0" data-r="0" data-s="0" data-t="0" transform="translate(0, 0)"><use href="#hex"/></g>
+        <g data-q="1" data-r="0" data-s="-1" data-t="0" transform="translate(-17.32, 0)"><use href="#hex"/></g>
+        <g data-q="-1" data-r="0" data-s="1" data-t="0" transform="translate(17.32, 0)"><use href="#hex"/></g>
+        <g data-q="1" data-r="-1" data-s="0" data-t="0" transform="translate(-8.66, -15)"><use href="#hex"/></g>
+        <g data-q="-1" data-r="1" data-s="0" data-t="0" transform="translate(8.66, 15)"><use href="#hex"/></g>
+        <g data-q="0" data-r="1" data-s="-1" data-t="0" transform="translate(-8.66, 15)"><use href="#hex"/></g>
+        <g data-q="0" data-r="-1" data-s="1" data-t="0" transform="translate(8.66, -15)"><use href="#hex"/></g>
       </g>
     </g>
   </g>
-
-  <script/>
 </svg>
diff --git a/test/integration/helpers.cjs b/test/integration/helpers.cjs
index 10b0dc6..dc03aba 100644
--- a/test/integration/helpers.cjs
+++ b/test/integration/helpers.cjs
@@ -78,8 +78,8 @@ global.createTroopCounter = function (
   `);
 }
 
-global.placeCounter = function (document, counter, { x, y }) {
-  document.querySelector(`g[data-y="${y}"] g[data-x="${x}"]`).append(counter);
+global.placeCounter = function (document, counter, { q = 0, r = 0, s = 0, t = 0 } = {}) {
+  document.querySelector(`[data-q="${q}"][data-r="${r}"][data-s="${s}"][data-t="${t}"]`).append(counter);
 }
 
 global.selectCounter = function (counter) {
diff --git a/test/integration/loadScenario.test.js b/test/integration/loadScenario.test.js
index fa0d735..2abf9f3 100644
--- a/test/integration/loadScenario.test.js
+++ b/test/integration/loadScenario.test.js
@@ -19,7 +19,7 @@ it('loads default scenario on initial page load', async () => {
   const mapResource = page.findMapResourceEl(driver);
   await driver.switchTo().frame(mapResource);
 
-  const defaultScenarioMapsSelector = '[href="#map2"], [href="#map3"]';
+  const defaultScenarioMapsSelector = '#mapsheet2, #mapsheet3';
   const maps = await driver.findElements(By.css(defaultScenarioMapsSelector));
 
   expect(maps.length).toBe(2);
@@ -38,7 +38,7 @@ it('loads previously-loaded scenario on page refresh', async () => {
   const mapResource = page.findMapResourceEl(driver);
   await driver.switchTo().frame(mapResource);
 
-  const scenarioMapsSelector = '[href="#map1"], [href="#map2"], [href="#map3"]';
+  const scenarioMapsSelector = '#mapsheet1, #mapsheet2, #mapsheet3';
   maps = await driver.findElements(By.css(scenarioMapsSelector));
 
   expect(maps.length).toBe(3);
@@ -65,7 +65,7 @@ it('loads built-in scenario from dialog', async () => {
   const mapResource = page.findMapResourceEl(driver);
   await driver.switchTo().frame(mapResource);
 
-  const scenarioMapsSelector = '[href="#map1"], [href="#map2"], [href="#map3"]';
+  const scenarioMapsSelector = '#mapsheet1, #mapsheet2, #mapsheet3';
   let maps = await driver.findElements(By.css(scenarioMapsSelector));
 
   expect(maps.length).toBe(3);
@@ -84,7 +84,7 @@ it('loads scenario directly from file', async () => {
   const mapResource = page.findMapResourceEl(driver);
   await driver.switchTo().frame(mapResource);
 
-  const scenarioMapsSelector = '[href="#map1"], [href="#map2"], [href="#map3"]';
+  const scenarioMapsSelector = '#mapsheet1, #mapsheet2, #mapsheet3';
   let maps = await driver.findElements(By.css(scenarioMapsSelector));
 
   expect(maps.length).toBe(3);
diff --git a/test/integration/select.test.js b/test/integration/select.test.js
index e16ad4d..e78ec44 100644
--- a/test/integration/select.test.js
+++ b/test/integration/select.test.js
@@ -26,7 +26,7 @@ beforeEach(async () => {
 describe('a trooper', () => {
   beforeEach(async () => {
     await mockResponse(driver, `/assets/images/${scenario}`, fixture, (document) => {
-      placeCounter(document, createTroopCounter(), { x: 1, y: 1 });
+      placeCounter(document, createTroopCounter(), { q: 0, r: 0, s: 0 });
       return svgDocument(document);
     });
   });
@@ -43,7 +43,7 @@ describe('a trooper', () => {
     await page.expectNotSelected(counter);
 
     await counter.click();
-
+    await takeScreenshot(driver);
     await page.expectSelected(counter);
     await driver.switchTo().defaultContent();
     await page.expectSelected(await record);