From 2c966909e2c0b5e45912a6ff85577f0b19a5f4c9 Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Thu, 5 Jul 2018 13:17:59 +0200 Subject: [FIX] *: fix some side-effects of https://github.com/odoo/odoo/commit/9de1bc0eef6f5bfaa2a8d745431caa361ae91548 - JS Modals were not correctly built anymore, their .modal-body element was duplicated and many without-effect JS lines were introduced (as a side effect, the form view design was broken when inside modals) - Tests were changed to make bugs go unnoticed. For example, the media dialog functionnality was entirely broken because the .modal-dialog element was not receiving the correct class anymore. - The JS translation function is _t, not _ - Do not use the tag as a regular DOM element, it is meant to be unique, in the <head/> section - CSS rules were added to the utils.scss file, which is meant to contain functions and mixins, otherwise, the rule is duplicated in every asset - Some icons were still broken, as missed by https://github.com/odoo/odoo/commit/f90cf060a3cfeb37a67bec83264c0aaab8892b56 - Tests were changed to use [role="dialog"]/footer/header in their selectors without any reason, this commit restores some of that to avoid rebase conflicts with the BS4 work. - ... Note: other elements should still be discussed, like the direct use of the 'o_form_label' class in views definition... but those do not cause direct problems. --- addons/web/static/src/js/core/dialog.js | 33 +++++++++------------- addons/web/static/src/js/fields/basic_fields.js | 2 +- .../js/views/kanban/kanban_column_quick_create.js | 2 +- .../js/views/kanban/kanban_record_quick_create.js | 2 +- .../src/js/views/list/list_editable_renderer.js | 10 +++---- .../web/static/src/js/widgets/change_password.js | 2 +- addons/web/static/src/js/widgets/debug_manager.js | 2 +- .../src/js/widgets/domain_selector_dialog.js | 2 +- addons/web/static/src/scss/kanban_view.scss | 4 +++ addons/web/static/src/scss/utils.scss | 8 ------ addons/web/static/src/xml/dialog.xml | 2 +- 11 files changed, 30 insertions(+), 39 deletions(-) (limited to 'addons/web/static/src') diff --git a/addons/web/static/src/js/core/dialog.js b/addons/web/static/src/js/core/dialog.js index 6ebd94ef13e..075c7359a55 100644 --- a/addons/web/static/src/js/core/dialog.js +++ b/addons/web/static/src/js/core/dialog.js @@ -23,7 +23,7 @@ var Dialog = Widget.extend({ focus_control_button: '_onFocusControlButton', }), events: _.extend({} , Widget.prototype.events, { - 'keydown footer.modal-footer button':'_onFooterButtonKeyDown', + 'keydown .modal-footer button':'_onFooterButtonKeyDown', }), /** * @param {Widget} parent @@ -93,7 +93,7 @@ var Dialog = Widget.extend({ self.$modal.find('.modal-dialog').addClass('modal-sm'); break; } - self.$footer = self.$modal.find("footer"); + self.$footer = self.$modal.find(".modal-footer"); self.set_buttons(self.buttons); self.$modal.on('hidden.bs.modal', _.bind(self.destroy, self)); }); @@ -103,6 +103,9 @@ var Dialog = Widget.extend({ */ renderElement: function () { this._super(); + // Note: ideally, the $el which is created/set here should use the + // 'main' tag, we cannot enforce this as it would require to re-create + // the whole element. if (this.$content) { this.setElement(this.$content); } @@ -169,15 +172,7 @@ var Dialog = Widget.extend({ var self = this; this.appendTo($('<div/>')).then(function () { - var $main = self.$modal.find("main:first"); - if ($main.length === 0) { - $main = self.$modal.find(".modal-body:first"); - } - if (self.$el.tagName !== 'MAIN') { - self.$el.removeClass(".modal-body"); - self.$el = $('<main class="modal-body"/>').append(self.$el); - } - $main.replaceWith(self.$el); + self.$modal.find(".modal-body").replaceWith(self.$el); self.$modal.attr('open', true); self.$modal.removeAttr("aria-hidden"); self.$modal.modal('show'); @@ -212,13 +207,11 @@ var Dialog = Widget.extend({ $('.tooltip').remove(); //remove open tooltip if any to prevent them staying when modal has disappeared if (this.$modal) { this.$modal.modal('hide'); - this.$modal.removeAttr('open'); - this.$modal.attr('aria-hidden', true); this.$modal.remove(); } if (!isFocusSet) { - var modals = $('body > [role="dialog"]').filter(':visible'); + var modals = $('body > .modal').filter(':visible'); if (modals.length) { modals.last().focus(); // Keep class modal-open (deleted by bootstrap hide fnct) on body to allow scrolling inside the modal @@ -300,9 +293,10 @@ Dialog.alert = function (owner, message, options) { return new Dialog(owner, _.extend({ size: 'medium', buttons: buttons, - $content: $('<main role="alert"/>').append($('<p>', { + $content: $('<main/>', { + role: 'alert', text: message, - })), + }), title: _t("Alert"), }, options)).open({shouldFocusButtons:true}); }; @@ -325,9 +319,10 @@ Dialog.confirm = function (owner, message, options) { return new Dialog(owner, _.extend({ size: 'medium', buttons: buttons, - $content: $('<main role="alert">').append($('<p>', { + $content: $('<main/>', { + role: 'alert', text: message, - })), + }), title: _t("Confirmation"), }, options)).open({shouldFocusButtons:true}); }; @@ -358,7 +353,7 @@ Dialog.safeConfirm = function (owner, message, options) { text: message, }); } - $content = $('<main role="alert"/>').append($content, $securityCheck); + $content = $('<main/>', {role: 'alert'}).append($content, $securityCheck); var buttons = [ { diff --git a/addons/web/static/src/js/fields/basic_fields.js b/addons/web/static/src/js/fields/basic_fields.js index cb676871fc5..51816220c9f 100644 --- a/addons/web/static/src/js/fields/basic_fields.js +++ b/addons/web/static/src/js/fields/basic_fields.js @@ -1603,7 +1603,7 @@ var AttachmentImage = AbstractField.extend({ this.$el.empty().append($('<img>/', { src: "/web/image/" + this.value.data.id + "?unique=1", title: this.value.data.display_name, - alt: _("Image") + alt: _t("Image") })); } } diff --git a/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js b/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js index f554d333bc9..170b950a49d 100644 --- a/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js +++ b/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js @@ -216,7 +216,7 @@ var ColumnQuickCreate = Widget.extend({ } // ignore clicks in modals - if ($(event.target).closest('[role="dialog"]').length) { + if ($(event.target).closest('.modal').length) { return; } diff --git a/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js b/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js index 749938e8b9e..bf7e60b68c3 100644 --- a/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js +++ b/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js @@ -232,7 +232,7 @@ var RecordQuickCreate = Widget.extend({ } // ignore clicks in modals - if ($(ev.target).closest('[role="dialog"]').length) { + if ($(ev.target).closest('.modal').length) { return; } diff --git a/addons/web/static/src/js/views/list/list_editable_renderer.js b/addons/web/static/src/js/views/list/list_editable_renderer.js index 26b4f68d303..643cd52a282 100644 --- a/addons/web/static/src/js/views/list/list_editable_renderer.js +++ b/addons/web/static/src/js/views/list/list_editable_renderer.js @@ -758,7 +758,7 @@ ListRenderer.include({ break; } }, - /** + /** * It will returns the first visible widget that is editable * * @private @@ -768,9 +768,9 @@ ListRenderer.include({ var record = this.state.data[this.currentRow]; var recordWidgets = this.allFieldWidgets[record.id]; var firstWidget = _.find(recordWidgets, function (widget) { - var isFirst = widget.$el.is(':visible') && + var isFirst = widget.$el.is(':visible') && (widget.$el.has('input').length > 0 || - widget.tagName== 'input') && + widget.tagName== 'input') && !widget.$el.hasClass('o_readonly_modifier'); return isFirst; }); @@ -923,9 +923,9 @@ ListRenderer.include({ // ignore clicks in modals, except if the list is in a modal, and the // click is performed in that modal - var $clickModal = $(event.target).closest('[role="dialog"]'); + var $clickModal = $(event.target).closest('.modal'); if ($clickModal.length) { - var $listModal = this.$el.closest('[role="dialog"]'); + var $listModal = this.$el.closest('.modal'); if ($clickModal.prop('id') !== $listModal.prop('id')) { return; } diff --git a/addons/web/static/src/js/widgets/change_password.js b/addons/web/static/src/js/widgets/change_password.js index b2e4e013335..c05fa30408b 100644 --- a/addons/web/static/src/js/widgets/change_password.js +++ b/addons/web/static/src/js/widgets/change_password.js @@ -28,7 +28,7 @@ var ChangePassword = AbstractAction.extend({ var $button = self.$('.oe_form_button'); $button.appendTo(this.getParent().$footer); $button.eq(1).click(function () { - self.$el.parents('[role="dialog"]').modal('hide'); + self.$el.parents('.modal').modal('hide'); }); $button.eq(0).click(function () { self._rpc({ diff --git a/addons/web/static/src/js/widgets/debug_manager.js b/addons/web/static/src/js/widgets/debug_manager.js index 4bdc27448a0..4b86b76c36d 100644 --- a/addons/web/static/src/js/widgets/debug_manager.js +++ b/addons/web/static/src/js/widgets/debug_manager.js @@ -848,7 +848,7 @@ if (config.debug) { if (action) { var controller = parent.getCurrentControllerInDialog(); self.debugManager = new DebugManager(self); - var $header = self.$modal.find('header.modal-header:first'); + var $header = self.$modal.find('.modal-header:first'); return self.debugManager.prependTo($header).then(function () { self.debugManager.update('action', action, controller.widget); }); diff --git a/addons/web/static/src/js/widgets/domain_selector_dialog.js b/addons/web/static/src/js/widgets/domain_selector_dialog.js index d0c0030b100..46b54089c5f 100644 --- a/addons/web/static/src/js/widgets/domain_selector_dialog.js +++ b/addons/web/static/src/js/widgets/domain_selector_dialog.js @@ -43,7 +43,7 @@ return Dialog.extend({ var self = this; this.opened().then(function () { // this restores default modal height (bootstrap) and allows field selector to overflow - self.$el.css('overflow', 'visible').closest('[role="dialog"]').css('height', 'auto'); + self.$el.css('overflow', 'visible').closest('.modal-dialog').css('height', 'auto'); }); return $.when( this._super.apply(this, arguments), diff --git a/addons/web/static/src/scss/kanban_view.scss b/addons/web/static/src/scss/kanban_view.scss index 715c381e553..4d00f1be3cf 100644 --- a/addons/web/static/src/scss/kanban_view.scss +++ b/addons/web/static/src/scss/kanban_view.scss @@ -508,4 +508,8 @@ // Records colours @include o-kanban-record-color; + + .oe_kanban_color_help { + @include o-position-absolute(0, 5px, 0, -1px); + } } diff --git a/addons/web/static/src/scss/utils.scss b/addons/web/static/src/scss/utils.scss index cf04a8d32f8..efb8dce7598 100644 --- a/addons/web/static/src/scss/utils.scss +++ b/addons/web/static/src/scss/utils.scss @@ -337,14 +337,6 @@ } } } -.oe_kanban_color_help { - bottom: 0px; - left: -1px; - top: 0px; - width: 6px; - position: absolute; - right: auto; -} @mixin o-kanban-slim-col { position: relative; @include o-flex(0, 0, auto); diff --git a/addons/web/static/src/xml/dialog.xml b/addons/web/static/src/xml/dialog.xml index eb1a67ee98d..e55a17f26ef 100644 --- a/addons/web/static/src/xml/dialog.xml +++ b/addons/web/static/src/xml/dialog.xml @@ -3,7 +3,7 @@ <!-- These templates are accessible in backend and frontend --> -<div role="dialog" t-name="Dialog" t-attf-class="modal#{technical ? ' o_technical_modal' : ''}" tabindex="-1" data-backdrop="static" t-att-id="_.uniqueId('modal_')"> +<div role="dialog" t-name="Dialog" t-attf-class="modal#{technical ? ' o_technical_modal' : ''}" tabindex="-1" data-backdrop="static" t-att-id="_.uniqueId('modal_')" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <header class="modal-header"> -- cgit v1.2.3