Browser Check moved to external js file (due to problems with transpiled JS versions)

CHANGELOG

@@ -12,6 +12,9 @@ minerva (12.2.2) stable; urgency=medium
     (#778)
   * Bug fix: export of custom properties (like synonyms) are properly encoded 
     in CellDesigner xml (#785)
+  * Bug fix: notification about not supported version in IE 11 fixed (#783)
+
+ -- Piotr Gawron <piotr.gawron@uni.lu>  Tue, 9 Apr 2019 17:00:00 +0200
 
 minerva (12.2.1) stable; urgency=medium
   * Bug fix: export of reaction colorsi in SBML is properly encoded (COPASI can

frontend-js/package.json

@@ -6,9 +6,10 @@
   "scripts": {
     "build:css": "cleancss --skip-rebase -o dist/minerva.css node_modules/openlayers/dist/ol.css node_modules/dual-listbox/dist/*.css node_modules/multi-checkbox-list/dist/*.css src/main/css/*.css",
     "build:js": "browserify --debug --standalone minerva src/main/js/minerva.js | exorcist dist/minerva.js.map > dist/minerva.js ",
+    "build-browser-check:js": "browserify --debug --standalone BrowserCheck src/main/js/BrowserCheck.js | exorcist dist/BrowserCheck.js.map > dist/BrowserCheck.js ",
     "//": "rm -rf dist & rmdir /q /s dist & mkdir dist & browserify --debug --standalone minerva src/main/js/minerva.js | exorcist dist/minerva.js.map > dist/minerva.js & uglifyjs --compress --mangle --in-source-map dist/minerva.js.map --source-map-include-sources --source-map dist/minerva.min.js.map -o dist/minerva.min.js dist/minerva.js",
     "build-deploy": "npm run build && npm run deploy",
-    "build": "npm run clean && npm run build:css && npm run build:js",
+    "build": "npm run clean && npm run build:css && npm run build:js && npm run build-browser-check:js",
     "clean": "node scripts/clean.js",
     "deploy": "node scripts/deploy.js",
     "refresh-mock-requests": "node scripts/refresh_mock_requests.js",

frontend-js/scripts/deploy.js

@@ -2,5 +2,6 @@ var fs = require('fs');
 
 var tomcatDirectory = process.env.CATALINA_HOME;
 fs.createReadStream('dist/minerva.js').pipe(fs.createWriteStream(tomcatDirectory + '/webapps/minerva/resources/js/minerva.js'));
+fs.createReadStream('dist/BrowserCheck.js').pipe(fs.createWriteStream(tomcatDirectory + '/webapps/minerva/resources/js/BrowserCheck.js'));
 fs.createReadStream('dist/minerva.css').pipe(fs.createWriteStream(tomcatDirectory + '/webapps/minerva/resources/css/minerva.css'));
 

frontend-js/src/main/js/BrowserCheck.js

+function getBrowserInfo() {
+  var browser = {};
+  browser.name = "Unknown";
+  browser.version = "Unknown";
+
+  if (typeof navigator !== 'undefined') {
+    var ua = navigator.userAgent;
+    var msie = ua.indexOf('MSIE ');
+    if (msie >= 0) {
+      browser.name = "IE";
+      // IE 10 or older => return version number
+      browser.version = parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
+    }
+
+    var trident = ua.indexOf('Trident/');
+    if (trident >= 0) {
+      browser.name = "IE";
+      // IE 11 => return version number
+      var rv = ua.indexOf('rv:');
+      browser.version = parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
+    }
+
+    var edge = ua.indexOf('Edge/');
+    if (edge >= 0) {
+      browser.name = "IE";
+      // Edge (IE 12+) => return version number
+      browser.version = parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
+    }
+  }
+  return browser;
+}
+
+function verifyBrowser() {
+  var browser = getBrowserInfo();
+  if (browser.name === "IE") {
+    var message = "This web page might not work in this browser.\n"
+      + "\n" + "Please, use supported browsers: Chrome, Firefox or Safari.";
+    alert(message);
+  }
+}
+
+module.exports = verifyBrowser;

frontend-js/src/main/js/Functions.js

@@ -8,43 +8,6 @@ var logger = require('./logger');
 var xss = require('xss');
 
 function Functions() {
-  /**
-   * In a browser variable we store information about browser user is currently
-   * using. Right now only IE is supported.
-   */
-  this.browser = {
-    init: function () {
-
-      this.name = "Unknown";
-      this.version = "Unknown";
-
-      if (typeof navigator !== 'undefined') {
-        // Get the user agent string
-        var ua = navigator.userAgent;
-        this.compatibilityMode = false;
-        var re;
-        if (navigator.appName === 'Microsoft Internet Explorer') {
-          this.name = "IE";
-          re = new RegExp("MSIE ([0-9]+[\.0-9]*)");
-          if (re.exec(ua) !== undefined && re.exec(ua) !== null) {
-            this.version = parseFloat(RegExp.$1);
-          }
-          if (ua.indexOf("MSIE 7.0") > -1) {
-            this.compatibilityMode = true;
-          }
-        } else if (navigator.appName === 'Netscape') {
-          this.name = "Other";
-          ua = navigator.userAgent;
-          re = new RegExp("Trident/.*rv[ :]*([0-9]{1,}[\.0-9]{0,})");
-          if (re.exec(ua) !== undefined && re.exec(ua) !== null) {
-            this.version = parseFloat(RegExp.$1);
-          }
-        }
-      }
-    }
-  };
-
-  this.browser.init();
 }
 
 /**

frontend-js/src/main/js/minerva.js

@@ -292,25 +292,6 @@ function initGlobals(params) {
 
 }
 
-/**
- *
- */
-function verifyBrowser() {
-
-  var browser = functions.browser;
-  if (browser.name === "IE") {
-    if (browser.version <= 8 || browser.compatibilityMode) {
-      var message = "This web page works only with Internet Explorer version 9 or greater.\n"
-        + "If you have Internet Explorer version 9 or greater and still see this message, please, turn the 'Compatibility mode off:\n"
-        + "Open Internet Explorer and press the Alt key on your keyboard.\n"
-        + "Select 'Tools' menu item. \n"
-        + "Select the 'Compatibility View' settings option. \n"
-        + "Make sure the 'Display all websites in Compatibility View' check box is unchecked and that the 'Compatibility View; list of websites is cleared.\n"
-        + "\n" + "Alternatively, please, use other browsers: Chrome, Firefox or Safari.";
-      GuiConnector.alert(message);
-    }
-  }
-}
 
 /**
  *
@@ -508,8 +489,6 @@ function create(params) {
   }).then(function () {
     var element = params.getElement();
 
-    verifyBrowser();
-
     processUrlGetParams(params);
 
     params.getElement().innerHTML = "";

frontend-js/src/test/js/BrowserCheck-test.js

+"use strict";
+
+require('./mocha-config');
+
+// noinspection JSUnusedLocalSymbols
+var Promise = require("bluebird");
+var BrowserCheck = require("../../main/js/BrowserCheck");
+
+var chai = require('chai');
+var assert = chai.assert;
+
+var originalNavigator = null;
+describe('check browser', function () {
+
+  beforeEach(function () {
+    originalNavigator = global.navigator;
+  });
+
+  afterEach(function () {
+    global.navigator = originalNavigator;
+    global.alert = undefined;
+  });
+
+  it('browser detection simulation with unsupported detection browser', function () {
+    global.alert = function () {
+      assert.notOk("browser info should be fine");
+    };
+    BrowserCheck();
+  });
+
+  it('browser detection simulation with IE', function () {
+    global.navigator = {
+      appName: 'Microsoft Internet Explorer',
+      userAgent: "MSIE 7.0"
+    };
+    var alertCalled = false;
+    global.alert = function () {
+      alertCalled = true;
+    };
+    BrowserCheck();
+    assert.ok(alertCalled, "expected alert with info about invalid browser");
+  });
+
+  it('browser detection simulation with other', function () {
+    global.navigator = {
+      appName: 'Netscape',
+      userAgent: "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:66.0) Gecko/20100101 Firefox/66.0"
+    };
+
+    global.alert = function () {
+      assert.notOk("browser info should be fine");
+    };
+    BrowserCheck();
+  });
+
+});

frontend-js/src/test/js/Functions-test.js

@@ -220,36 +220,4 @@ describe('functions', function () {
     assert.equal(result2, -1);
   });
 
-  it('browser detection simulation with unsupported detection browser', function () {
-    var browser = functions.browser;
-    browser.init();
-    assert.equal(browser.name, "Unknown");
-    assert.equal(browser.version, "Unknown");
-  });
-
-  it('browser detection simulation with IE', function () {
-    global.navigator = {
-      appName: 'Microsoft Internet Explorer',
-      userAgent: "MSIE 7.0"
-    };
-
-    var browser = functions.browser;
-    browser.init();
-    assert.equal(browser.name, "IE");
-    assert.equal(browser.version, "7.0");
-  });
-
-  it('browser detection simulation with other', function () {
-    global.navigator = {
-      appName: 'Netscape',
-      userAgent: "Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv 11.0) like Gecko"
-    };
-
-    var browser = functions.browser;
-    browser.init();
-    assert.equal(browser.name, "Other");
-    assert.equal(browser.version, "11.0");
-    assert.equal(logger.getWarnings().length, 0);
-  });
-
 });

web/src/main/webapp/index.xhtml

@@ -27,6 +27,7 @@
 
 		<link rel="shortcut icon" href="./resources/images/favicon.png" type="image/png" />
 
+		<h:outputScript library="js" name="BrowserCheck.js"  />
 		<h:outputScript library="js" name="minerva.js"  />
 
 		<script type="text/javascript">
@@ -47,6 +48,7 @@
 			});
 
 			function initMap(){
+				BrowserCheck();
 				var element = document.getElementById('minervaAppDiv');
 				return minerva.create({
 					element : element,