Typeerror: Illegal Invocation on Console.Log.Apply

TypeError: Illegal Invocation on console.log.apply

It may not work in cases when execution context changed from console to any other object:

This is expected because console.info expects its "this" reference to
be console, not window.

console.info("stuff")
stuff
undefined
console.info.call(this, "stuff")
TypeError: Illegal invocation
console.info.call(console, "stuff")
stuff
undefined

This behavior is expected.

https://bugs.chromium.org/p/chromium/issues/detail?id=48662

Why does console.log.apply() throw an Illegal Invocation error?

console and log are host objects. Their behavior is implementation dependent, and to a large degree are not required to implement the semantics of ECMAScript.

FWIW, your jsBin fails in Chrome as well unless you change it to...

console.log.apply(console, ['message']);

but that seems to be that log simply anticipates a calling context of console.

Wrapper for console.log - Illegal invocation

console.log expects to be called as a method of console, i.e with console for the receiver (this argument, first parameter to apply). Currently you're passing this to apply, whatever this is (possibly the global object), it's not the console object. Use

function _log() {
    if (opts.debug) console.log.apply(console, arguments);
//                                    ^^^^^^^
}

Illegal Invocation error when console.log passed in a function

Change

o.printToConsole(console.log);

to

o.printToConsole(console.log.bind(console));

or

o.printToConsole(function(){ console.log.apply(console.log, arguments) });

The console.log function only works when the receiver (this) is the console (in fact, it's browser dependent).

Keep getting Uncaught TypeError: Illegal invocation?

getElementById requires a calling context of document. Use .bind to bind r to document:

var r = document.getElementById.bind(document);

Uncaught TypeError: Illegal invocation in Chrome

In your code you are assigning a native method to a property of custom object.
When you call support.animationFrame(function () {}) , it is executed in the context of current object (ie support). For the native requestAnimationFrame function to work properly, it must be executed in the context of window.

So the correct usage here is support.animationFrame.call(window, function() {});.

The same happens with alert too:

var myObj = {
  myAlert : alert //copying native alert to an object
};

myObj.myAlert('this is an alert'); //is illegal
myObj.myAlert.call(window, 'this is an alert'); // executing in context of window 

Another option is to use Function.prototype.bind() which is part of ES5 standard and available in all modern browsers.

var _raf = window.requestAnimationFrame ||
        window.mozRequestAnimationFrame ||
        window.webkitRequestAnimationFrame ||
        window.msRequestAnimationFrame ||
        window.oRequestAnimationFrame;

var support = {
   animationFrame: _raf ? _raf.bind(window) : null
};

what is an illegal invocation typeerror in javascript

The console.log function needs its calling context to be the console.

Use

alert = console.log.bind(console);

Or if you want to be compatible with old IE :

alert = function(){ console.log.apply(console, arguments) };

What is causing Uncaught TypeError: Illegal Invocation in this code?

You're missing two options for the $.ajax call, these

contentType: false,
processData: false,

Making it like this

$.ajax({
    xhr: function () {
        var xhr = new window.XMLHttpRequest();
        xhr.upload.addEventListener("progress", function (evt) {
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total * 100;
                console.log("percentComplete = " + percentComplete);
            } else {
                console.log("lengthComputable evaluated to false;")
            }
        }, false);

        xhr.addEventListener("progress", function (evt) {
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total * 100;
                console.log("percentComplete = " + percentComplete);
            } else {
                console.log("lengthComputable evaluated to false;")
            }
        }, false);

        return xhr;
    },
    type: 'POST',
    url: '@Url.Action("upload","FileUploadAsync")',
    data: data,
    contentType: false,
    processData: false,
    success: function (data) {
        console.log("success!");
    }
});

if you let jQuery process the files internally it throws an Illegal invocation error.

---

Related Topics