[IMP] web: call methods with correct 'this' in arrow function

Currently, bare method calls in arrow functions in templates are bound
to the rendering context/scope. While this gives you access to most of
the things that exist on the component for reading, writing on 'this'
will not always work, and the rendering context can pollute the
component's name space. This commit fixes that by explicitly calling the
method on the instance of the components.

Part-of: odoo/odoo#80684

addons/web/static/src/core/dialog/dialog_container.js

@@ -27,7 +27,7 @@ DialogContainer.template = tags.xml`
     <div class="o_dialog_container" t-att-class="{'modal-open': Object.keys(props.dialogs).length > 0}">
       <t t-foreach="Object.values(props.dialogs)" t-as="dialog" t-key="dialog.id">
         <NotUpdatable>
-            <ErrorHandler onError="(error) => handleError(error, dialog.id)">
+            <ErrorHandler onError="(error) => this.handleError(error, dialog.id)">
                 <t t-component="dialog.class" t-props="dialog.props"
                     t-on-dialog-closed="dialog.props.close()" 
                     t-att-class="{o_inactive_modal: !dialog_last}"/>

addons/web/static/src/core/effects/effect_container.js

@@ -19,6 +19,6 @@ export class EffectContainer extends Component {
 EffectContainer.template = tags.xml`
   <div class="o_effects_manager">
     <t t-if="effect">
-        <t t-component="effect.Component" t-props="effect.props" t-key="effect.id" close="() => removeEffect()"/>
+        <t t-component="effect.Component" t-props="effect.props" t-key="effect.id" close="() => this.removeEffect()"/>
     </t>
   </div>`;

addons/web/static/src/core/main_components_container.js

@@ -28,7 +28,7 @@ MainComponentsContainer.template = tags.xml`
 <div>
     <t t-foreach="Components" t-as="C" t-key="C[0]">
         <NotUpdatable>
-            <ErrorHandler onError="error => handleComponentError(error, C)">
+            <ErrorHandler onError="error => this.handleComponentError(error, C)">
                 <t t-component="C[1].Component" t-props="C[1].props"/>
             </ErrorHandler>
         </NotUpdatable>

addons/web/static/src/views/graph/graph_view.xml

@@ -58,7 +58,7 @@
                     class="o_renderer"
                     model="model"
                     t-att-class="{ o_sample_data_disabled: model.useSampleModel }"
-                    onGraphClicked="(domain) => onGraphClicked(domain)"
+                    onGraphClicked="(domain) => this.onGraphClicked(domain)"
                 />
             </t>
             <t t-else="" t-call="web.NoContentHelper">

addons/web/static/src/views/pivot/pivot_view.xml

@@ -34,7 +34,7 @@
                 <t t-else="" t-call="web.NoContentHelper"/>
             </t>
             <t t-if="model.hasData() and model.metaData.activeMeasures.length">
-                <Renderer model="model" onCellClicked="cell => onOpenView(cell)"/>
+                <Renderer model="model" onCellClicked="cell => this.onOpenView(cell)"/>
             </t>
         </Layout>
     </t>

addons/web/static/src/webclient/navbar/navbar.xml

@@ -32,7 +32,7 @@
         <div class="o_menu_systray" role="menu">
           <t t-foreach="systrayItems" t-as="item" t-key="item.key">
             <NotUpdatable>
-                <ErrorHandler onError="error => handleItemError(error, item)">
+                <ErrorHandler onError="error => this.handleItemError(error, item)">
                     <t t-component="item.Component" t-props="item.props" />
                 </ErrorHandler>
             </NotUpdatable>

addons/web/static/tests/core/utils/component_tests.js

@@ -52,7 +52,7 @@ QUnit.module("utils", () => {
         Parent.template = owl.tags.xml`
         <div>
           <t t-if="flag">
-            <ErrorHandler onError="() => handleError()">
+            <ErrorHandler onError="() => this.handleError()">
               <Boom />
             </ErrorHandler>
           </t>