Added an automated Selenium UI test for a small Zimit2 archive

tests/e2e/paths.js

@@ -6,10 +6,12 @@ import path from 'path';
 
 const rayCharlesBaseFile = path.resolve('./tests/zims/legacy-ray-charles/wikipedia_en_ray_charles_2015-06.zimaa');
 const gutenbergRoBaseFile = path.resolve('./tests/zims/gutenberg-ro/gutenberg_ro_all_2023-08.zim');
+const tonedearBaseFile = path.resolve('./tests/zims/tonedear/tonedear.com_en_2024-09.zim');
 const downloadDir = path.resolve('./tests/');
 
 export default {
     rayCharlesBaseFile: rayCharlesBaseFile,
     gutenbergRoBaseFile: gutenbergRoBaseFile,
+    tonedearBaseFile: tonedearBaseFile,
     downloadDir: downloadDir
 };

tests/e2e/runners/chrome/chrome60.bs.runner.js

@@ -1,6 +1,7 @@
 import { Builder } from 'selenium-webdriver';
 import { Options } from 'selenium-webdriver/chrome.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedear from '../../spec/tonedear.e2e.spec.js'
 import paths from '../../paths.js';
 
 /* eslint-disable camelcase */
@@ -37,8 +38,9 @@ async function loadChromeDriver () {
 // Maximize the window so that full browser state is visible in the screenshots
 // await driver_chrome.manage().window().maximize(); // Not supported in this version / Selenium
 
-console.log('\x1b[33m%s\x1b[0m', 'Running Gutenberg tests only for this browser version');
+console.log('\x1b[33m%s\x1b[0m', 'Running Gutenberg and Tonedear tests only for this browser version');
 console.log(' ');
 
 // make sure to use await running tests or we are charged unnecessarily on Browserstack
 await gutenbergRo.runTests(await loadChromeDriver());
+await tonedear.runTests(await loadChromeDriver());

tests/e2e/runners/chrome/chromium.e2e.runner.js

@@ -2,6 +2,7 @@ import { Builder } from 'selenium-webdriver';
 import { Options } from 'selenium-webdriver/chrome.js';
 import legacyRayCharles from '../../spec/legacy-ray_charles.e2e.spec.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedearTests from '../../spec/tonedear.e2e.spec.js';
 import paths from '../../paths.js';
 
 /* eslint-disable camelcase */
@@ -20,10 +21,12 @@ async function loadChromiumDriver () {
     return driver;
 };
 
-// Preserve the order of loading, because when a user runs these on local machine, the second driver will be on top of and cover the first one
-// so we need to use the second one first
+// Preserve the order of loading, because when a user runs these on local machine, the third driver will be on top of and cover the first one
+// so we need to use the third one first
+const driver_for_tonedear = await loadChromiumDriver();
 const driver_for_gutenberg = await loadChromiumDriver();
 const driver_for_ray_charles = await loadChromiumDriver();
 
 await legacyRayCharles.runTests(driver_for_ray_charles);
 await gutenbergRo.runTests(driver_for_gutenberg);
+await tonedearTests.runTests(driver_for_tonedear);

tests/e2e/runners/edge/edge18.bs.runner.js

@@ -1,11 +1,13 @@
 import { Builder } from 'selenium-webdriver';
 import legacyRayCharles from '../../spec/legacy-ray_charles.e2e.spec.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedear from '../../spec/tonedear.e2e.spec.js';
 
 /* eslint-disable camelcase */
 
 // Input capabilities
 const capabilities = {
+    'browserstack.idleTimeout': 300,
     'bstack:options': {
         os: 'Windows',
         osVersion: '10',
@@ -35,8 +37,10 @@ async function loadEdgeLegacyDriver () {
     return driver;
 };
 
-const driver_edge_legacy = await loadEdgeLegacyDriver();
-await legacyRayCharles.runTests(driver_edge_legacy);
+// For this runner, we must use a single driver for all tests to avoid the other drivers
+// timing out while earlier tests complete
+const singleDriver = await loadEdgeLegacyDriver();
 
-const driver_edge_gutenberg = await loadEdgeLegacyDriver();
-await gutenbergRo.runTests(driver_edge_gutenberg);
+await legacyRayCharles.runTests(singleDriver, null, true);
+await gutenbergRo.runTests(singleDriver, null, true);
+await tonedear.runTests(singleDriver);

tests/e2e/runners/edge/ieMode.e2e.runner.js

@@ -2,6 +2,7 @@ import { Builder } from 'selenium-webdriver';
 import { Options } from 'selenium-webdriver/ie.js';
 import legacyRayCharles from '../../spec/legacy-ray_charles.e2e.spec.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedear from '../../spec/tonedear.e2e.spec.js';
 
 /* eslint-disable camelcase */
 
@@ -18,3 +19,4 @@ async function loadIEModeDriver () {
 
 await legacyRayCharles.runTests(await loadIEModeDriver(), ['jquery']);
 await gutenbergRo.runTests(await loadIEModeDriver(), ['jquery']);
+await tonedear.runTests(await loadIEModeDriver(), ['jquery']);

tests/e2e/runners/edge/microsoftEdge.e2e.runner.js

@@ -2,6 +2,7 @@ import { Builder } from 'selenium-webdriver';
 import { Options } from 'selenium-webdriver/edge.js';
 import legacyRayCharles from '../../spec/legacy-ray_charles.e2e.spec.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedearTests from '../../spec/tonedear.e2e.spec.js';
 /* eslint-disable camelcase */
 
 async function loadMSEdgeDriver () {
@@ -17,10 +18,12 @@ async function loadMSEdgeDriver () {
     return driver;
 };
 
-// Preserve the order of loading, because when a user runs these on local machine, the second driver will be on top of and cover the first one
-// so we need to use the second one first
+// Preserve the order of loading, because when a user runs these on local machine, the third driver will be on top of and cover the first one
+// so we need to use the third one first
+const driver_for_tonedear = await loadMSEdgeDriver();
 const driver_for_gutenberg = await loadMSEdgeDriver();
 const driver_for_ray_charles = await loadMSEdgeDriver();
 
 await legacyRayCharles.runTests(driver_for_ray_charles);
 await gutenbergRo.runTests(driver_for_gutenberg);
+await tonedearTests.runTests(driver_for_tonedear);

tests/e2e/runners/firefox/firefox.e2e.runner.js

@@ -2,6 +2,7 @@ import { Builder } from 'selenium-webdriver';
 import firefox from 'selenium-webdriver/firefox.js';
 import legacyRayCharles from '../../spec/legacy-ray_charles.e2e.spec.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedearTests from '../../spec/tonedear.e2e.spec.js';
 import paths from '../../paths.js';
 
 /* eslint-disable camelcase */
@@ -23,10 +24,12 @@ async function loadFirefoxDriver () {
     return driver;
 };
 
-// Preserve the order of loading, because when a user runs these on local machine, the second driver will be on top of and cover the first one
-// so we need to use the second one first
+// Preserve the order of loading, because when a user runs these on local machine, the third driver will be on top of and cover the first one
+// so we need to use the third one first
+const driver_for_tonedear = await loadFirefoxDriver();
 const driver_for_gutenberg = await loadFirefoxDriver();
 const driver_for_ray_charles = await loadFirefoxDriver();
 
 await legacyRayCharles.runTests(driver_for_ray_charles);
 await gutenbergRo.runTests(driver_for_gutenberg);
+await tonedearTests.runTests(driver_for_tonedear);

tests/e2e/runners/firefox/firefox70.bs.runner.js

@@ -1,5 +1,6 @@
 import { Builder } from 'selenium-webdriver';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedear from '../../spec/tonedear.e2e.spec.js';
 /* eslint-disable camelcase */
 
 // Input capabilities
@@ -31,9 +32,13 @@ async function loadFirefoxDriver () {
 };
 
 const driver_gutenberg_fx = await loadFirefoxDriver();
+const driver_tonedear_fx = await loadFirefoxDriver();
 
 // Run test in SW mode only
-console.log('\x1b[33m%s\x1b[0m', 'Running Gutenberg tests in ServiceWorker mode only for this browser version');
+console.log('\x1b[33m%s\x1b[0m', 'Running Gutenberg tests in ServiceWorker mode and Tonedear tests in JQuery only for this browser version');
 console.log(' ');
 
-await gutenbergRo.runTests(driver_gutenberg_fx, ['serviceworker']);
+await gutenbergRo.runTests(driver_gutenberg_fx);
+// Skipping Tonedear tests in SW mode for Firefox 70 due to unsupported navigation issues
+// Reason-> Because the browsers below Firefox 77 does not support the replaceAll method, which is used in the Zimit
+await tonedear.runTests(driver_tonedear_fx, ['jquery']);

tests/e2e/runners/safari/safari14.bs.runner.js

@@ -1,6 +1,7 @@
 import { Builder } from 'selenium-webdriver';
 import legacyRayCharles from '../../spec/legacy-ray_charles.e2e.spec.js';
 import gutenbergRo from '../../spec/gutenberg_ro.e2e.spec.js';
+import tonedearTests from '../../spec/tonedear.e2e.spec.js';
 
 /* eslint-disable camelcase */
 
@@ -42,3 +43,6 @@ await legacyRayCharles.runTests(driver_legacy_safari, ['jquery']);
 
 const driver_gutenberg_safari = await loadSafariDriver();
 await gutenbergRo.runTests(driver_gutenberg_safari, ['jquery']);
+
+const driver_tonedear_safari = await loadSafariDriver();
+await tonedearTests.runTests(driver_tonedear_safari, ['jquery']);

tests/e2e/spec/gutenberg_ro.e2e.spec.js

@@ -41,9 +41,10 @@ const gutenbergRoBaseFile = BROWSERSTACK ? '/tests/zims/gutenberg-ro/gutenberg_r
  *  Run the tests
  * @param {WebDriver} driver Selenium WebDriver object
  * @param {Array} modes Array of modes to run the tests in
+ * @param {boolean} keepDriver Whether to keep the driver open after the tests have run
  * @returns {Promise<void>}  A Promise for the completion of the tests
 */
-function runTests (driver, modes) {
+function runTests (driver, modes, keepDriver) {
     let browserName, browserVersion;
     driver.getCapabilities().then(function (caps) {
         browserName = caps.get('browserName');
@@ -180,7 +181,7 @@ function runTests (driver, modes) {
                 } else {
                     // Skip remaining SW mode tests if the browser does not support the SW API
                     console.log('\x1b[33m%s\x1b[0m', '      Skipping SW mode tests because browser does not support API');
-                    await driver.quit();
+                    if (!keepDriver) await driver.quit();
                 }
                 // Disable source verification in SW mode as the dialogue box gave incosistent test results in automated tests
                 if (mode === 'serviceworker') {
@@ -397,8 +398,8 @@ function runTests (driver, modes) {
                 assert.ok(downloadFileStatus);
 
                 // exit if every test and mode is completed
-                if (mode === modes[modes.length - 1]) {
-                    return driver.quit();
+                if (mode === modes[modes.length - 1] && !keepDriver) {
+                    await driver.quit();
                 }
             });
         });

tests/e2e/spec/legacy-ray_charles.e2e.spec.js

@@ -58,9 +58,10 @@ console.log('\nLoading archive:\n' + rayCharlesAllParts + '\n');
  *  Run the tests
  * @param {WebDriver} driver Selenium WebDriver object
  * @param {array} modes Array of modes to run the tests in
+ * @param {boolean} keepDriver Whether to keep the driver open after the tests have run
  * @returns {Promise<void>}  A Promise for the completion of the tests
 */
-function runTests (driver, modes) {
+function runTests (driver, modes, keepDriver) {
     let browserName, browserVersion;
     driver.getCapabilities().then(function (caps) {
         browserName = caps.get('browserName');
@@ -192,7 +193,7 @@ function runTests (driver, modes) {
                 } else {
                     // Skip remaining SW mode tests if the browser does not support the SW API
                     console.log('\x1b[33m%s\x1b[0m', '      Skipping SW mode tests because browser does not support API');
-                    await driver.quit();
+                    if (!keepDriver) await driver.quit();
                 }
                 // Disable source verification in SW mode as the dialogue box gave incosistent test results in automated tests
                 if (mode === 'serviceworker') {
@@ -345,7 +346,7 @@ function runTests (driver, modes) {
                 const title = await driver.findElement(By.id('titleHeading')).getText();
                 assert.equal('Ray Charles', title);
                 // If we have reached the last mode, quit the driver
-                if (mode === modes[modes.length - 1]) {
+                if (mode === modes[modes.length - 1] && !keepDriver) {
                     await driver.quit();
                 }
             });