Picture of sean callahan
Custom components preventing page loads
by sean callahan - Friday, 11 August 2017, 9:37 PM


I've successfully created several custom components for adapt and have a good understanding of what needs to be done to get them to work properly. Starting today every custom component I try to add is either not being registered successfully or freezes the page on the loading screen sometimes with errors visible in the console and sometimes without. I have a suspicion something is going wrong in the build process. I even used a known working custom component and I get the same results. I can't think of anything on my end thats changed to cause this.

Some of the errors I'm getting:

This one is from a known working component:

Uncaught TypeError: template is not a function
at n.render (adaptView.js:37)
at n.initialize (adaptView.js:21)
at n.initialize (componentView.js:21)
at n.e.View (backbone.min.js:2)
at n [as constructor] (backbone.min.js:2)
at n [as constructor] (backbone.min.js:2)
at new n (backbone.min.js:2)
at n.addChildren (adaptView.js:91)
at n.postRender (adaptView.js:28)
at n.<anonymous> (adaptView.js:43)


This one seems to be failing to register even though the bower.json file is set up properly as is the js file the packages.schema, and the package.json. The handlebars and less files are named properly and the component folder is named properly:

Uncaught Error: textOverlay component not found. Is it installed and included?
at new model (app.js:206)
at n._prepareModel (backbone.min.js:2)
at n.set (backbone.min.js:2)
at n.add (backbone.min.js:2)
at n.reset (backbone.min.js:2)
at Object.t.success (backbone.min.js:2)
at i (jquery.v2.min.js:2)
at Object.fireWith [as resolveWith] (jquery.v2.min.js:2)
at z (jquery.v2.min.js:4)
at XMLHttpRequest.<anonymous> (jquery.v2.min.js:4)


I'm hoping maybe you guys can shed some light on this although it's not exactly a lot of info to go on.




Picture of Oliver Foster
Re: Custom components preventing page loads
by Oliver Foster - Monday, 14 August 2017, 10:10 AM

Could you attach a copy of the bower.json?

Picture of Dan Storey
Re: Custom components preventing page loads
by Dan Storey - Monday, 14 August 2017, 1:26 PM

Hi Sean,

It's very difficult to diagnose without seeing all the files but this might help you find out what's going on:

The first issue is occurring because the template does not exist in the Handlebars.templates object. You can quickly inspect the existing templates by typing in Handlebars.templates into your browser console. If the template has been given the wrong name you should be able to see it here. If it's not present at all you can find out the name of the template that's causing the problem by temporarily inserting console.log(this.constructor.template) before line 36 in core/js/views/adaptView.js. Don't forget to remove this!

The second issue is occuring because Adapt.register("textOverlay", YourConstructor) is not getting called. Can you verify that your bower.js is pointing to the right js file, that Adapt.register gets called in this file and that the first argument is exactly "textOverlay" (case sensitive). If you are still getting that error it is probably because the file is not being included in the build. 


Picture of sean callahan
Re: Custom components preventing page loads
by sean callahan - Tuesday, 15 August 2017, 4:16 PM

Hi Dan,

Thanks for the info on that logging function, that will come in handy! It turns out that the previous devs here tampered with some of the core functionality and that's what seemed to be causing the issue. Once a certain number of components was exceeded some of the processes went haywire. A fresh install of the stock framework resolved the issue! Thanks for your help.



Picture of Matt Leathes
Re: Custom components preventing page loads
by Matt Leathes - Tuesday, 15 August 2017, 5:39 PM
A fresh install of the stock framework resolved the issue

Definitely something worth trying whenever you run into an issue like this...