Strage behaviour using Knockout.js 3.2.0, shift is undefined - javascript

This one's been a real hair-puller.
I moved some divs into templates without altering any ko's datacontext, and all of a sudden I had the dreaded "undefined is not a function" in template.
Turns out it wasn't something related to a missing observable, but something internal to ko:
Looks like continuousNodeArray is not a plain-old array but it's a jQuery object array (I assume in this particular instance only, as I believe it should be a plain-old array).
So I'm curious to know if this is a Knockout.js bug or something in my templates triggering this behaviour. I solved this by adding the following:
jQuery.fn.shift = [].shift;
But I'm sure there must be something else going on. Any clue?

This is known and not recently (Oct 8) fixed bug when you are using jquery.tmpl as a templating engine.
See on github: Fix error in fixUpContinuousNodeArray when using jquery.tmpl
So if you check the latest source you will see now that splice is used instead of shift:
However it is not included in the latest version (3.2.0) so you properly should stick to your workaround until a new version comes out.

Related

What happened to isZoomedIgnoreProgrammaticZoom?

I am using dygraph 1.1.0 since, well... forever :-)
Now I wanted to have a look at dygraph 2.0.0 and of course expected some migration to do.
Now, the only error I actually get after simply replacing the *.js files is:
Uncaught invalid option isZoomedIgnoreProgrammaticZoom dygraph.js:4448
When I remove this option from my code, everything still seems to work.
I could not find anything about the option in the new docs, so my question in:
What happened to isZoomedIgnoreProgrammaticZoom?
That option was removed in the 2.0 release.
That option affected the behavior of the isZoomed() method. If you're not using that method, you can remove the option without changing anything. If you are, it should be possible to get whatever behavior you want by using other methods in the dygraphs API. But I'd need more specifics to help.

Fixing AngularJS 1.2.0 [$parse:isecprv] errors

AngularJS 1.2.0 just got released, and there's an instant problem for CounchDB and MongoDB users:
When trying to access some JSON data preceded by an underscore, like {{data._id}} Angular 1.2.0 gives the following error:
Error: [$parse:isecprv]
There is discussion about this here on the docs.
Is there a way to disable this 'feature', or overcome it?
To disable this 'feature' in 1.2.0, comment out lines 9097 till 9101. These 5 lines are responsible for Error: [$parse:isecprv]:
if (name.charAt(0) === '_' || name.charAt(name.length-1) === '_') {
throw $parseMinErr('isecprv',
'Referencing private fields in Angular expressions is disallowed! Expression: {0}',
fullExpression);
}
It looks like we'll need to wait until 1.2.1 has been released.
Nov 13 2013 Vojta said the following about this 'feature':
Guys, sorry for the troubles this change caused. This "feature" was
mostly for people using Closure compiler and Google JS style, but I
didn't realize that many people were relying on accessing _*
properties in templates. For now we are reverting that change
(4ab16aa).
We gonna release 1.2.1 (which will contain this "fix") within next
days.
The main outcome of this issue is: we should not put any breaking
changes into RC. Lesson learned.
Update - Nov 15, 2013: AngularJS 1.2.1 underscore-empathy reverts hiding "private" properties.
We introduced "private" properties (for properties prefaced with an
underscore) in 1.2 thinking that this would be a fairly
uncontroversial change. Oops! Apologies (and thank you) to the folks
who filed bugs alerting us to the larger consequences in your code of
making this breaking change. We've reverted this feature.

Weird 'ChildNodes of undefined' error in IE8 with an AngularJS application

