From b5af8198faae413b903dbd6409768e76a4fa0454 Mon Sep 17 00:00:00 2001 From: Antoine Guenet Date: Fri, 25 Nov 2022 11:10:44 +0000 Subject: [PATCH] [FIX] web_editor: handle `default_focus` form attribute for html_field When rendering a form view that has a truthy `default_focus` attribute, the renderer looks for the element in its tree that has its `name` as `id`. However in the case of `html_field` it couldn't find it since `html_field` failed to apply that `id` to its focusable element (the editable root). This adds the `id` to the editable root when rendering the element in `wysiwyg`, and also directly applies `contenteditable` to it so the `focus` method actually does what we expect it to, even though we are waiting for `HtmlFieldWysiwygAdapterComponent` to be mounted before actually instantiating the editor itself. task-3073096 X-original-commit: 7e14e2a9c055f5b30b7510ffad994fa10196e34d Part-of: odoo/odoo#106622 --- addons/web_editor/static/src/js/backend/html_field.js | 1 + addons/web_editor/static/src/js/wysiwyg/wysiwyg.js | 9 +++++++++ 2 files changed, 10 insertions(+) diff --git a/addons/web_editor/static/src/js/backend/html_field.js b/addons/web_editor/static/src/js/backend/html_field.js index e1b1e4d1f09..94cac573b21 100644 --- a/addons/web_editor/static/src/js/backend/html_field.js +++ b/addons/web_editor/static/src/js/backend/html_field.js @@ -228,6 +228,7 @@ export class HtmlField extends Component { res_model: this.props.record.resModel, res_id: this.props.record.resId, }, + fieldId: this.props.id, }; } /** diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js index dede3258590..7017f05c0a9 100644 --- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js +++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js @@ -759,6 +759,15 @@ const Wysiwyg = Widget.extend({ */ renderElement: function () { this.$editable = this.options.editable || $('
'); + + // We add the field's name as id so default_focus will target it if + // needed. For that to work, it has to already be editable but note that + // the editor is at this point not yet instantiated. + if (typeof this.options.fieldId !== 'undefined') { + this.$editable.attr('id', this.options.fieldId); + this.$editable.attr('contenteditable', true); + } + this.$root = this.$editable; if (this.options.height) { this.$editable.height(this.options.height);