[FIX] web: Call on_attach_callback on systray widgets

Currently, the method `on_attach_callback` is never called on any Widget in the
systray.

Calling `on_attach_callback` is required if any systray widget uses an OWL
component via the ComponentWrapper. Without the callback, the component is never
considered mounted to the DOM and no event handler is triggered.

closes odoo/odoo#46566

Related: odoo/enterprise#8887
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>

addons/web/static/src/js/chrome/menu.js

@@ -69,6 +69,7 @@ var Menu = Widget.extend({
         // Systray Menu
         this.systray_menu = new SystrayMenu(this);
         var systrayMenuProm = this.systray_menu.attachTo(this.$('.o_menu_systray')).then(function() {
+            self.systray_menu.on_attach_callback();  // At this point, we know we are in the DOM
             dom.initAutoMoreMenu(self.$section_placeholder, {
             maxWidth: function () {
                 return self.$el.width() - (self.$menu_apps.outerWidth(true) + self.$menu_brand_placeholder.outerWidth(true) + self.systray_menu.$el.outerWidth(true));

addons/web/static/src/js/chrome/systray_menu.js

@@ -39,6 +39,11 @@ var SystrayMenu = Widget.extend({
             return Promise.all(proms);
         });
     },
+    on_attach_callback() {
+        this.widgets
+            .filter(widget => widget.on_attach_callback)
+            .forEach(widget => widget.on_attach_callback());
+    },
     /**
      * Add the instanciated items, using the object located in this.wisgets
      */

addons/web/static/tests/chrome/menu_tests.js

@@ -0,0 +1,47 @@
+odoo.define('web.menu_tests', function (require) {
+    "use strict";
+
+    const testUtils = require('web.test_utils');
+    const Menu = require('web.Menu');
+    const SystrayMenu = require('web.SystrayMenu');
+    const Widget = require('web.Widget');
+
+
+    QUnit.module('chrome', {}, function () {
+        QUnit.module('Menu');
+
+        QUnit.test('Systray on_attach_callback is called', async function (assert) {
+            assert.expect(4);
+
+            const parent = testUtils.createParent({});
+
+            // Add some widgets to the systray
+            const Widget1 = Widget.extend({
+                on_attach_callback: () => assert.step('on_attach_callback widget1')
+            });
+            const Widget2 = Widget.extend({
+                on_attach_callback: () => assert.step('on_attach_callback widget2')
+            });
+            SystrayMenu.Items = [Widget1, Widget2]
+
+            testUtils.mock.patch(SystrayMenu, {
+                on_attach_callback: function () {
+                    assert.step('on_attach_callback systray');
+                    this._super(...arguments);
+                }
+            });
+
+            const menu = new Menu(parent, {children: []});
+            await menu.appendTo($('#qunit-fixture'));
+
+            assert.verifySteps([
+                'on_attach_callback systray',
+                'on_attach_callback widget1',
+                'on_attach_callback widget2',
+            ]);
+            testUtils.mock.unpatch(SystrayMenu);
+            parent.destroy();
+        });
+    });
+
+});

addons/web/views/webclient_templates.xml

@@ -723,6 +723,7 @@
                 <script type="text/javascript" src="/web/static/tests/chrome/action_manager_tests.js"></script>
                 <script type="text/javascript" src="/web/static/tests/chrome/pager_tests.js"></script>
                 <script type="text/javascript" src="/web/static/tests/chrome/keyboard_navigation_mixin_tests.js"></script>
+                <script type="text/javascript" src="/web/static/tests/chrome/menu_tests.js"></script>
                 <script type="text/javascript" src="/web/static/tests/chrome/user_menu_tests.js"></script>
                 <script type="text/javascript" src="/web/static/tests/chrome/systray_tests.js"></script>