From 0b94da214b7017e8580e671cbaa68ade6de2fbc7 Mon Sep 17 00:00:00 2001 From: Romeo Fragomeli Date: Mon, 4 Apr 2022 14:19:46 +0000 Subject: [PATCH] [REF] web,website: BS5: Convert JavaScript MonkeyPatch Converted for new Javascript of Bootstrap 5. Note: some parts are removed as not found equivalent function name in BS5. Task ID: 2766483 Part-of: odoo/odoo#95450 --- .../static/src/legacy/js/libs/bootstrap.js | 104 +++++++----------- .../static/src/snippets/s_popup/000.js | 28 +---- odoo/addons/test_lint/tests/eslintrc | 1 + 3 files changed, 45 insertions(+), 88 deletions(-) diff --git a/addons/web/static/src/legacy/js/libs/bootstrap.js b/addons/web/static/src/legacy/js/libs/bootstrap.js index 3da9db81d49..6e41fb4d2cc 100644 --- a/addons/web/static/src/legacy/js/libs/bootstrap.js +++ b/addons/web/static/src/legacy/js/libs/bootstrap.js @@ -1,5 +1,4 @@ -odoo.define('web.bootstrap.extensions', function () { -'use strict'; +/** @odoo-module alias=web.bootstrap.extensions **/ /** * The bootstrap library extensions and fixes should be done here to avoid @@ -16,33 +15,33 @@ odoo.define('web.bootstrap.extensions', function () { * We cannot disable sanitization because bootstrap uses tooltip/popover * DOM attributes in an "unsafe" way. */ -var bsSanitizeWhiteList = $.fn.tooltip.Constructor.Default.whiteList; +let bsSanitizeAllowList = Tooltip.Default.allowList; -bsSanitizeWhiteList['*'].push('title', 'style', /^data-[\w-]+/); +bsSanitizeAllowList['*'].push('title', 'style', /^data-[\w-]+/); -bsSanitizeWhiteList.header = []; -bsSanitizeWhiteList.main = []; -bsSanitizeWhiteList.footer = []; +bsSanitizeAllowList.header = []; +bsSanitizeAllowList.main = []; +bsSanitizeAllowList.footer = []; -bsSanitizeWhiteList.caption = []; -bsSanitizeWhiteList.col = ['span']; -bsSanitizeWhiteList.colgroup = ['span']; -bsSanitizeWhiteList.table = []; -bsSanitizeWhiteList.thead = []; -bsSanitizeWhiteList.tbody = []; -bsSanitizeWhiteList.tfooter = []; -bsSanitizeWhiteList.tr = []; -bsSanitizeWhiteList.th = ['colspan', 'rowspan']; -bsSanitizeWhiteList.td = ['colspan', 'rowspan']; +bsSanitizeAllowList.caption = []; +bsSanitizeAllowList.col = ['span']; +bsSanitizeAllowList.colgroup = ['span']; +bsSanitizeAllowList.table = []; +bsSanitizeAllowList.thead = []; +bsSanitizeAllowList.tbody = []; +bsSanitizeAllowList.tfooter = []; +bsSanitizeAllowList.tr = []; +bsSanitizeAllowList.th = ['colspan', 'rowspan']; +bsSanitizeAllowList.td = ['colspan', 'rowspan']; -bsSanitizeWhiteList.address = []; -bsSanitizeWhiteList.article = []; -bsSanitizeWhiteList.aside = []; -bsSanitizeWhiteList.blockquote = []; -bsSanitizeWhiteList.section = []; +bsSanitizeAllowList.address = []; +bsSanitizeAllowList.article = []; +bsSanitizeAllowList.aside = []; +bsSanitizeAllowList.blockquote = []; +bsSanitizeAllowList.section = []; -bsSanitizeWhiteList.button = ['type']; -bsSanitizeWhiteList.del = []; +bsSanitizeAllowList.button = ['type']; +bsSanitizeAllowList.del = []; /** * Returns an extended version of bootstrap default whitelist for sanitization, @@ -56,25 +55,25 @@ bsSanitizeWhiteList.del = []; * @returns {Object} /!\ the returned whitelist is made from a *shallow* copy of * the default whitelist, extended with given whitelist. */ -function makeExtendedSanitizeWhiteList(extensions) { - var whiteList = _.clone($.fn.tooltip.Constructor.Default.whiteList); +export function makeExtendedSanitizeWhiteList(extensions) { + let allowList = Object.assign({}, Tooltip.Default.allowList); Object.keys(extensions).forEach(key => { - whiteList[key] = (whiteList[key] || []).concat(extensions[key]); + allowList[key] = (allowList[key] || []).concat(extensions[key]); }); - return whiteList; + return allowList; } /* Bootstrap tooltip defaults overwrite */ -$.fn.tooltip.Constructor.Default.placement = 'auto'; -$.fn.tooltip.Constructor.Default.fallbackPlacement = ['bottom', 'right', 'left', 'top']; -$.fn.tooltip.Constructor.Default.html = true; -$.fn.tooltip.Constructor.Default.trigger = 'hover'; -$.fn.tooltip.Constructor.Default.container = 'body'; -$.fn.tooltip.Constructor.Default.boundary = 'window'; -$.fn.tooltip.Constructor.Default.delay = { show: 1000, hide: 0 }; +Tooltip.Default.placement = 'auto'; +Tooltip.Default.fallbackPlacement = ['bottom', 'right', 'left', 'top']; +Tooltip.Default.html = true; +Tooltip.Default.trigger = 'hover'; +Tooltip.Default.container = 'body'; +Tooltip.Default.boundary = 'window'; +Tooltip.Default.delay = { show: 1000, hide: 0 }; -var bootstrapShowFunction = $.fn.tooltip.Constructor.prototype.show; -$.fn.tooltip.Constructor.prototype.show = function () { +const bootstrapShowFunction = Tooltip.prototype.show; +Tooltip.prototype.show = function () { // Overwrite bootstrap tooltip method to prevent showing 2 tooltip at the // same time $('.tooltip').remove(); @@ -91,8 +90,8 @@ $.fn.tooltip.Constructor.prototype.show = function () { /* Bootstrap scrollspy fix for non-body to spy */ -const bootstrapSpyRefreshFunction = $.fn.scrollspy.Constructor.prototype.refresh; -$.fn.scrollspy.Constructor.prototype.refresh = function () { +const bootstrapSpyRefreshFunction = ScrollSpy.prototype.refresh; +ScrollSpy.prototype.refresh = function () { bootstrapSpyRefreshFunction.apply(this, arguments); if (this._scrollElement === window || this._config.method !== 'offset') { return; @@ -106,33 +105,10 @@ $.fn.scrollspy.Constructor.prototype.refresh = function () { /** * In some cases, we need to keep the first element of navbars selected. */ -const bootstrapSpyProcessFunction = $.fn.scrollspy.Constructor.prototype._process; -$.fn.scrollspy.Constructor.prototype._process = function () { +const bootstrapSpyProcessFunction = ScrollSpy.prototype._process; +ScrollSpy.prototype._process = function () { bootstrapSpyProcessFunction.apply(this, arguments); if (this._activeTarget === null && this._config.alwaysKeepFirstActive) { this._activate(this._targets[0]); } }; - -/* Bootstrap modal scrollbar compensation on non-body */ -const bsSetScrollbarFunction = $.fn.modal.Constructor.prototype._setScrollbar; -$.fn.modal.Constructor.prototype._setScrollbar = function () { - const $scrollable = $().getScrollingElement(); - if (document.body.contains($scrollable[0])) { - $scrollable.compensateScrollbar(true); - } - return bsSetScrollbarFunction.apply(this, arguments); -}; -const bsResetScrollbarFunction = $.fn.modal.Constructor.prototype._resetScrollbar; -$.fn.modal.Constructor.prototype._resetScrollbar = function () { - const $scrollable = $().getScrollingElement(); - if (document.body.contains($scrollable[0])) { - $scrollable.compensateScrollbar(false); - } - return bsResetScrollbarFunction.apply(this, arguments); -}; - -return { - makeExtendedSanitizeWhiteList: makeExtendedSanitizeWhiteList, -}; -}); diff --git a/addons/website/static/src/snippets/s_popup/000.js b/addons/website/static/src/snippets/s_popup/000.js index 3246c7ad7b9..1f367af9f3b 100644 --- a/addons/website/static/src/snippets/s_popup/000.js +++ b/addons/website/static/src/snippets/s_popup/000.js @@ -141,8 +141,8 @@ function _updateScrollbar(ev) { // padding-right they add if the popup does not use a backdrop (especially // important for default cookie bar). -const _baseShowElement = $.fn.modal.Constructor.prototype._showElement; -$.fn.modal.Constructor.prototype._showElement = function () { +const _baseShowElement = Modal.prototype._showElement; +Modal.prototype._showElement = function () { _baseShowElement.apply(this, arguments); if (this._element.classList.contains('s_popup_no_backdrop')) { @@ -161,8 +161,8 @@ $.fn.modal.Constructor.prototype._showElement = function () { } }; -const _baseHideModal = $.fn.modal.Constructor.prototype._hideModal; -$.fn.modal.Constructor.prototype._hideModal = function () { +const _baseHideModal = Modal.prototype._hideModal; +Modal.prototype._hideModal = function () { _baseHideModal.apply(this, arguments); // Note: do this in all cases, not only for popup with the @@ -179,25 +179,5 @@ $.fn.modal.Constructor.prototype._hideModal = function () { } }; -const _baseSetScrollbar = $.fn.modal.Constructor.prototype._setScrollbar; -$.fn.modal.Constructor.prototype._setScrollbar = function () { - if (this._element.classList.contains('s_popup_no_backdrop')) { - this._element.classList.toggle('s_popup_overflow_page', !!this._isOverflowingWindow); - - if (!this._isOverflowingWindow) { - return; - } - } - return _baseSetScrollbar.apply(this, arguments); -}; - -const _baseGetScrollbarWidth = $.fn.modal.Constructor.prototype._getScrollbarWidth; -$.fn.modal.Constructor.prototype._getScrollbarWidth = function () { - if (this._element.classList.contains('s_popup_no_backdrop') && !this._isOverflowingWindow) { - return 0; - } - return _baseGetScrollbarWidth.apply(this, arguments); -}; - return PopupWidget; }); diff --git a/odoo/addons/test_lint/tests/eslintrc b/odoo/addons/test_lint/tests/eslintrc index 04929d76ca9..687fb9cf19e 100644 --- a/odoo/addons/test_lint/tests/eslintrc +++ b/odoo/addons/test_lint/tests/eslintrc @@ -37,6 +37,7 @@ "ClipboardJS": "readonly", "Modal": "readonly", "Dropdown": "readonly", + "ScrollSpy": "readonly", "Alert": "readonly", "globalThis": "readonly", "module": "readonly",