onclick not working

[simone-nai]

hello there,
I want to compliment for your great work you're doing on this project.

I said onclick does not work because on messenger built in browser (by facebook), this basic onclick method does not do anything:

h('div', { onclick: function(){ alert('hi'); } },['hi']);

I tried also other metods and also they do not work..
obviously on chrome, ios browser and android browser everything works just nice.

I do not understand how to make it work on that browser..
thanks in advance for your support! :)

[Johan Gorter]

I created the codepen with the code you use, see https://codepen.io/johan-gorter/pen/mXRdEq. When I click 'hi' in chrome (on desktop), the alert appears.

You said you are using a Chrome 'webview' on Android? Can you test this codepen with it?

[simone-nai]

Thank you for your super quick response.
I tried the example in codepen and actually it works from my android using messenger browser.
So I got lost for one second... then I tried this code and render_1 works, but when I pass render_2 to append the onclick on the nested div does not work anymore (nb, with the messenger browser, with other browsers it's ok).

document.addEventListener('DOMContentLoaded', function () {
    var h = maquette.h;
    var domNode = document.body;
    var projector = maquette.createProjector();

    function render_1() {
        return h('div', { onclick: sayHi },['hi 1']);
    }
    function render_2(){
        return h('div',[
            h('div', { onclick: sayHi }, ['hi 2'])
        ]);
    }
    function sayHi(){
        alert('hi');
    }
    projector.append(domNode, render_2);
});

[simone-nai]

Hello, I write again because I found the problem. Here it is around line 654, where is defined the variable findVNodeByParentNodePath.
Apparently that facebook browser does not support the method .find()

So I edited it in this way, adding a try-catch and another "find":

var findVNodeByParentNodePath = function (vnode, parentNodePath) {
    var result = vnode;
    parentNodePath.forEach(function (node) {
        // original
        try{
            result = (result && result.children) ? result.children.find(function (child) { return child.domNode === node; }) : undefined;
        }
        // edited
        catch(e){
            result = (result && result.children) ? _.find(result.children, function(child) { return child.domNode === node; }):undefined;
        }
    });
    return result;
};

I apologize because I used underscore library to solve the problem, but for my project it's fine because I already use that library for other things..

Again my compliments for this project, I really love it! Continue like this guys! :)

[Johan Gorter]

Well that is a coincidence, the find() method caused IE11 to crash as well. The release we made just hours ago fixes this. It is likely that this release fixes your issue as well.

[simone-nai]

cool, I didn't notice it. So thank you for the new release, I'm gonna use it!
It's great that the issue is completely closed in less than 24 hours! 🥇