From f5cc095dbec0562c44c8cbe4f271513da8ec7e86 Mon Sep 17 00:00:00 2001
From: Paul Elliott <paul.elliott@kitware.com>
Date: Thu, 26 Oct 2023 20:09:06 -0400
Subject: [PATCH] wip

---
 src/components/VtkTwoView.vue     |  6 +++-
 tests/pageobjects/volview.page.ts | 11 ++------
 tests/specs/session-zip.e2e.ts    | 47 ++++++++++++++++++++++---------
 3 files changed, 41 insertions(+), 23 deletions(-)

diff --git a/src/components/VtkTwoView.vue b/src/components/VtkTwoView.vue
index bcdcd4d97..533c6f559 100644
--- a/src/components/VtkTwoView.vue
+++ b/src/components/VtkTwoView.vue
@@ -28,7 +28,11 @@
         @input="setSlice"
       />
     </div>
-    <div class="vtk-container" :class="active ? 'active' : ''">
+    <div
+      class="vtk-container"
+      :class="active ? 'active' : ''"
+      data-testid="two-view-container"
+    >
       <div class="vtk-sub-container">
         <div
           class="vtk-view"
diff --git a/tests/pageobjects/volview.page.ts b/tests/pageobjects/volview.page.ts
index 1ae8651aa..7f7580665 100644
--- a/tests/pageobjects/volview.page.ts
+++ b/tests/pageobjects/volview.page.ts
@@ -77,15 +77,8 @@ class VolViewPage extends Page {
     return $$('div[data-testid~="vtk-two-view"] > canvas');
   }
 
-  async clickTwiceInTwoView() {
-    const views = await this.twoViews;
-    const view = views[0];
-    await view.click({ x: 1, y: 1 });
-    await view.click({ x: 5, y: 5 });
-  }
-
-  get rectangleToolContainers() {
-    return $$('*[data-testid="rectangle-tool-container"]');
+  get viewTwoContainer() {
+    return $('div[data-testid~="two-view-container"]');
   }
 
   get saveButton() {
diff --git a/tests/specs/session-zip.e2e.ts b/tests/specs/session-zip.e2e.ts
index 2818ec8d1..19df6d19e 100644
--- a/tests/specs/session-zip.e2e.ts
+++ b/tests/specs/session-zip.e2e.ts
@@ -6,6 +6,7 @@ import { setValueVueInput, volViewPage } from '../pageobjects/volview.page';
 import { TEMP_DIR } from '../../wdio.shared.conf';
 
 const SESSION_SAVE_TIMEOUT = 40000;
+const SLOW_INTERACTION_TIMEOUT = 10000;
 
 // from https://stackoverflow.com/a/47764403
 function waitForFileExists(filePath: string, timeout: number) {
@@ -15,15 +16,19 @@ function waitForFileExists(filePath: string, timeout: number) {
     const onTimeout = () => {
       watcher.close();
       reject(
-        new Error('File did not exists and was not created during the timeout.')
+        new Error(
+          `File ${filePath} did not exists and was not created during the timeout of ${timeout} ms}`
+        )
       );
     };
 
     const timerId = setTimeout(onTimeout, timeout);
 
+    // watch if file newly created
     const dir = path.dirname(filePath);
     const basename = path.basename(filePath);
     watcher = fs.watch(dir, (eventType: any, filename: string | null) => {
+      console.log(eventType, filename);
       if (eventType === 'rename' && filename === basename) {
         clearTimeout(timerId);
         watcher.close();
@@ -31,6 +36,7 @@ function waitForFileExists(filePath: string, timeout: number) {
       }
     });
 
+    // check if file already exists
     fs.access(filePath, fs.constants.R_OK, (err) => {
       if (!err) {
         clearTimeout(timerId);
@@ -45,7 +51,6 @@ const saveSession = async () => {
   const sessionFileName = await volViewPage.saveSession();
   const downloadedPath = path.join(TEMP_DIR, sessionFileName);
   await waitForFileExists(downloadedPath, SESSION_SAVE_TIMEOUT);
-  await browser.pause(1000); // wait for writing to finish?
   return sessionFileName;
 };
 
@@ -58,27 +63,41 @@ const parseManifest = async (sessionFileName: string) => {
 
 const saveGetManifest = async () => {
   const session = await saveSession();
+  await browser.pause(1000); // wait for writing to finish before unzipping?
   const manifest = await parseManifest(session);
   return { session, manifest };
 };
 
-const getRectangleCount = async () => {
-  const oneRectangleContainer = (await volViewPage.rectangleToolContainers)[0];
-  const rectangles = await oneRectangleContainer.$$('g');
+const getRectangleCount = async (view: WebdriverIO.Element) => {
+  const rectangles = await view.$$(
+    'svg[data-testid="rectangle-tool-container"] > g'
+  );
   return rectangles.length;
 };
 
-const waitForRectangleCount = async (count: number) => {
-  // wait for rectangle to be drawn
+const waitForRectangleCount = async (
+  view: WebdriverIO.Element,
+  count: number
+) => {
   await browser.waitUntil(
     async function newRectangleExist() {
-      const updatedCount = await getRectangleCount();
+      const updatedCount = await getRectangleCount(view);
+      console.log('updatedCount', updatedCount, count);
       return updatedCount >= count;
     },
-    { timeoutMsg: `expected ${count} rectangles to be drawn` }
+    {
+      timeoutMsg: `expected ${count} rectangles to be drawn in ${SLOW_INTERACTION_TIMEOUT} ms}`,
+      timeout: SLOW_INTERACTION_TIMEOUT,
+    }
   );
 };
 
+const clickTwice = async (view: WebdriverIO.Element) => {
+  await view.click({ x: 1, y: 1 });
+  await browser.pause(500);
+  await view.click({ x: 30, y: 30 });
+};
+
 const annotate = async () => {
   await volViewPage.open();
   await volViewPage.downloadProstateSample();
@@ -86,10 +105,12 @@ const annotate = async () => {
 
   // draw rectangle
   await volViewPage.activateRectangle();
-  await waitForRectangleCount(1); // wait for placing tool
-
-  await volViewPage.clickTwiceInTwoView();
-  await waitForRectangleCount(2); // wait for drawn tool
+  await browser.pause(1000);
+  const view = await volViewPage.viewTwoContainer;
+  await waitForRectangleCount(view, 1); // wait for placing tool
+  await browser.pause(500);
+  await clickTwice(view);
+  await waitForRectangleCount(view, 2); // wait for drawn tool
 };
 
 describe('VolView config and deserialization', () => {