p2e: guest study dispatcher (ITISFoundation#2362)

* vtk_file test added
* checkIsOnScreen width and height
* a bit of tolerance to deal with zooming factors

Author: odeimaiz

services/web/client/source/class/osparc/dashboard/StudyBrowserButtonLoadMore.js

@@ -44,10 +44,13 @@ qx.Class.define("osparc.dashboard.StudyBrowserButtonLoadMore", {
           const rect = element.getBoundingClientRect();
           const html = document.documentElement;
           return (
+            rect.width > 0 &&
+            rect.height > 0 &&
             rect.top >= 0 &&
             rect.left >= 0 &&
-            rect.bottom <= (window.innerHeight || html.clientHeight) &&
-            rect.right <= (window.innerWidth || html.clientWidth)
+            // a bit of tolerance to deal with zooming factors
+            rect.bottom*0.95 <= (window.innerHeight || html.clientHeight) &&
+            rect.right*0.95 <= (window.innerWidth || html.clientWidth)
           );
         }
         return false;

tests/e2e/package.json

@@ -11,9 +11,9 @@
     "jest-puppeteer": "^4.4.0",
     "log-timestamp": "^0.3.0",
     "log4js": "^6.3.0",
+    "node-fetch": "^2.6.1",
     "puppeteer": "^5.5.0"
   },
-  "devDependencies": {},
   "scripts": {
     "test": "jest --debug --runInBand --colors",
     "demo": "node demo/puppeteerDemo.js",

tests/e2e/portal-files/VTK_file.js

@@ -0,0 +1,88 @@
+// node VTK_file.js [url] [download_link] [file_size] [--demo]
+
+const fetch = require('node-fetch');
+const tutorialBase = require('../tutorials/tutorialBase');
+const utils = require('../utils/utils');
+
+const args = process.argv.slice(2);
+const {
+  urlPrefix,
+  params,
+  enableDemoMode
+} = utils.parseCommandLineArgumentsStudyDispatcherParams(args);
+
+const fileType = "VTK"
+const screenshotPrefix = fileType + "_file_";
+
+
+async function runTutorial () {
+  const urlViewers = urlPrefix + "/v0/viewers/default";
+  const response = await fetch(urlViewers);
+  const viewers = await response.json();
+  const viewer = viewers["data"].find(viewer => viewer.file_type === fileType);
+
+  const url = new URL(viewer.view_url);
+
+  // append the command line arguments
+  Object.entries(params).forEach(entry => {
+    const [key, value] = entry;
+    url.searchParams.append(key, value);
+  });
+
+  const tutorial = new tutorialBase.TutorialBase(url.toString(), screenshotPrefix, null, null, null, enableDemoMode);
+
+  try {
+    tutorial.startScreenshooter();
+    const page = await tutorial.beforeScript();
+    const studyData = await tutorial.openStudyLink();
+    const studyId = studyData["data"]["uuid"];
+    console.log("Study ID:", studyId);
+
+    const workbenchData = utils.extractWorkbenchData(studyData["data"]);
+    const nodeIdViewer = workbenchData["nodeIds"][1];
+    await tutorial.waitForServices(workbenchData["studyId"], [nodeIdViewer]);
+
+    // Some time for starting the service
+    await utils.takeScreenshot(page, screenshotPrefix + 'service_started');
+
+    const iframeHandles = await page.$$("iframe");
+    const iframes = [];
+    for (let i=0; i<iframeHandles.length; i++) {
+      const frame = await iframeHandles[i].contentFrame();
+      iframes.push(frame);
+    }
+    // url/x/nodeIdViewer
+    const frame = iframes.find(iframe => iframe._url.includes(nodeIdViewer));
+
+    // inside the iFrame, click on document icon on top
+    const docSelector = '/html/body/div/div/div[1]/div[1]/div[2]/div[1]/div[1]/i[2]';
+    const docElements = await frame.$x(docSelector);
+    await docElements[0].click();
+
+    // then click on the file to render it
+    const fileSelector = '/html/body/div/div/div[1]/div[1]/div[2]/div[2]/div/ul[2]';
+    const fileElements = await frame.$x(fileSelector);
+    await fileElements[0].click();
+
+    await tutorial.waitFor(2000);
+    await utils.takeScreenshot(page, screenshotPrefix + 'teapot');
+  }
+  catch(err) {
+    tutorial.setTutorialFailed(true);
+    console.log('Tutorial error: ' + err);
+  }
+  finally {
+    tutorial.stopScreenshooter();
+    await tutorial.close();
+  }
+
+  if (tutorial.getTutorialFailed()) {
+    throw "Tutorial Failed";
+  }
+}
+
+runTutorial()
+  .catch(error => {
+    console.log('Puppeteer error: ' + error);
+    process.exit(1);
+  });

tests/e2e/utils/utils.js

@@ -47,6 +47,27 @@ function parseCommandLineArgumentsTemplate(args) {
   }
 }
 
+function parseCommandLineArgumentsStudyDispatcherParams(args) {
+  // [url] [download_link] [file_size] [--demo]
+
+  if (args.length < 3) {
+    console.log('More arguments expected: [url] [download_link] [file_size] [--demo]');
+    process.exit(1);
+  }
+
+  const urlPrefix = args[0];
+  const params = {};
+  params["download_link"] = args[1];
+  params["file_size"] = args[2];
+  const enableDemoMode = args.includes("--demo");
+
+  return {
+    urlPrefix,
+    params,
+    enableDemoMode
+  }
+}
+
 function getUserAndPass(args) {
   const userPass = {
     user: null,
@@ -238,6 +259,7 @@ async function makePingRequest(page, path) {
   // https://github.com/Netflix/pollyjs/issues/149#issuecomment-481108446
   await page.setBypassCSP(true);
   return await page.evaluate(async (path) => {
+    // eslint-disable-next-line no-useless-escape
     const url = (path).replace(/\/\//g, "\/");
     console.log("makePingRequest", url);
     return fetch(url, {
@@ -451,6 +473,7 @@ module.exports = {
   extractWorkbenchData,
   parseCommandLineArguments,
   parseCommandLineArgumentsTemplate,
+  parseCommandLineArgumentsStudyDispatcherParams,
   getGrayLogSnapshotUrl,
   typeInInputElement,
   isElementVisible,