Fix iOS and Safari test issues

Author: adriaandotcom

.env-default

@@ -8,6 +8,7 @@ LOCATION=developer_x
 
 # Define a test browser on local machine
 DEV_LIMIT=1
+DEV_NAME=
 DEV_BROWSER=
 DEV_BROWSER_VERSION=
 DEV_OS=ios

package.json

@@ -8,7 +8,7 @@
     "watch": "node_modules/.bin/nodemon compile.js --ignore dist",
     "build": "node compile.js",
     "pretest": "npm run build -- testing",
-    "test": "if [ ! $BROWSERSTACK_USERNAME ]; then node -r dotenv/config ./test/index.js; else node ./test/index.js; fi",
+    "test": "node -r dotenv/config ./test/index.js",
     "posttest": "npm run build"
   },
   "repository": {

src/default.js

@@ -33,7 +33,7 @@
     var doNotTrack = "doNotTrack";
     var nav = window.navigator;
     var loc = window.location;
-    var locationHostname = loc.hostname;
+    var locationHostname = loc.host;
     var doc = window.document;
     var userAgent = nav.userAgent;
     var notSending = "Not sending request ";

test/constants/browserstack.js

@@ -34,6 +34,7 @@ module.exports.BS_CAPABILITIES = {
   "browserstack.console": "disable",
   "browserstack.networkLogs": "true",
   "browserstack.ie.noFlash": "true",
+  "browserstack.idleTimeout": 20,
   "browserstack.localIdentifier": BROWSERSTACK_LOCAL_IDENTIFIER,
   "browserstack.user": BROWSERSTACK_USERNAME,
   "browserstack.key": BROWSERSTACK_ACCESS_KEY,

test/helpers/index.js

@@ -9,23 +9,10 @@ const log = (...messages) =>
 
 module.exports.sleep = promisify(setTimeout);
 
-module.exports.getIPv4 = () =>
-  new Promise((resolve, reject) => {
-    const networkInterfaces = getNetworkInterfaces();
-    const publicIPv4s = Object.keys(networkInterfaces)
-      .reduce((interfaces, name) => {
-        interfaces.push(...networkInterfaces[name]);
-        return interfaces;
-      }, [])
-      .filter(({ family, internal }) => {
-        return family === "IPv4" && !internal;
-      });
-    if (publicIPv4s.length) return resolve(publicIPv4s[0].address);
-    return reject(Error("No local IPv4 address found"));
-  });
-
-module.exports.getLocalhost = async ({ useLocalIp = false } = {}) =>
-  `${useLocalIp ? `${await this.getIPv4()}` : "localhost"}`;
+module.exports.getLocalhost = async ({ browser, os } = {}) => {
+  if (os === "ios" || browser === "safari") return "bs-local.com";
+  return "localhost";
+};
 
 module.exports.generateRandomString = (length = 30) =>
   crypto.randomBytes(Math.ceil(length / 2)).toString("hex");
@@ -47,15 +34,9 @@ module.exports.makeUnique = (array = [], keys = []) => {
   }, []);
 };
 