TypeError: Unable to get value of the property 'childNodes': object is null or undefinedundefined
After making a long list of modifications to my application in order to support IE8, including:
running all of the views in their compiled form through W3C validator, setting up xdomain.js proxy to support CORS API calls, making some general restructures, etc.
I was very disappointed to find out that IE8 still throws this weird error at me, while IE9 works perfectly fine.
Making changes to the Angular-seo package to prevent it from running when the client is an IE browser.
Any ideas on what can it be?.
Make sure that all your tags are closed properly. I just spent hours trying to figure out what the problem was, until I noticed this in my code:
<span>some text<span>
I finally realized I didn't close the <span> tag properly. After that everything just worked.
Without the code you are running it is a bit difficult. However there is a command to use for debugging. First you need to identify which variable might not contain an object [i.e.
"object is null or undefined"].
For example, parent, then you can use
//next look to see if parent is something
if('undefined'==(typeof parent)) alert("variable empty:parent");
Once you find something that is empty that you are expecting to be an object then you can go trace back from there. Also use a browser debugged tool, to identify the line number of the error.
Often if using the child nodes, you may not have the right level or you need to access as an array i.e. you need something like.
parent.childNodes[0].childNodes[0].value
In IE you are also dealing with unsupported functions. So getElementById will work but some other similar ones do not. Again typeof can be useful.
//next ensure function supported
if( 'undefined'==(typeof document.getElementsByClassName) ){
alert("Not Supported"); // notice ^ no () required here
//...add code to handle differently when not supported
}
This may reveal if you can use a function
IE8 is so old and non-standards compliant it doesn't support childNodes[]. http://quirksmode.org/dom/core/#t70

Using mustache templates with knockout.js

I wish to use knockout.js, but unfortunately I cannot use jquery-tmpl due to the prequisite of jquery 1.4.2, which (I won't go into it here) we cannot upgrade to.
Has anyone got any tips on getting started using Mustache templates with knockout? I've been finding it tricky to find any information regarding it.
Update I've released initial version of template engine for knockout js that is using mustache as a template library. You can check it out at https://github.com/WTK/ko.mustache.js
Have you seen this part of documentation http://knockoutjs.com/documentation/template-binding.html ? Especially take a closer look at the Note 8 which points you to check the jqueryTmplTemplateEngine.js in the knockout source code (to spare you the effort of searching, its this one: https://github.com/SteveSanderson/knockout/blob/master/src/templating/jquery.tmpl/jqueryTmplTemplateEngine.js).
I just took a glance at source of that file, but everything seems to be quite simple. You have to define couple of callback functions that are (I assume) called by knockout js when needed.
Those functions include:
function renderTemplateSource(templateSource, bindingContext, options) {}
function createJavaScriptEvaluatorBlock(script) {}
function addTemplate(templateName, templateMarkup) {}
Check what those functions return when using jquery.tmpl and try to mimic their behavior whilst using moustache instead.

initialization of dojo widget

I tried to create custom widget for my site. when I loaded page it says:
mixin #0 is not a callable constructor.
clsInfo.cls.prototype is undefined
I can't find any information about clsInfo, so I don't know what is it. maybe the problem that I use dojo from google:
and my own script is located on localhost. so when my dojo on page initializes something goes wrong with my script. I can't find any good info on dojo, maybe I search in wrong places?
please help me to resolve my problem
I ran into this when I was trying to override a dijit.Dialog so I could bind events to controls within it. We've yet to see if the binding part will work, but if you look at the source, this happens when one of the bases passed in as the second argument fails to resolve to an "[Object function]". In my case, I was passing a String in.
dojo.declare takes 3 arguments:
The name of the custom object "class" you're building
An array of base classes, parents to provide functionality (not the string names of those classes)
A hash of functions and declarations
So if I want to override dijit.Dialog, I have to do:
dojo.declare("myDialogType", [dijit.Dialog], {
function1() {/*Code*/},
function2() {/*Code*/}
}
I had ["dijit.Dialog"] as my second argument and that was the problem.
I strongly recommend using Web Inspector or Firebug with uncompressed local copies of the Dojo library rather than the CDN to figure out what's going on and debug these types of problems. Dojo's documentation is extensive but not complete in some areas and some behaviors have to be figured out by looking at what the code expects. That's not intended as a slight to the authors; once you get it going it's a pretty awesome product, and any documentation for volunteer work is appreciated.
Are you sure Dojo is loading? Did you put your code in a dojo.addOnLoad()? When using a CDN you sometimes run into issues with execution times. dojo.addOnLoad() will not only trigger when the DOM is loaded, it gets called when dojo resources have downloaded, such as dijit._Widget.
I've run into this problem when I screw up the order of my requires which makes _WidgetBase not what _WidgetBase really is. Seems like a simple spot to screw up.

Categories