making legacy.js work even on IE 6 by avoiding jQuery

This commit is contained in:
El RIDO 2019-09-18 07:31:32 +02:00
parent 5810f17c31
commit 4332d0edb0
No known key found for this signature in database
GPG Key ID: 0F5C940A6BD81F92
6 changed files with 82 additions and 71 deletions

View File

@ -19,8 +19,8 @@ global.prettyPrintOne = window.PR.prettyPrintOne;
global.showdown = require('./showdown-1.9.1'); global.showdown = require('./showdown-1.9.1');
global.DOMPurify = require('./purify-1.0.11'); global.DOMPurify = require('./purify-1.0.11');
global.baseX = require('./base-x-3.0.5.1').baseX; global.baseX = require('./base-x-3.0.5.1').baseX;
global.Legacy = require('./legacy').Legacy;
require('./bootstrap-3.3.7'); require('./bootstrap-3.3.7');
require('./legacy');
require('./privatebin'); require('./privatebin');
// internal variables // internal variables

View File

@ -12,26 +12,19 @@
* *
* IMPORTANT NOTICE FOR DEVELOPERS: * IMPORTANT NOTICE FOR DEVELOPERS:
* The logic in this file is intended to run in legacy browsers. Avoid any use of: * The logic in this file is intended to run in legacy browsers. Avoid any use of:
* - ES6 or newer in general * - jQuery (doesn't work in older browsers)
* - ES5 or newer in general
* - const/let, use the traditional var declarations instead * - const/let, use the traditional var declarations instead
* - async/await or Promises, use traditional callbacks * - async/await or Promises, use traditional callbacks
* - shorthand function notation "() => output", use the full "function() {return output;}" style * - shorthand function notation "() => output", use the full "function() {return output;}" style
* - IE doesn't support: * - IE doesn't support:
* - URL(), use the traditional window.location object * - URL(), use the traditional window.location object
* - endsWith(), use indexof() * - endsWith(), use indexof()
* - yes, this logic needs to support IE 5 or 6, to at least display the error message * - yes, this logic needs to support IE 6, to at least display the error message
*/ */
// main application start, called when DOM is fully loaded
jQuery(document).ready(function() {
'use strict'; 'use strict';
// run main controller (function() {
$.Legacy.Check.init();
});
jQuery.Legacy = (function($) {
'use strict';
/** /**
* compatibility check * compatibility check
* *
@ -198,23 +191,29 @@ jQuery.Legacy = (function($) {
*/ */
function showError(message) function showError(message)
{ {
var $error = $('#errormessage'), var element = document.getElementById('errormessage');
$glyphIcon = $error.find(':first'),
$element;
if ($glyphIcon.length) {
// if there is an icon, we need to provide an inner element
// to translate the message into, instead of the parent
$element = $('<span>');
$error.html(' ').prepend($glyphIcon).append($element);
} else {
$element = $error;
}
if (message.indexOf('<a') === -1) { if (message.indexOf('<a') === -1) {
$element.text(message); element.appendChild(
document.createTextNode(message)
);
} else { } else {
$element.html(message); element.innerHTML = message;
} }
$error.removeClass('hidden'); removeHiddenFromId('errormessage');
}
/**
* removes "hidden" CSS class from element with given ID
*
* @private
* @name Check.removeHiddenFromId
* @param {string} id
* @function
*/
function removeHiddenFromId(id)
{
var element = document.getElementById(id);
if (element) element.className = element.className.replace(/\bhidden\b/g, '');
} }
/** /**
@ -267,13 +266,13 @@ jQuery.Legacy = (function($) {
) )
); );
} }
$('#oldnotice').removeClass('hidden'); removeHiddenFromId('oldnotice');
init = true; init = true;
return; return;
} }
if (!isSecureContext()) { if (!isSecureContext()) {
$('#httpnotice').removeClass('hidden'); removeHiddenFromId('httpnotice');
} }
init = true; init = true;
@ -284,7 +283,23 @@ jQuery.Legacy = (function($) {
return me; return me;
})(); })();
return { // main application start, called when DOM is fully loaded
if (document.readyState === 'complete' || (!document.attachEvent && document.readyState === 'interactive')) {
Check.init();
} else {
if (document.addEventListener) {
// first choice is DOMContentLoaded event
document.addEventListener('DOMContentLoaded', Check.init, false);
// backup is window load event
window.addEventListener('load', Check.init, false);
} else {
// must be IE
document.attachEvent('onreadystatechange', Check.init);
window.attachEvent('onload', Check.init);
}
}
this.Legacy = {
Check: Check Check: Check
}; };
})(jQuery); }).call(this);

View File

@ -4926,12 +4926,12 @@ jQuery.PrivateBin = (function($, RawDeflate) {
UiHelper.init(); UiHelper.init();
// check for legacy browsers before going any further // check for legacy browsers before going any further
if (!$.Legacy.Check.getInit()) { if (!Legacy.Check.getInit()) {
// Legacy check didn't complete, wait and try again // Legacy check didn't complete, wait and try again
setTimeout(init, 500); setTimeout(init, 500);
return; return;
} }
if (!$.Legacy.Check.getStatus()) { if (!Legacy.Check.getStatus()) {
// something major is wrong, stop right away // something major is wrong, stop right away
return; return;
} }

View File

@ -1,6 +1,6 @@
'use strict'; 'use strict';
var common = require('../common'); var common = require('../common');
/* global WebCrypto */ /* global Legacy, WebCrypto */
describe('Check', function () { describe('Check', function () {
describe('init', function () { describe('init', function () {
@ -15,17 +15,15 @@ describe('Check', function () {
jsc.elements(['Bot', 'bot']), jsc.elements(['Bot', 'bot']),
'string', 'string',
function (prefix, botBit, suffix) { function (prefix, botBit, suffix) {
const clean = jsdom('', { const clean = jsdom(
'userAgent': prefix + botBit + suffix
});
$('body').html(
'<html><body><div id="errormessage" class="hidden"></div>' + '<html><body><div id="errormessage" class="hidden"></div>' +
'</body></html>' '</body></html>', {
'userAgent': prefix + botBit + suffix
}
); );
$.PrivateBin.Alert.init(); Legacy.Check.init();
$.Legacy.Check.init(); const result1 = Legacy.Check.getInit() && !Legacy.Check.getStatus(),
const result1 = $.Legacy.Check.getInit() && !$.Legacy.Check.getStatus(), result2 = (document.getElementById('errormessage').className !== 'hidden');
result2 = !$('#errormessage').hasClass('hidden');
clean(); clean();
return result1 && result2; return result1 && result2;
} }
@ -42,19 +40,18 @@ describe('Check', function () {
function (secureProtocol, localhost, domain, tld) { function (secureProtocol, localhost, domain, tld) {
const isDomain = localhost === '', const isDomain = localhost === '',
isSecureContext = secureProtocol || !isDomain || tld.length > 0, isSecureContext = secureProtocol || !isDomain || tld.length > 0,
clean = jsdom('', { clean = jsdom(
'<html><body><div id="errormessage" class="hidden"></div>' +
'<div id="oldnotice" class="hidden"></div></body></html>',
{
'url': (secureProtocol ? 'https' : 'http' ) + '://' + 'url': (secureProtocol ? 'https' : 'http' ) + '://' +
(isDomain ? domain.join('') + tld : localhost) + '/' (isDomain ? domain.join('') + tld : localhost) + '/'
}); }
$('body').html(
'<html><body><div id="errormessage" class="hidden"></div>'+
'<div id="oldnotice" class="hidden"></div></body></html>'
); );
$.PrivateBin.Alert.init(); Legacy.Check.init();
$.Legacy.Check.init(); const result1 = Legacy.Check.getInit() && !Legacy.Check.getStatus(),
const result1 = $.Legacy.Check.getInit() && !$.Legacy.Check.getStatus(), result2 = isSecureContext === (document.getElementById('errormessage').className === 'hidden'),
result2 = isSecureContext === $('#errormessage').hasClass('hidden'), result3 = (document.getElementById('oldnotice').className !== 'hidden');
result3 = !$('#oldnotice').hasClass('hidden');
clean(); clean();
return result1 && result2 && result3; return result1 && result2 && result3;
} }
@ -65,18 +62,17 @@ describe('Check', function () {
'bool', 'bool',
jsc.nearray(common.jscA2zString()), jsc.nearray(common.jscA2zString()),
function (secureProtocol, domain) { function (secureProtocol, domain) {
const clean = jsdom('', { const clean = jsdom(
'url': (secureProtocol ? 'https' : 'http' ) + '://' + domain.join('') + '/'
});
$('body').html(
'<html><body><div id="httpnotice" class="hidden"></div>' + '<html><body><div id="httpnotice" class="hidden"></div>' +
'</body></html>' '</body></html>',
{
'url': (secureProtocol ? 'https' : 'http' ) + '://' + domain.join('') + '/'
}
); );
window.crypto = new WebCrypto(); window.crypto = new WebCrypto();
$.PrivateBin.Alert.init(); Legacy.Check.init();
$.Legacy.Check.init(); const result1 = Legacy.Check.getInit() && Legacy.Check.getStatus(),
const result1 = $.Legacy.Check.getInit() && $.Legacy.Check.getStatus(), result2 = secureProtocol === (document.getElementById('httpnotice').className === 'hidden');
result2 = secureProtocol === $('#httpnotice').hasClass('hidden');
clean(); clean();
return result1 && result2; return result1 && result2;
} }

View File

@ -71,8 +71,8 @@ if ($MARKDOWN):
endif; endif;
?> ?>
<script type="text/javascript" data-cfasync="false" src="js/purify-1.0.11.js" integrity="sha512-p7UyJuyBkhMcMgE4mDsgK0Lz70OvetLefua1oXs1OujWv9gOxh4xy8InFux7bZ4/DAZsTmO4rgVwZW9BHKaTaw==" crossorigin="anonymous"></script> <script type="text/javascript" data-cfasync="false" src="js/purify-1.0.11.js" integrity="sha512-p7UyJuyBkhMcMgE4mDsgK0Lz70OvetLefua1oXs1OujWv9gOxh4xy8InFux7bZ4/DAZsTmO4rgVwZW9BHKaTaw==" crossorigin="anonymous"></script>
<script type="text/javascript" data-cfasync="false" src="js/legacy.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-tujqWT2EpSr9Iw6z9ET4P7x4lO6hMT+ccqVvWsq9lZjgbWa52AcML4MMiK6/VNFGna9i1IlyvloY9vBf3HH9XQ==" crossorigin="anonymous"></script> <script type="text/javascript" data-cfasync="false" src="js/legacy.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-mLqRoF9An6JCayodTEduwZLCissP4ItBQmNl1FCN8tgFlnOa0pd5Lu6SOJTDJaWVkiBf87FkLu3hq5LFV8p0jA==" crossorigin="anonymous"></script>
<script type="text/javascript" data-cfasync="false" src="js/privatebin.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-qJ7Lfyl7375UWjsItSmAUFwhvynGHUy9U1ldU2OCpFOr5YWhAluEIN0/8ztO7p+5DcljE3wYst1b0ZBiVBEnag==" crossorigin="anonymous"></script> <script type="text/javascript" data-cfasync="false" src="js/privatebin.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-4iMFqnyyoJ/FJ33aHov+QeItaZ0JegMUjx7J5pXeknEwjXzx4oLw9F9ePI3WK/h3sUYTOK+hdv2JINNGMwi2Vg==" crossorigin="anonymous"></script>
<!--[if IE]> <!--[if IE]>
<style type="text/css">body {padding-left:60px;padding-right:60px;} #ienotice {display:block;}</style> <style type="text/css">body {padding-left:60px;padding-right:60px;} #ienotice {display:block;}</style>
<![endif]--> <![endif]-->

View File

@ -49,8 +49,8 @@ if ($MARKDOWN):
endif; endif;
?> ?>
<script type="text/javascript" data-cfasync="false" src="js/purify-1.0.11.js" integrity="sha512-p7UyJuyBkhMcMgE4mDsgK0Lz70OvetLefua1oXs1OujWv9gOxh4xy8InFux7bZ4/DAZsTmO4rgVwZW9BHKaTaw==" crossorigin="anonymous"></script> <script type="text/javascript" data-cfasync="false" src="js/purify-1.0.11.js" integrity="sha512-p7UyJuyBkhMcMgE4mDsgK0Lz70OvetLefua1oXs1OujWv9gOxh4xy8InFux7bZ4/DAZsTmO4rgVwZW9BHKaTaw==" crossorigin="anonymous"></script>
<script type="text/javascript" data-cfasync="false" src="js/legacy.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-tujqWT2EpSr9Iw6z9ET4P7x4lO6hMT+ccqVvWsq9lZjgbWa52AcML4MMiK6/VNFGna9i1IlyvloY9vBf3HH9XQ==" crossorigin="anonymous"></script> <script type="text/javascript" data-cfasync="false" src="js/legacy.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-mLqRoF9An6JCayodTEduwZLCissP4ItBQmNl1FCN8tgFlnOa0pd5Lu6SOJTDJaWVkiBf87FkLu3hq5LFV8p0jA==" crossorigin="anonymous"></script>
<script type="text/javascript" data-cfasync="false" src="js/privatebin.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-qJ7Lfyl7375UWjsItSmAUFwhvynGHUy9U1ldU2OCpFOr5YWhAluEIN0/8ztO7p+5DcljE3wYst1b0ZBiVBEnag==" crossorigin="anonymous"></script> <script type="text/javascript" data-cfasync="false" src="js/privatebin.js?<?php echo rawurlencode($VERSION); ?>" integrity="sha512-4iMFqnyyoJ/FJ33aHov+QeItaZ0JegMUjx7J5pXeknEwjXzx4oLw9F9ePI3WK/h3sUYTOK+hdv2JINNGMwi2Vg==" crossorigin="anonymous"></script>
<!--[if IE]> <!--[if IE]>
<style type="text/css">body {padding-left:60px;padding-right:60px;} #ienotice {display:block;}</style> <style type="text/css">body {padding-left:60px;padding-right:60px;} #ienotice {display:block;}</style>
<![endif]--> <![endif]-->