How to prevent “Unable to get value of the propert

Question

I have a Dojo 1.7.4 app that is getting "Unable to get value of the property 'dir': object is null or undefined" error when loading pages in IE9.

I'm using an AMD build, and the error does not happen when it has to load all the files individually.

All the code that I have control over is wrapped in dojo/ready and dom/domReady! calls to the point of paranoia.

When the error occurs, and I catch it with the IE9 debugger, and Call stack reveals that the error occurs when calling isBodyLtr, but the top of the call stack is nls/synapse_en-gb.js. The nls/synapse_en-gb.js file seems to be the compile nls file with all the en-gb translations used by the application.

This seems to be getting loaded by virtue of having "en-gb" as my only locale entry in my dojoConfig, and I don't seem have control to ensure it is also wrapped in a dojo/ready or dojo/domReady!.

Here is the sample code in my HTML that bootstraps the Dojo package.

Any pointers for preventing the translation file from running until the dom and remaining Dojo files have fully loaded?

<script type="text/javascript">
//<![CDATA[
var dojoConfig = {
async: true,
parseOnLoad: true,
isDebug: true,
locale: "en-gb",
baseUrl: "/synapse/js/dojo/dojo/",
paths: {"synapse": "../../synapse"}
};

//]]>
</script>
<script type="text/javascript" src="/synapse/js/dojo/dojo/dojo.js"></script>
<script type="text/javascript">
//<![CDATA[
require(['dojo/ready', 'synapse/synapse', 'dojo/domReady!'], function(ready) {
ready(function () {

    require(['dojo/ready', 'synapse/overlay','dojo/domReady!'], function (ready, package) {
        ready(function() {
            package.init();
        });
    });
});
});

//]]>

Update: 17 April 2013 To try and work out what function calls are in the stack trace, I bootstrapped from dojo.js.uncompress.js.

This shows me that nls/synapse_en-gb.js is the entry point, with calls to the var def = function() (which gets exposed in the global namespace as define, then checkComplete, then execModule and so forth.

Since this seems to run before the DOM is even loaded, I needs to find a way to ensure that nls/synapse_en-gb.js is not run until the DOM is loaded.

Looking at my generated synapse/synapse.js, there is a *now function at the base that appears to preload the i18n files file. i.e.

"*now":function(r){
    r(["dojo/i18n!*preload*synapse/nls/synapse*[\"ar\",\"ca\",\"cs\",\"da\",\"de\",\"el\",\"en-gb\",\"en-us\",\"es-es\",\"fi-fi\",\"fr-fr\",\"he-il\",\"hu\",\"it-it\",\"ja-jp\",\"ko-kr\",\"nl-nl\",\"nb\",\"pl\",\"pt-br\",\"pt-pt\",\"ru\",\"sk\",\"sl\",\"sv\",\"th\",\"tr\",\"zh-tw\",\"zh-cn\",\"ROOT\"]"]);
}

I may end up having to relocate all the dojo loading until after so there's a much better chance of the DOM having been loaded, before dojo doing it's thing.

Answer 1

you can control the execution of the ready function by adding a number before the actual function:

    ready(999999,function() {
        package.init();
    });

Small numbers mean early execution, big numbers late execution !

You have nested a ready function inside a ready function. I don't think their are ment to be used that way...

Answer 2

I ended up having to move the inline portion of the script to after the </body> tag.