Getting TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode

Question

I have the following jQuery code:

$(document).ready(function() {

  $('.btn-create-post-card').on('click', function(event) {
    event.preventDefault();
    let form_data = new FormData(),
      file = $('.input_file_button');
    // if(!file.val()) {
    //     alert('Please select postcard you want to send')
    // }
    form_data.append("file", file.prop('files')[0]);
    $.ajax({
      url: "/sendEmail",
      dataType: 'multipart/form-data',
      cache: false,
      contentType: false,
      processData: false,
      data: form_data,
      type: 'post',
      success: function(data) {
        alert('OK');
      },
      error: function(error, status) {
        console.log('here');
        console.log(error);
        alert(error);
      }
    });
  });
});

And I'm getting this error:

TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them
    at Function.remoteFunction (:2:14)

Console output is:

As you can see the response is successful and I've used jQuery AJAX calls a lot before and never had this issue.

Updated:

console output:

abort: ƒ (e)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 1
    name: "abort"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
always: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "always"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
catch: ƒ (e)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 1
    name: "catch"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
done: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "add"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
fail: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "add"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
getAllResponseHeaders: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "getAllResponseHeaders"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
getResponseHeader: ƒ (e)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 1
    name: "getResponseHeader"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
overrideMimeType: ƒ (e)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 1
    name: "overrideMimeType"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
pipe: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "pipe"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
progress: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "add"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
promise: ƒ (e)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 1
    name: "promise"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
readyState: 4
responseText: ""can't upload file""
setRequestHeader: ƒ (e,t)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 2
    name: "setRequestHeader"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
state: ƒ ()
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 0
    name: "state"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
status: 200
statusCode: ƒ (e)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 1
    name: "statusCode"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
statusText: "OK"
then: ƒ (t,r,i)
    arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.remoteFunction (<anonymous>:2:14)]
    length: 3
    name: "then"
    prototype: {constructor: ƒ}
    __proto__: ƒ ()
    [[FunctionLocation]]: jquery.min.js:2
    [[Scopes]]: Scopes[3]
__proto__: Object

Answer 1

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/caller:

If the function f was invoked by the top-level code, the value of f.caller is null; otherwise it's the function that called f. If the function that called f is a strict mode function, the value of f.caller is also null.

In strict mode, accessing caller of a function throws an error. This is to prevent a function from being able to "walk the stack", which both poses security risks and severely limits the possibility of optimizations like inlining and tail-call optimization. For more explanation, you can read the rationale for the deprecation of arguments.callee.

Note that the only behavior specified by the ECMAScript specification is that Function.prototype has an initial caller accessor that unconditionally throws a TypeError for any get or set request (known as a "poison pill accessor"), and that implementations are not allowed to change this semantic for any function except non-strict plain functions, in which case it must not have the value of a strict mode function. The actual behavior of the caller property, if it's anything other than throwing an error, is implementation-defined. For example, Chrome defines it as an own data property, while Firefox and Safari extend the initial poison-pill Function.prototype.caller accessor to specially handle this values that are non-strict functions.

Answer 2

I found the issue: it was in dataType: 'multipart/form-data' and, after I remove it, everything is working.

I think it worked on a different machine because the browser version on that machine does not support strict mode.

Answer 3

I don't think strict mode is the error, it's just that the console can't get the contents of the arguments array in strict mode. The status is 200 so it looks like the ajax call worked, but the response text says "can't upload file", so I think the error is on the server side.

Update with TypeError example:

That TypeError just says the console can't get the values the arguments array when using strict mode. It's not an error with the code. The simple example in the image demonstrates this.