Требуется сценарий тестирования версии браузера

Укажите пользователям, на какую версию необходимо перейти для работы программы.

Современные приложения используют новые функции ECMAScript 6, такие как обещанные, методы Array, поэтому необходимо указать пользователю, когда его браузер не поддерживает функцию, что ее следует обновить, и какую по крайней мере версию поддерживает.

Сценарий, который мы предлагаем, основан на следующей таблице реализаций...

Функция Хром Android IE/Edge Firefox Сафари
Обещаемая 32 4.4.4 Кромка 29 7.1
Array.map 47 4.4 IE9 1.5 9
Array.lastIndexOf 47 4.4 IE9 44 9
Object.keys 5 4.4 IE9 4.2 5
ArrayBuffer 7 4.3 IE10 4 5.1
JSON 1

4.3

 IE8 3.5 4
WebSocket 16 4.4 IE10 6 6
SVG 1 4.4 IE9 1.5 3

Эти версии размещаются на сайте Mozilla, когда они доступны.

Демонстрация...

Отображается navigator.userAgent, а затем имя текущего браузера.

Исходный код для определения текущего браузера:

var browsers = ["Firefox","MSIE","Trident","Edge","Chrome","Safari", "Android"];

function getBrowser(bname) {
  var ua = navigator.userAgent;
  for(var b in browsers) {
    b = browsers[b];
      if(ua.indexOf(b) != -1) return b;
  }	
  return false;
}

var browser = getBrowser();
if(browser == "Trident"|| browser=="MSIE") browser="IE/Edge";
if (browser === false) {
  document.write("Navigateur inconnu.");
} else {
  document.write("Votre navigateur: " + browser);
}

Общий сценарий для определения требуемой версии

Теперь, когда мы знаем браузер, остается в случае несовместимости найти первую совместимую версию. В идеале мы будем скачивать последнюю версию, но это не всегда возможно для пользователя, например, он не может установить Edge, если у него нет Windows 10.

Для этого приведенная выше таблица преобразуется в объект JavaScript.

var feature = { "Promise":0, "Array.map":1, "Array.lastIndexOf":2, "Object.keys":3, "ArrayBuffer":4, "JSON":5, "WebSocket":6, "SVG":7};
var kbrowser = {"Chrome":0, "Android":1, "IE/Edge":2, "Firefox":3, "Safari":4};

var versions = [
 ["32","4.4.4","Edge","29","7.1"],
 ["47","4.4","IE9","1.5","9"],
 ["47","4.4","IE9","44","9"],
 ["5","4.4","IE9","4.2","5"],
 ["7","4.3","IE10","4","5.1"],
 ["1","4.3","IE8","3.5","4"],
 ["16","4.4","IE10","6","6"],
 ["1","4.4","IE9","1.5","3"]
];

var minVersion = "0";

function versionRequired(fea, bro) {
  var row = feature[fea];
  var column = kbrowser[bro];
  var v = versions[row][column]
  if(v > minVersion)
    minVersion = v;
  return minVersion;	
}

Показ

Проверяется, что объект JSON реализован в текущем браузере, в противном случае указывается первая версия, которая его реализует .

if (typeof JSON !== 'object' || typeof JSON.parse !== 'function') { 
  document.write("Version requise : " + versionRequired("JSON", browser));
}
else {
  document.write("JSON implémenté.");
}

Теперь мы можем провести ряд тестов...

Результат

Исходный код теста

if(typeof Array.prototype.map !== "function") versionRequired("Array.map", browser);

if(typeof Array.prototype.lastIndexOf !== "function") versionRequired("Array.lastIndexOf", browser);

if(typeof Object.keys !== "function")  versionRequired("Object.keys", browser);

if (typeof JSON !== 'object' || typeof JSON.parse !== 'function')  versionRequired("JSON", browser)

if (typeof ArrayBuffer !== 'function')  versionRequired("ArrayBuffer", browser);

if (typeof WebSocket !== 'function')  versionRequired("WebSocket", browser);

if(typeof SVGRect === "undefined")  versionRequired("SVG", browser);

if(typeof Promise === "undefined")  versionRequired("Promise", browser);

if(minVersion == "") {
  document.write("Tout est implémenté.");
} else {
 document.write("Pour utiliser " + browser + " il vous faut au moins la version " + minVersion);
}

Чтобы настроить тесты, добавляйте строки в таблицу или убирайте ненужные строки и обновляйте серию тестов в соответствии...

См. также