54

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: enter image description here

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
9
  • 1
    Please share the actual output of the console instead of an image of it. Commented Sep 12, 2018 at 15:27
  • 2
    are you using strict mode
    – brk
    Commented Sep 12, 2018 at 15:28
  • I found that strict mode is used in jquery, but I'm not using it in my code Commented Sep 12, 2018 at 15:29
  • 2
    Are you transforming your code with babel or webpack? If so, "use strict" might leak into other parts of the code depending on how it's configured. Do you happen to know which library adds the remoteFunction() method to the Function prototype? Is that part of JQuery? You might have to isolate that module. Caller, callee and arguments cannot be used in strict mode, so alot of libraries that rely on these have to be updated or isolated from any scopes that have "use strict".
    – Shilly
    Commented Sep 12, 2018 at 15:37
  • nope, I'm not using babel and webpack, I'm just adding scripts directly to the page (it's a simple app, no need to configure webpack for it). I'm using: <script src="js/jquery.min.js"></script> <script src="js/slick.min.js"></script> Commented Sep 12, 2018 at 15:43

3 Answers 3

10

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.

Example of TypeError

3
  • well, "can't upload file" it's just a dummy message, for now. It's hardcoded message. So I do not see how it can affect. Commented Sep 12, 2018 at 18:20
  • 6
    It looks like your ajax call is working. That TypeError is not an error with your code. Commented Sep 12, 2018 at 19:48
  • Maybe I need to add dome specific header to response? I set ContentType to applicatiin/json and body is json string. So looks likevrequest is good and code is okay Commented Sep 12, 2018 at 20:09
8

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.

0
5

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.

Not the answer you're looking for? Browse other questions tagged or ask your own question.