-module.exports.navigate = async ({
-  browser,
-  name,
-  useLocalIp,
-  driver,
-  commands,
-}) => {
+module.exports.navigate = async ({ browser, os, name, driver, commands }) => {
   const localhost =
-    `http://` + (await this.getLocalhost({ useLocalIp })) + ":" + SERVER_PORT;
+    `http://` + (await this.getLocalhost({ os, browser })) + ":" + SERVER_PORT;
 
   for (const {
     sleep: sleepMs = 0,
@@ -83,6 +64,7 @@ module.exports.navigate = async ({
       medium: "medium",
       ref: "ref",
       browser,
+      os,
     }).toString();
 
     if (sleepMs) {

test/helpers/server.js

@@ -19,6 +19,7 @@ const bool = (input) => {
 const route = async (req, res) => {
   const { pathname, query } = url.parse(req.url, true);
   const {
+    os,
     browser,
     script,
     redirect = true,
@@ -79,24 +80,26 @@ const route = async (req, res) => {
   if (pathname === "/script.js" && script) {
     res.writeHead(200, { "Content-Type": "text/javascript" });
     body = readFileSync(`./dist${script}`, "utf8");
-    if (CI) {
-      body = body.replace(/"https:\/\/queue\."/g, '"http://"');
-      body = body.replace(
-        /"simpleanalyticscdn\.com"/g,
-        `"localhost:${SERVER_PORT}"`
-      );
-    } else {
-      body = body.replace(/"https:/gi, `"http:`);
-      body = body.replace(/"simpleanalyticscdn.com"/gi, `"localhost"`);
-    }
+
+    const localhost =
+      os === "ios" || browser === "safari"
+        ? `bs-local.com:${SERVER_PORT}`
+        : `localhost:${SERVER_PORT}`;
+
+    body = body.replace(/"https:\/\/queue\."/g, '"http://"');
+    body = body.replace(/"simpleanalyticscdn\.com"/g, `"${localhost}"`);
+
     res.write(body);
     return res.end();
   }
 
   res.writeHead(200, { "Content-Type": "text/html" });
   body = `<!DOCTYPE html>
     <html>
-      <head><title>Simple Analytics Test</title></head>
+      <head>
+        <title>Simple Analytics Test</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+      </head>
       <body style="height: 300vh;">
         <h1>Path: ${pathname}</h1>`;
 
@@ -125,18 +128,22 @@ const route = async (req, res) => {
   }
 
   if (script) {
-    const params = script ? new URLSearchParams({ script }).toString() : "";
+    const params = new URLSearchParams({ script, browser, os }).toString();
     const attributes = ["defer", "async"];
     if (allowparams) attributes.push(`data-allow-params="${allowparams}"`);
     const attr = attributes.join(" ");
     const host =
-      browser === "ie"
-        ? `http://localhost:${SERVER_PORT}`
+      os === "ios" || browser === "safari"
+        ? `http://bs-local.com:${SERVER_PORT}`
         : `http://localhost:${SERVER_PORT}`;
     const scriptHTML = `<script ${attr} src="${host}/script.js?${params}"></script>`;
     body += scriptHTML;
+    body += `<p><code>&lt;script ${attr} src="${host}/script.js?${params}"&gt;&lt;/script&gt;</code></p>`;
   }
 
+  body += `<p>OS: ${os}</p>`;
+  body += `<p>Browser: ${browser}</p>`;
+
   body += `</body></html>`;
 
   res.write(body);

test/index.js

@@ -18,6 +18,7 @@ const {
 } = require("./constants/browserstack");
 
 const {
+  DEV_NAME,
   DEV_BROWSER,
   DEV_BROWSER_VERSION,
   DEV_OS,
@@ -36,13 +37,10 @@ const matches = (param, search) => {
   return search && search.toLowerCase() !== param?.toLowerCase();
 };
 
-const localBrowserFilter = ({
-  device,
-  os,
-  os_version,
-  browser,
-  browser_version,
-}) => {
+const localBrowserFilter = (options) => {
+  const { device, os, os_version, browser, browser_version } = options;
+  const name = getDeviceName(options);
+  if (matches(name, DEV_NAME)) return false;
   if (matches(device, DEV_DEVICE)) return false;
   if (matches(os, DEV_OS)) return false;
   if (matches(os_version, DEV_OS_VERSION)) return false;
@@ -79,6 +77,7 @@ const setTimezoneSupport = ({ device, os, os_version }) => {
   const osMajorVersion = getMajorVersion(os_version);
   if (os === "android" && device.includes("Samsung") && osMajorVersion >= 12)
     return false;
+  if (os === "ios" && osMajorVersion < 13) return false;
   return true;
 };
 
@@ -107,8 +106,6 @@ const getDriverWithTimeout = (capabilitiesRaw, timeout = 1080000) =>
     delete capabilities.supportsClientHints;
     delete capabilities.useLocalIp;
 
-    console.log(JSON.stringify({ capabilities }, null, 2));
-
     const start = Date.now();
     let responded = false;
 
@@ -257,8 +254,6 @@ const getDeviceName = ({
 
       let driver = await getDriverWithTimeout(driverOptions);
 
-      console.log({ driver, typeof: typeof driver?.get });
-
       // Try again with new device when driver is not available
       if (typeof driver?.get !== "function") {
         driver = await getDriverWithTimeout(driverOptions);

test/test-events.js

@@ -23,8 +23,8 @@ module.exports = async ({ os, browser }) => {
 
   expect(
     new Date(JSON.parse(requests[2].body.metadata).date),
-    "Event should have a date in the last 60 seconds"
-  ).to.greaterThan(new Date(Date.now() - 60000));
+    "Event should have a date in the last 5 minutes"
+  ).to.greaterThan(new Date(Date.now() - 300000));
 
   requests.map((request) => {
     expect(
@@ -54,21 +54,16 @@ module.exports = async ({ os, browser }) => {
       "page_id should be a valid UUIDv4"
     ).to.be.true;
 
-    if (os === "ios") {
-      expect(
-        /[0-9]+\.[0-9]+\.[0-9]+\.[0-9]+/.test(request.body.hostname),
-        "Hostname should be an IP on iOS"
-      ).to.be.true;
-    } else if (os === "OS X" && browser === "safari") {
+    if (os === "ios" || browser === "safari") {
       expect(
         request.body.hostname,
         "Hostname should be bs-local.com on OS X Safari"
-      ).to.equal("bs-local.com");
+      ).to.equal("bs-local.com:3000");
     } else {
       expect(
         request.body.hostname,
         "Hostname should be localhost on non iOS"
-      ).to.equal("localhost");
+      ).to.equal("localhost:3000");
     }
 
     expect(

test/test-no-pushstate.js

@@ -9,18 +9,22 @@ module.exports = async () => {
     body: { type: "pageview" },
   });
 
+  console.log(JSON.stringify(pageViewRequests, null, 2));
+
   expect(
     pageViewRequests,
     "There are not enough page views requests found"
   ).to.have.lengthOf(2);
 
-  expect([true, "true"], "The first visit should be unique").to.include(
-    pageViewRequests[0].body.unique
-  );
+  expect(
+    pageViewRequests[0].body.unique,
+    "The first visit should be unique"
+  ).to.equal("true");
 
-  expect([false, "false"], "The second visit should not be unique").to.include(
-    pageViewRequests[1].body.unique
-  );
+  expect(
+    pageViewRequests[1].body.unique,
+    "The second visit should not be unique"
+  ).to.equal("false");
 
   pageViewRequests.map((request) => {
     expect(
@@ -54,10 +58,7 @@ module.exports = async () => {
       "Version should be a valid number"
     ).to.be.a("number");
 
-    // We replace "https:" with "http:" string in server.js
-    // that's why we expect local request to be https
-    expect([true, "true"], "HTTPS should be a boolean").to.include(
-      request.body.https
-    );
+    // We replace "https:" with "http:" string on CI
+    expect(request.body.https, "HTTPS should be a boolean").to.equal("false");
   });
 };

test/test-pushstate.js

@@ -1,5 +1,6 @@
 const { expect } = require("chai");
 const UUIDvalidate = require("uuid-validate");
+const { CI } = require("./constants");
 const { getRequests } = require("./helpers");
 
 module.exports = async () => {
@@ -63,10 +64,7 @@ module.exports = async () => {
       "Version should be a valid number"
     ).to.be.a("number");
 
-    // We replace "https:" with "http:" string in server.js
-    // that's why we expect local request to be https
-    expect([false, "false"], "HTTPS should be a boolean").to.include(
-      request.body.https
-    );
+    // We replace "https:" with "http:" string on CI
+    expect(request.body.https, "HTTPS should be a boolean").to.equal("false");
   });
 };