Invalid calling object IE - javascript

In FF and Chrome i can set the this value to the location object using bind, with the following code
locationFacade ={
reload: location.reload.bind(location)
}
locationFacade.reload();
Or I can use apply
locationFacade ={
reload: function(){
location.reload.apply(location,arguments); }
}
locationFacade.reload();
However in IE 9 I keep getting "Invalid calling object" when calling locationFacade.reload(); I havent tested every IE but issue happens in IE 11 also. Apply and bind are both supported in IE here and here

This problem seems to be a bug of IE. I tested lots of functions in IE11 (document.writeln, window.alert, etc.), and all of them could be bound, except the members of location. This workaround might help:
locationFacade = {
reload: window.navigate ?
window.navigate.bind(window, location.href) :
location.reload.bind(location)
}

Related

IE11 function not getting passed constructor

On pageload i am firing a function that should open a lightbox. In Chrome, FF, Opera, Edge and Safari everything works as it intented. In IE11 however it is not. I am not getting a warning or error in the console so I have no clue what I am doing wrong here.
I stripped the code below to the essential. In Chrome (and other browsers) the console log goes from 1 to 3 to 2. In IE11 i am only getting 1 and I have no idea why it doesn't go to 3 or 2. I thought it had something to do with bind(), but that seems to be supported.
I have to admit I am pretty new with constructors, prototypes and bind.
constructor(el) {
this.$el = $(el);
console.log('1');
this.getLocation = getLocation.bind(this);
this.loadLB();
console.log('2');
}
loadLB() {
const url = new URL(window.location.href);
console.log('3');
this.getLocation('url');
}
Are you using ConstructorMethod? It's also not supported by IE. I don't know if you have used some polyfills to make it work in IE 11.
Besides, IE doesn't support URL() constructor. You can add this polyfill to make URL() work in IE 11:
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Why is event.defaultPrevented undefined?

As per the MDN docs, a click event should have a property called preventedDefault: https://developer.mozilla.org/en-US/docs/Web/API/Event/defaultPrevented
However, in my code, defaultPrevented is undefined (Chrome and Safari). Instead there is another property called: isDefaultPrevented which seems to do the trick, however, this does not work in iOS Safari.
$('a').click(function(event) {
event.isDefaultPrevented; // returns true in Chrome (if event.preventDefault() was called)
event.defaultPrevented; // the "correct" way to do it as per MDN docs, however, it doesn't work in Chrome nor iOS.
});
This is the way to do it, if you're using jQuery.
$('a').click(function(event) {
event.originalEvent.defaultPrevented; // aparently jQuery will alter the event property, but it stores everything in 'originalEvent'
});

Some Javascript is not working until hitting F12 in IE 11

The Javascript code is working correctly in Firefox and Chrome, but for IE(I am using 11),it's not working until I hit F12 for debugging. And there is also no error displayed in debugger in IE. Any idea why?
The first function is to check if the browser support classList or not, apparently, IE doesn't support it. Here is the code:
function checkClassListSupport() {
var supportsClassList = ({}).toString.call(document.body.classList) == "[object DOMTokenList]";
return supportsClassList;
}
It's working now if I remove the console.log code, or change the document module to "Edge".

Can't redefine Error.prototype.toString in Google Chrome

I am trying to redefine method toString of Error.prototype object, I can't do it in Google Chrome Canary, but I can do it in Firefox.
You can try to do it by your own, here is the code:
Error.prototype.toString = () => 'booooka'
throw new Error('Message, that have never been shown') // "booooka" in Firefox, "Message" in Google Chrome
What is a problem doing this in Google Chrome?
How I can do this in Google Chrome?
Firefox: 57.0.4
Chrome: 66.0.3356.0 (Official Build) canary (64-bit)
P.S. I have tried to paste this code to jsbin/jsfiddle, but I have the same result as in the Chrome. I am confused, maybe you can help me with that.
Thank you.
Adding to the previous answer, if you do :
throw new Error('Message, that have never been shown').toString();
'bookah' will be shown, so the issue is related with the implementation of the Error class rather than with overriding prototype properties
Chrome lets you override toString just fine, but its console shows you the error’s stack instead of its toString(). Since the stack property is defined as an own property instead of being assigned to, there’s no neat way to override it (and possibly no way to override it period).
Consider this type of constructor:
const defineProperty = Object.defineProperty;
const Error = function () {
defineProperty(this, 'stack', {
configurable: true,
writable: true,
value: '…',
});
};
I’m not aware of any way at all to change the value of new Error().stack in this context compared to what the constructor set.
That’s probably a good thing, though. What’s your goal?

Why does CSS3Pie + Prototype 1.6.1 crash Internet Explorer 8

I'm trying to understand why Css3Pie used in conjunction with Prototype 1.6.1 crashes Internet Explorer 8. Why is this happening?
Relevant information
CSS3Pie [source code] is an Internet Explorer behavior (htc) that adds support for CSS3 properties like border-radius, gradients, etc.
The crash only happens in IE8, not IE7 or earlier.
The crash only happens in Prototype 1.6.1 [source code], not Prototype 1.6.0.x
The crash happens immediately on page load, I'm not even able to interact with the page.
The developer is aware of the issue but since he believes it is a Prototype issue (it may be), he may not be eager to fix it. There is both a forum post and GitHub bug report, but neither add much information.
This IE8 crash, which appears to have been fixed in a recent Windows update, was triggered by Prototype's tinkering with DOM object prototypes followed by the application of the CSS3Pie behavior. In Protoype 1.6.1, it can be worked around by setting ElementExtensions and SpecificElementExtensions to false on the Prototype.BrowserFeatures object and modifying the checkDeficiency function to return true immediately.
It's a good start, but then it stops working under other browsers (ie. firefox, chrome). Instead you should add at the beginning of each function (ElementExtensions, SpecificElementExtensions, checkDeficiency) a check for IE 8 then return false for the Extensions anonymous functions and return true for the checkDeficiency function.
ElementExtensions: (function() {
if (isIE8) return false;
...
SpecificElementExtensions: (function() {
if (isIE8) return false;
...
function checkDeficiency(tagName) {
if (isIE8) return true;
...
var isIE8 = (function(){
return ((navigator.userAgent.indexOf('MSIE')!=-1) && (document.documentMode==8));
})();

Categories