IE8 gives the error "Invalid argument" when using prototype.js, how to find where the error is?

Question

I have a rather complicated part of Javascript that works flawlessly without errors in Google Chrome, Firefox, Safari and Opera. However, as always, this is an infinitely annoying case; it completely fails in Internet Explorer. I tested in IE7 and IE8 and got the same error:

Invalid argument. prototype.js, line 2216, character 9

I am using Prototype 1.6.1 hosted via Google. The indicated error does not help much since it does not tell me where the error occurs in my actual code. The line mentioned in the error is the 6th line from below in the following code:

setStyle: function(element, styles) {
    element = $(element);
    var elementStyle = element.style, match;
    if (Object.isString(styles)) {
      element.style.cssText += ';' + styles;
      return styles.include('opacity') ?
        element.setOpacity(styles.match(/opacity:\s*(\d?\.?\d*)/)[1]) : element;
    }
    for (var property in styles)
      if (property == 'opacity') element.setOpacity(styles[property]);
      else
        elementStyle[(property == 'float' || property == 'cssFloat') ?
          (Object.isUndefined(elementStyle.styleFloat) ? 'cssFloat' : 'styleFloat') :
            property] = styles[property];

    return element;
  },

setStyle , , , . , setStyle 100 script , . -, , , ?

Answer 1

try ... catch :

for (var property in styles) {
  try {
    if (property == 'opacity') element.setOpacity(styles[property]);
    else
      elementStyle[(property == 'float' || property == 'cssFloat') ?
        (Object.isUndefined(elementStyle.styleFloat) ? 'cssFloat' : 'styleFloat') :
          property] = styles[property];
  }
  catch (_) {
    throw "Error setting property '" + property + "' to value '" + styles[property] + "'";
  }
}

, .

Answer 2

IE8 [5- script.] " ".

, .

Answer 3

Microsoft® Visual Web Developer® 2010 Express, IE.

Answer 4

, , , . ( IE ), setStyle, , , , .

Answer 5

setStyle({someProperty: null}). , undefined - .

To investigate such problems in the future, check the arguments that you pass to third-party functions in the catch block. View

try{
  element.setStyle({someProperty: someValue})
}catch(error){
  throw('' + someProperty + ':' + someValue)
}

This code would indicate the source of the error at time zero. Below is a more detailed snippet for debugging this case with some Prototype.js helpers:

;(function () {
  var superFunction = Element.setStyle
  Element.addMethods({
    setStyle: function (element, _arguments) {
      try{
        superFunction(element, _arguments)
      }catch(error){
        console.log(error, $H(_arguments).inspect())
      }
    }
  })
})()

PS in IE8 you must open Developer Tools (F12) to work console.