From 2951e5340762eb0ac9faddcfa2a6330a339d907f Mon Sep 17 00:00:00 2001 From: Ain Tohvri Date: Sun, 26 Jul 2020 13:34:11 +0200 Subject: [PATCH] Resolve #167 jQuery Mobile EOL --- .eslintrc.json | 3 +- dist/smartbanner.js | 54 ++++----------------- dist/smartbanner.min.js | 2 +- src/detector.js | 8 +--- src/smartbanner.js | 40 +++------------- test/spec/detector_spec.js | 70 ++------------------------- test/spec/smartbanner_spec.js | 89 ++++++++++------------------------- 7 files changed, 48 insertions(+), 218 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index c4080dc0..fd7112f2 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -2,8 +2,7 @@ "env": { "browser": true, "commonjs": true, - "es6": true, - "jquery": true + "es6": true }, "extends": "eslint:recommended", "parserOptions": { diff --git a/dist/smartbanner.js b/dist/smartbanner.js index 5b685205..45867338 100644 --- a/dist/smartbanner.js +++ b/dist/smartbanner.js @@ -52,7 +52,6 @@ var Bakery = /*#__PURE__*/function () { exports["default"] = Bakery; },{}],2:[function(require,module,exports){ -(function (global){ "use strict"; Object.defineProperty(exports, "__esModule", { @@ -85,16 +84,10 @@ var Detector = /*#__PURE__*/function () { value: function userAgentMatchesRegex(regexString) { return new RegExp(regexString).test(window.navigator.userAgent); } - }, { - key: "jQueryMobilePage", - value: function jQueryMobilePage() { - return typeof global.$ !== 'undefined' && global.$.mobile !== 'undefined' && document.querySelector('.ui-page') !== null; - } }, { key: "wrapperElement", value: function wrapperElement() { - var selector = Detector.jQueryMobilePage() ? '.ui-page' : 'html'; - return document.querySelectorAll(selector); + return document.querySelectorAll('html'); } }]); @@ -103,7 +96,6 @@ var Detector = /*#__PURE__*/function () { exports["default"] = Detector; -}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {}) },{}],3:[function(require,module,exports){ "use strict"; @@ -223,12 +215,6 @@ function handleClickout(event, self) { self.clickout(); } -function handleJQueryMobilePageLoad(event) { - if (!this.positioningDisabled) { - setContentPosition(event.data.height); - } -} - function addEventListeners(self) { var closeIcon = document.querySelector('.js_smartbanner__exit'); closeIcon.addEventListener('click', function (event) { @@ -238,16 +224,6 @@ function addEventListeners(self) { button.addEventListener('click', function (event) { return handleClickout(event, self); }); - - if (_detector["default"].jQueryMobilePage()) { - $(document).on('pagebeforeshow', self, handleJQueryMobilePageLoad); - } -} - -function removeEventListeners() { - if (_detector["default"].jQueryMobilePage()) { - $(document).off('pagebeforeshow', handleJQueryMobilePageLoad); - } } function setContentPosition(value) { @@ -256,23 +232,13 @@ function setContentPosition(value) { for (var i = 0, l = wrappers.length, wrapper; i < l; i++) { wrapper = wrappers[i]; - if (_detector["default"].jQueryMobilePage()) { - if (wrapper.getAttribute(datas.originalTop)) { - continue; - } - - var top = parseFloat(getComputedStyle(wrapper).top); - wrapper.setAttribute(datas.originalTop, isNaN(top) ? 0 : top); - wrapper.style.top = value + 'px'; - } else { - if (wrapper.getAttribute(datas.originalMarginTop)) { - continue; - } - - var margin = parseFloat(getComputedStyle(wrapper).marginTop); - wrapper.setAttribute(datas.originalMarginTop, isNaN(margin) ? 0 : margin); - wrapper.style.marginTop = value + 'px'; + if (wrapper.getAttribute(datas.originalMarginTop)) { + continue; } + + var margin = parseFloat(getComputedStyle(wrapper).marginTop); + wrapper.setAttribute(datas.originalMarginTop, isNaN(margin) ? 0 : margin); + wrapper.style.marginTop = value + 'px'; } } @@ -282,9 +248,7 @@ function restoreContentPosition() { for (var i = 0, l = wrappers.length, wrapper; i < l; i++) { wrapper = wrappers[i]; - if (_detector["default"].jQueryMobilePage() && wrapper.getAttribute(datas.originalTop)) { - wrapper.style.top = wrapper.getAttribute(datas.originalTop) + 'px'; - } else if (wrapper.getAttribute(datas.originalMarginTop)) { + if (wrapper.getAttribute(datas.originalMarginTop)) { wrapper.style.marginTop = wrapper.getAttribute(datas.originalMarginTop) + 'px'; } } @@ -339,8 +303,6 @@ var SmartBanner = /*#__PURE__*/function () { }, { key: "exit", value: function exit() { - removeEventListeners(); - if (!this.positioningDisabled) { restoreContentPosition(); } diff --git a/dist/smartbanner.min.js b/dist/smartbanner.min.js index 740b0f94..89099816 100644 --- a/dist/smartbanner.min.js +++ b/dist/smartbanner.min.js @@ -2,4 +2,4 @@ * smartbanner.js v2.0.0-beta.1 * Copyright © 2020 Ain Tohvri, contributors. Licensed under GPL-3.0. */ -(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i0}function convertToCamelCase(name){var parts=name.split("-");parts.map(function(part,index){if(index>0){parts[index]=part.charAt(0).toUpperCase()+part.substring(1)}});return parts.join("")}var OptionParser=function(){function OptionParser(){_classCallCheck(this,OptionParser)}_createClass(OptionParser,[{key:"parse",value:function parse(){var metas=document.getElementsByTagName("meta");var options={};Array.apply(null,metas).forEach(function(meta){var optionName=null;var name=meta.getAttribute("name");var content=meta.getAttribute("content");if(name&&content&&valid(name)&&content.length>0){optionName=name.split(":")[1];if(optionName.indexOf("-")!==-1){optionName=convertToCamelCase(optionName)}options[optionName]=content}});return options}}]);return OptionParser}();exports["default"]=OptionParser},{}],5:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _optionparser=_interopRequireDefault(require("./optionparser.js"));var _detector=_interopRequireDefault(require("./detector.js"));var _bakery=_interopRequireDefault(require("./bakery.js"));function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function")}}function _defineProperties(target,props){for(var i=0;i\n \n
\n
\n
\n
').concat(this.options.title,'
\n
').concat(this.options.author,'
\n
').concat(this.options.price).concat(this.priceSuffix,'
\n
\n
\n ').concat(this.options.button,"\n ")}},{key:"height",get:function get(){try{return document.querySelector(".js_smartbanner").offsetHeight}catch(error){return 0}}},{key:"platformEnabled",get:function get(){var enabledPlatforms=this.options.enabledPlatforms||DEFAULT_PLATFORMS;return enabledPlatforms&&enabledPlatforms.replace(/\s+/g,"").split(",").indexOf(this.platform)!==-1}},{key:"positioningDisabled",get:function get(){return this.options.disablePositioning==="true"}},{key:"apiEnabled",get:function get(){return this.options.api==="true"}},{key:"userAgentExcluded",get:function get(){if(!this.options.excludeUserAgentRegex){return false}return _detector["default"].userAgentMatchesRegex(this.options.excludeUserAgentRegex)}},{key:"userAgentIncluded",get:function get(){if(!this.options.includeUserAgentRegex){return false}return _detector["default"].userAgentMatchesRegex(this.options.includeUserAgentRegex)}},{key:"hideTtl",get:function get(){return this.options.hideTtl?parseInt(this.options.hideTtl):false}},{key:"hidePath",get:function get(){return this.options.hidePath?this.options.hidePath:"/"}},{key:"parentElement",get:function get(){var parentElement=this.options.parentElement?document.querySelector(this.options.parentElement):null;return parentElement||document.querySelector("body")}}]);return SmartBanner}();exports["default"]=SmartBanner},{"./bakery.js":1,"./detector.js":2,"./optionparser.js":4}]},{},[3]); +(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i0}function convertToCamelCase(name){var parts=name.split("-");parts.map(function(part,index){if(index>0){parts[index]=part.charAt(0).toUpperCase()+part.substring(1)}});return parts.join("")}var OptionParser=function(){function OptionParser(){_classCallCheck(this,OptionParser)}_createClass(OptionParser,[{key:"parse",value:function parse(){var metas=document.getElementsByTagName("meta");var options={};Array.apply(null,metas).forEach(function(meta){var optionName=null;var name=meta.getAttribute("name");var content=meta.getAttribute("content");if(name&&content&&valid(name)&&content.length>0){optionName=name.split(":")[1];if(optionName.indexOf("-")!==-1){optionName=convertToCamelCase(optionName)}options[optionName]=content}});return options}}]);return OptionParser}();exports["default"]=OptionParser},{}],5:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _optionparser=_interopRequireDefault(require("./optionparser.js"));var _detector=_interopRequireDefault(require("./detector.js"));var _bakery=_interopRequireDefault(require("./bakery.js"));function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function")}}function _defineProperties(target,props){for(var i=0;i\n \n
\n
\n
\n
').concat(this.options.title,'
\n
').concat(this.options.author,'
\n
').concat(this.options.price).concat(this.priceSuffix,'
\n
\n
\n ').concat(this.options.button,"\n ")}},{key:"height",get:function get(){try{return document.querySelector(".js_smartbanner").offsetHeight}catch(error){return 0}}},{key:"platformEnabled",get:function get(){var enabledPlatforms=this.options.enabledPlatforms||DEFAULT_PLATFORMS;return enabledPlatforms&&enabledPlatforms.replace(/\s+/g,"").split(",").indexOf(this.platform)!==-1}},{key:"positioningDisabled",get:function get(){return this.options.disablePositioning==="true"}},{key:"apiEnabled",get:function get(){return this.options.api==="true"}},{key:"userAgentExcluded",get:function get(){if(!this.options.excludeUserAgentRegex){return false}return _detector["default"].userAgentMatchesRegex(this.options.excludeUserAgentRegex)}},{key:"userAgentIncluded",get:function get(){if(!this.options.includeUserAgentRegex){return false}return _detector["default"].userAgentMatchesRegex(this.options.includeUserAgentRegex)}},{key:"hideTtl",get:function get(){return this.options.hideTtl?parseInt(this.options.hideTtl):false}},{key:"hidePath",get:function get(){return this.options.hidePath?this.options.hidePath:"/"}},{key:"parentElement",get:function get(){var parentElement=this.options.parentElement?document.querySelector(this.options.parentElement):null;return parentElement||document.querySelector("body")}}]);return SmartBanner}();exports["default"]=SmartBanner},{"./bakery.js":1,"./detector.js":2,"./optionparser.js":4}]},{},[3]); \ No newline at end of file diff --git a/src/detector.js b/src/detector.js index 728d2717..1f4a6b4c 100644 --- a/src/detector.js +++ b/src/detector.js @@ -12,13 +12,7 @@ export default class Detector { return new RegExp(regexString).test(window.navigator.userAgent); } - static jQueryMobilePage() { - return typeof global.$ !== 'undefined' && global.$.mobile !== 'undefined' && document.querySelector('.ui-page') !== null; - } - static wrapperElement() { - let selector = Detector.jQueryMobilePage() ? '.ui-page' : 'html'; - return document.querySelectorAll(selector); + return document.querySelectorAll('html'); } - } diff --git a/src/smartbanner.js b/src/smartbanner.js index 23eaf1cd..ab31ad2d 100644 --- a/src/smartbanner.js +++ b/src/smartbanner.js @@ -19,49 +19,24 @@ function handleClickout(event, self) { self.clickout(); } -function handleJQueryMobilePageLoad(event) { - if (!this.positioningDisabled) { - setContentPosition(event.data.height); - } -} - function addEventListeners(self) { let closeIcon = document.querySelector('.js_smartbanner__exit'); closeIcon.addEventListener('click', (event) => handleExitClick(event, self)); let button = document.querySelector('.js_smartbanner__button'); button.addEventListener('click', (event) => handleClickout(event, self)); - - if (Detector.jQueryMobilePage()) { - $(document).on('pagebeforeshow', self, handleJQueryMobilePageLoad); - } -} - -function removeEventListeners() { - if (Detector.jQueryMobilePage()) { - $(document).off('pagebeforeshow', handleJQueryMobilePageLoad); - } } function setContentPosition(value) { let wrappers = Detector.wrapperElement(); for (let i = 0, l = wrappers.length, wrapper; i < l; i++) { wrapper = wrappers[i]; - if (Detector.jQueryMobilePage()) { - if (wrapper.getAttribute(datas.originalTop)) { - continue; - } - let top = parseFloat(getComputedStyle(wrapper).top); - wrapper.setAttribute(datas.originalTop, isNaN(top) ? 0 : top); - wrapper.style.top = value + 'px'; - } else { - if (wrapper.getAttribute(datas.originalMarginTop)) { - continue; - } - let margin = parseFloat(getComputedStyle(wrapper).marginTop); - wrapper.setAttribute(datas.originalMarginTop, isNaN(margin) ? 0 : margin); - wrapper.style.marginTop = value + 'px'; + if (wrapper.getAttribute(datas.originalMarginTop)) { + continue; } + let margin = parseFloat(getComputedStyle(wrapper).marginTop); + wrapper.setAttribute(datas.originalMarginTop, isNaN(margin) ? 0 : margin); + wrapper.style.marginTop = value + 'px'; } } @@ -69,9 +44,7 @@ function restoreContentPosition() { let wrappers = Detector.wrapperElement(); for (let i = 0, l = wrappers.length, wrapper; i < l; i++) { wrapper = wrappers[i]; - if (Detector.jQueryMobilePage() && wrapper.getAttribute(datas.originalTop)) { - wrapper.style.top = wrapper.getAttribute(datas.originalTop) + 'px'; - } else if (wrapper.getAttribute(datas.originalMarginTop)) { + if (wrapper.getAttribute(datas.originalMarginTop)) { wrapper.style.marginTop = wrapper.getAttribute(datas.originalMarginTop) + 'px'; } } @@ -227,7 +200,6 @@ export default class SmartBanner { } exit() { - removeEventListeners(); if (!this.positioningDisabled) { restoreContentPosition(); } diff --git a/test/spec/detector_spec.js b/test/spec/detector_spec.js index 04be6b75..ad82fe4c 100644 --- a/test/spec/detector_spec.js +++ b/test/spec/detector_spec.js @@ -19,11 +19,7 @@ describe('Detector', function() { const INCLUDE_USER_AGENT_REGEX = '.*iPhone OS [9\\-10].*'; const { JSDOM } = jsdom; - const SCRIPTS_JQUERY_MOBILE = ` - - `; const HTML = ``; - const HTML_WITH_JQUERY_MOBILE = `${SCRIPTS_JQUERY_MOBILE}`; describe('platform', function() { @@ -178,71 +174,15 @@ describe('Detector', function() { }); }); - describe('jQueryMobilePage', function() { - - context('without jQuery Mobile', function() { - - before(function() { - global.window = new JSDOM(HTML).window; - global.document = window.document; - }); - - it('expected to return false', function() { - expect(Detector.jQueryMobilePage()).to.be.false; - }); - - }); - - context('with jQuery Mobile', function() { - - before(function(done) { - global.window = new JSDOM(HTML_WITH_JQUERY_MOBILE, { runScripts: 'dangerously', resources: "usable" }).window; - global.window.conclude = function() { - global.document = window.document; - global.$ = window.jQuery; - done(); - }; - }); - - it('expected to return true', function(done) { - expect(Detector.jQueryMobilePage()).to.be.true; - done(); - }); - - }); - }); - describe('marginedElement', function() { - context('without jQuery Mobile', function() { - - before(function() { - global.window = new JSDOM(HTML).window; - global.document = window.document; - }); - - it('expected to return html element as first item of array', function() { - expect(Detector.wrapperElement()[0]).to.eql(document.querySelector('html')); - }); - + before(function() { + global.window = new JSDOM(HTML).window; + global.document = window.document; }); - context('with jQuery Mobile', function() { - - before(function(done) { - global.window = new JSDOM(HTML_WITH_JQUERY_MOBILE, { runScripts: 'dangerously', resources: "usable" }).window; - global.window.conclude = () => { - global.document = window.document; - global.$ = window.jQuery; - done(); - }; - }); - - it('expected to return ui-page element as first item of array', function(done) { - expect(Detector.wrapperElement()[0]).to.eql(document.querySelector('.ui-page')); - done(); - }); - + it('expected to return html element as first item of array', function() { + expect(Detector.wrapperElement()[0]).to.eql(document.querySelector('html')); }); }); diff --git a/test/spec/smartbanner_spec.js b/test/spec/smartbanner_spec.js index 86d0b95c..908ef319 100644 --- a/test/spec/smartbanner_spec.js +++ b/test/spec/smartbanner_spec.js @@ -133,11 +133,6 @@ describe('SmartBanner', function() { `; const SCRIPTS = ''; - const SCRIPTS_JQUERY_MOBILE = ` - - `; - const HTML_WITH_JQUERY_MOBILE = `${SCRIPTS_JQUERY_MOBILE}`; - const HTML_WITH_JQUERY_MOBILE_AND_META = `${HEAD}${SCRIPTS_JQUERY_MOBILE}`; const IOS_BODY = `
@@ -724,69 +719,37 @@ describe('SmartBanner', function() { describe('exit', function() { - context('without jQuery Mobile', function() { - - beforeEach(function() { - const resourceLoader = new jsdom.ResourceLoader({ userAgent: USER_AGENT_IPHONE_IOS9 }); - global.window = new JSDOM(HTML, { resources: resourceLoader }).window; - global.document = window.document; - global.getComputedStyle = window.getComputedStyle; - smartbanner = new SmartBanner(); - smartbanner.publish(); - }); - - it('expected to set cookie', function() { - smartbanner.exit(); - expect(Bakery.baked).to.be.true; - }); - - it('expected to remove component markup', function(done) { - smartbanner.exit(); - let element = document.querySelector('.js_smartbanner'); - expect(element).not.to.exist; - done(); - }); - - it('expected to restore HTML margin', function(done) { - smartbanner.exit(); - let html = document.querySelector('html'); - let margin = parseFloat(getComputedStyle(html).marginTop); - if (isNaN(margin)) { - margin = 0; - } - expect(margin).to.eql(smartbanner.originalTopMargin); - done(); - }); - + beforeEach(function() { + const resourceLoader = new jsdom.ResourceLoader({ userAgent: USER_AGENT_IPHONE_IOS9 }); + global.window = new JSDOM(HTML, { resources: resourceLoader }).window; + global.document = window.document; + global.getComputedStyle = window.getComputedStyle; + smartbanner = new SmartBanner(); + smartbanner.publish(); }); - context('with jQuery Mobile', function(done) { - - before(function(done) { - const resourceLoader = new jsdom.ResourceLoader({ userAgent: USER_AGENT_IPHONE_IOS9 }); - global.window = new JSDOM(HTML_WITH_JQUERY_MOBILE_AND_META, { runScripts: 'dangerously', resources: resourceLoader }).window; - global.window.conclude = () => { - global.document = window.document; - global.getComputedStyle = window.getComputedStyle; - global.$ = window.jQuery; - global.Event = window.Event; - smartbanner = new SmartBanner(); - smartbanner.publish(); - done(); - }; - }); + it('expected to set cookie', function() { + smartbanner.exit(); + expect(Bakery.baked).to.be.true; + }); - it('expected to restore top distance', function() { - smartbanner.exit(); - let page = global.document.querySelector('.ui-page'); - let top = parseFloat(getComputedStyle(page).top); - if (isNaN(top)) { - top = 0; - } - expect(top).to.eql(smartbanner.originalTop); - }); + it('expected to remove component markup', function(done) { + smartbanner.exit(); + let element = document.querySelector('.js_smartbanner'); + expect(element).not.to.exist; + done(); }); + it('expected to restore HTML margin', function(done) { + smartbanner.exit(); + let html = document.querySelector('html'); + let margin = parseFloat(getComputedStyle(html).marginTop); + if (isNaN(margin)) { + margin = 0; + } + expect(margin).to.eql(smartbanner.originalTopMargin); + done(); + }); }); describe('height', function() {