Events are not binding with dynamic import in meteor 1.5

[WayneUong]

This is how I set it up in /client/index.js

FlowRouter.wait();
import('/imports/client/main.js').then(function () {
    FlowRouter.initialize();
});

In /imports/client/main.js:

import './test.html'

Template.test.events({
    test: function () {
        console.log('click')
    }
})

FlowRouter.route('/', {
    action: function () {
        BlazeLayout.render('test');
    }
});

In /imports/client/main.html:

<template name="test">

    <button onclick={{test}}>test</button>

</template>

The onclick event binding does not work.

[seeekr]

The way this library works at the moment is by going through all defined templates & events, finding the "magic" ones, then making template helpers for those. If a template's JS is dynamically loaded, then this library will not be able to process it.

2 possible solutions I can see for this:

a) Hook into the meteor build process and generate "magic" helper code at build time.
b) Hook into the dynamic import functionality and run helper code on each import, but before that import is used.

Solution b) might be the easier one, so I'll look into that one first. If you know or want to help me find out how to either a) hook into the meteor build process (generating code is not a problem) or b) latch on to dynamic import and do post-processing, that would help speed up the solving of this issue. (I personally am not using Meteor at all at the moment, so I don't have an itch of my own to scratch with this.)

[dr-dimitru]

Hello @WayneUong @seeekr ,

Try this solution. Let me know if this work for you

[WayneUong]

@dr-dimitru Is there a global waitOn hook? I don't want to have to do it for every route.

[dr-dimitru]

@WayneUong no, not yet.

Could you submit a new issue? And mention it should be in a next form:

FlowRouter.globals.push({
  waitOn() {
    return [import(/*...*/)];
  }
});