CrossRider - is there a way to pass arrays as function parameters without converting them to objects?

129 views Asked by At

We are using CrossRider to develop an extension for Internet Explorer. We have an object which is downloaded from http://jsons.[part_of_link_suppressed].com.s3.amazonaws.com/selectors.json. I found out that when this object is sent to a callback, arrays are converted to objects with integer keys. Why are arrays converted to objects and is there a way to prevent it? I know we can JSON.stringify the object and JSON.parse by the calling function, but is there a way to send arrays without converting them to strings? I checked and even ['a','b','c'] is converted to an object ({"0":"a","1":"b","2":"c"}) when calling a function with it.

I'm using Internet Explorer 11 but this extension should work on all versions of Internet Explorer.

Edit (1): I tested debug mode in Internet Explorer 11 and Google Chrome. I created a new extension - ID 67708. In Chrome it works fine, in Explorer it doesn't. Here is the code:

background.js:

/************************************************************************************
  This is your background code.
  For more information please visit our wiki site:
  http://docs.crossrider.com/#!/guide/scopes_background
*************************************************************************************/

function callme1() {
    var r1 = ['a','b','c'];
    alert('r1 = ' + JSON.stringify(r1));
    return r1;
}

appAPI.ready(function($) {

  // Place your code here (ideal for handling browser button, global timers, etc.)
  alert('callme1() = ' + JSON.stringify(callme1()));

});

extension.js:

  /************************************************************************************
  This is your Page Code. The appAPI.ready() code block will be executed on every page load.
  For more information please visit our docs site: http://docs.crossrider.com
*************************************************************************************/

function callme2() {
    var r2 = ['a','b','c'];
    alert('r2 = ' + JSON.stringify(r2));
    return r2;
}

appAPI.ready(function($) {

    // Place your code here (you can also define new functions above this scope)
    // The $ object is the extension's jQuery object

    // alert("My new Crossrider extension works! The current page is: " + document.location.href);
    alert('callme2() = ' + JSON.stringify(callme2()));

});

In Chrome all the alerts are ["a","b","c"], in Explorer they are {"0":"a","1":"b","2":"c"}, before and after returning the object. But in our extension (ID 43889), if we JSON.stringify the object and then JSON.parse it, then it's still an array (I didn't find how to reproduce it with a simple extension).

By the way, if I type in the console JSON.stringify(['a','b','c']) in Explorer or Chrome, I get the same result - "["a","b","c"]".

I also found another irritating bug - CrossRider converts my staging extensions to production, and I have to switch again to staging manually. It happened at least 5 times with both extensions.

Edit (2): I tried to use appAPI.JSON.stringify instead of JSON.stringify and now I receive the correct results in Explorer in extension.js (["a","b","c"]), but background.js is not loaded at all in debug mode and keeps displaying the old contents. I don't know if that's because I have 2 extensions in debug mode but this is a new bug - background.js is not updated when I click "reload background code".

1

There are 1 answers

3
Bnaya On

I had the same problem, with the messaging api. not sure what is your case (when saving to DB?)

Though i don't remember my whole debugging findings i think its like that: Crossrider api internally serialising the values to JSON in order to send them via postMessage/their own implementation for background communication with the background IE process(for all browser/not natively support pass objects via postMessage eg IE8). They aren't using native JSON object but rather (broken) JSON implementation (I think only on their IE background process because its not really browser page and there's no built in JSON) That means that even if you use their appAPI.JSON when no native JSON available you still get the broken arrays.

My solution was to use external json library, think i used JSON3 http://bestiejs.github.io/json3/ http://cdnjs.cloudflare.com/ajax/libs/json3/3.3.2/json3.min.js It would be less performant but if its not really big object it won't be noticeable.

You can also try to monkey patch their JSON appAPI.JSON with the external library, it might fix their api