[SOLVED] Odoo 16 how to inherit website template and add on-click

Odoo 16 how to inherit website template and add on-click

I've inherited the project.portal_my_project template successfully and added a div with an on-click handler.

<template id="portal_project_inherit" name="portal_project_inherit" inherit_id="project.portal_my_project">
        <xpath expr="t" position="inside">
            <div class="o_portal_project_custom_block mt-3" >
                    <div t-on-click.stop="() => this._onClickTest()"><p>TEST</p></div>
            </div>
        </xpath>
    </template>

How can I link this on-click to a JavaScript function? I tried following but without success.

import { Dialog } from '@web/core/dialog/dialog';
import { patch } from '@web/core/utils/patch';
import { useService } from '@web/core/utils/hooks';

const { Component, useSubEnv, useState } = owl;

export class ImageViewer extends Component {

setup() {
    super.setup();
}

//----------
// Handlers
//----------

_onClickTest() {
    console.log("test")
    throw new Error("TEEEEEEEEST");
}
}


ImageViewer.template = 'test.portal_project_inherit';

Solution

<template id="portal_project_inherit" name="portal_project_inherit" inherit_id="project.portal_my_project">
        <xpath expr="t" position="inside">
            <div class="o_portal_project_custom_block mt-3" >
                    <div id="test_click"><p>TEST</p></div>
            </div>
        </xpath>
</template>

/** @odoo-module **/

import publicWidget from 'web.public.widget';

publicWidget.registry.WebsitePortalLayout = publicWidget.Widget.extend({
    selector: '.o_portal_project_custom_block',
    events: {
        'click #test_click': '_onClickTest',
    },
    _onClickTest() {
        console.log("test")
        throw new Error("TEEEEEEEEST");
    },
})