¿Cómo falsificar la respuesta de jquery.ajax()?

6 minutos de lectura

¿Cómo falsificar la respuesta de jquery.ajax()?
StuperUsuario

Estoy escribiendo algunas pruebas de QUnit para un JavaScript que realiza llamadas AJAX.

Por aislamiento sobrescribo $.ajax para escribir la matriz de parámetros de una llamada AJAX a una variable. Esto funciona para probar cómo los métodos usan las funciones AJAX, pero tengo dificultades para probar el controlador de éxito de $.load()

De la documentación en http://api.jquery.com/load/:

Cuando se detecta una respuesta exitosa (es decir, cuando textStatus es “éxito” o “no modificado”), .load() establece el contenido HTML del elemento coincidente con los datos devueltos.

Entonces, intenté devolver un objeto que contiene objetos con el mismo nombre que las variables para el controlador de éxito:

    //Mock ajax function
    $.ajax = function (param) {
        _mockAjaxOptions = param;
        var fakeAjaxSuccess = { responseText: "success", textStatus: "success", XMLHttpRequest: "success" };
        return fakeAjaxSuccess;
    };

Pero este enfoque no ha funcionado.

¿Cómo puedo replicar el comportamiento de una llamada AJAX exitosa?

¿Cómo falsificar la respuesta de jquery.ajax()?
usuario1634074

Esta pregunta tiene algunos años y para las nuevas versiones de jQuery ha cambiado un poco.

Para hacer esto con Jasmin puedes probar El enfoque de Michael Falaga

Solución

  function ajax_response(response) {
    var deferred = $.Deferred().resolve(response);
    return deferred.promise;
  }

con jazmín

  describe("Test test", function() {
    beforeEach(function() {
      spyOn($, 'ajax').and.returnValue(
        ajax_response([1, 2, 3])
      );
    });
    it("is it [1, 2, 3]", function() {
      var response;
      $.ajax('GET', 'some/url/i/fancy').done(function(data) {
        response = data;
      });
      expect(response).toEqual([1, 2, 3]);
    });
  });

sin jazmín

  $.ajax = ajax_response([1, 2, 3]);
  $.ajax('GET', 'some/url/i/fancy').done(function(data) {
     console.log(data); // [1, 2, 3]
  });
 

  • +uno Muchas gracias.

    – whitesiroi

    18 dic. 15 en 05:29

  • yo obtengo ajax is not a function es: {state: ƒ, always: ƒ, catch: ƒ, pipe: ƒ...

    – toscano

    05 mayo 2020 en 05:18

  • @Toskan Tuve el mismo problema. Supongo que esta respuesta era correcta en 2015, pero a partir de mi escritura de hoy, el “return deferred.promise();” línea devuelve un OBJETO. Desea cambiar esto a “return deferred.promise;”, para que devuelva la FUNCIÓN de promesa.

    –David Alan Condit

    01 jun.


  • no use diferido: stackoverflow.com/questions/63783936/…

    – Jiří

    6 ene a las 15:47

Después de leer inspirado por @Robusto y @Val, encontré un método que funciona:

//Mock ajax function
$.ajax = function (param) {
    _mockAjaxOptions = param;
    //call success handler
    param.complete("data", "textStatus", "jqXHR");
};

En lugar de generar el evento desde cualquier código $.ajax real o desencadenar cualquier evento, hago que mi objeto ajax falso llame a la función (que se pasa como un parámetro a $.ajax()) como parte de mi función falsa.

  • Hubiera hecho lo mismo aunque oculté la llamada $.ajax detrás de otro método para facilitar el intercambio en mis pruebas.

    – Pedro Smith

    19 jun.

  • Aunque tal vez sea tarde, pero es posible que hayas estado buscando github.com/appendto/jquery-mockjax

    – xhh

    02 sep.

  • @xhh ese es un marco bastante bueno para configurar valores de retorno.

    – StuperUser

    03 sep.

  • @PeterSmith, ¿por qué agregaste otra función? Dado que JS se escribe dinámicamente, puede sobrescribirlo in situ. ¿Le dio algún beneficio además de la encapsulación?

    – StuperUser

    03 sep.

  • y que haces exactamente con esto _mockAjaxOptions variable no declarada que parece flotar en el aire?

    – vsync

    26 mar. 14 a las 14:30


¿Cómo falsificar la respuesta de jquery.ajax()?
gfullam

Usar un cierre para anular $.ajax con una respuesta ficticia

Después de probar la respuesta aceptada y la respuesta publicada por el usuario 1634074, ideé esta combinación simple y flexible de las dos.

En su forma más básica…

function ajax_response(response) {
  return function (params) {
    params.success(response);
  };
}
$.ajax = ajax_response('{ "title": "My dummy JSON" }');

En el ejemplo anterior, defina una función ajax_response() que acepta alguna cadena JSON como argumento (o cualquier cantidad de argumentos personalizados útiles para simular una respuesta) y devuelve una función de cierre anónima que se asignará a $.ajax como anulación de las pruebas unitarias.

La función anónima acepta una params argumento que contendrá el objeto de configuración pasado al $.ajax función. Y usa los argumentos pasados ​​a la función externa para simular una respuesta del servidor. En este ejemplo, siempre simula una respuesta exitosa del servidor, simplemente invocando el success devolución de llamada y proporcionándole el JSON ficticio.

Es fácil de reconfigurar…

function ajax_response(response, success) {
  return function (params) {
    if (success) {
      params.success(response);
    } else {
      params.error(response);
    }
  };
}

// Simulate success
$.ajax = ajax_response('{ "title": "My dummy JSON." }', true); 
doAsyncThing(); // Function that calls $.ajax

// Simulate error
$.ajax = ajax_response('{ "error": "Who is the dummy now?" }', false); 
doAsyncThing(); // Function that calls $.ajax

A continuación podemos verlo en acción…

/* FUNCTION THAT MAKES AJAX REQUEST */
function doAsyncThing() {
  $.ajax({
    type: "POST",
    url: "somefile.php",
    // data: {…},
    success: function (results) {
      var json = $.parseJSON(results),
          html = $('#ids').html();
      $('#ids').html(html + '<br />' + json.id);
    }
  });
}

/* BEGIN MOCK TEST */
// CREATE CLOSURE TO RETURN DUMMY FUNCTION AND FAKE RESPONSE
function ajax_response(response) {
  return function (params) {
    params.success(response);
  };
}

var n = prompt("Number of AJAX calls to make", 10);

for (var i = 1; i <= n; ++i) {
  
  // OVERRIDE $.ajax WITH DUMMY FUNCTION AND FAKE RESPONSE
  $.ajax = ajax_response('{ "id": ' + i + ' }');
  doAsyncThing();
}
/* END MOCK TEST */
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="ids">IDs:</p>

¿Cómo falsificar la respuesta de jquery.ajax()?
rey viernes

Simular $.ajax según sea necesario sin molestar a jQuery

Las respuestas aquí son buenas, pero tenían una necesidad específica de crear una respuesta falsa a una sola llamada de API y dejar todas las demás llamadas de API iguales hasta que se construyó el servicio de back-end para poder continuar creando cosas en la interfaz de usuario.

El objeto API usa $.ajax bajo el capó para que pueda llamar a un método API así:

api.products({ price: { $lt: 150, tags: ['nike', 'shoes'] } })
.done(function(json) {
  // do something with the data
})
.error(function(err) {
  // handle error
});

Este método hace el truco:

function mockAjax(options) {
  var that = {
    done: function done(callback) {
      if (options.success)
        setTimeout(callback, options.timeout, options.response);
      return that;
    },
    error: function error(callback) {
      if (!options.success)
        setTimeout(callback, options.timeout, options.response);
      return that;
    }
  };
  return that;
}

Luego anule una sola llamada api sin tocar $.ajax:

api.products = function() {
  return mockAjax({
    success: true,
    timeout: 500,
    response: {
      results: [
        { upc: '123123', name: 'Jordans' },
        { upc: '4345345', name: 'Wind Walkers' }
      ]
    }
  });
};

https://jsfiddle.net/Lsf3ezaz/2/

Mire la documentación de jQuery: verá que la configuración de Ajax proporciona una serie de otras condiciones que se prueban. Si hace que todos apunten a su fakeAjaxSuccess, podría lograr su objetivo.

Alternativamente, envuelva su $.ajax llame a su propia función y haga que lo llame, simplemente llame a su controlador de eventos con el fakeAjaxSuccess objeto.

¿Cómo falsificar la respuesta de jquery.ajax()?
Comunidad

Creo que el siguiente enlace debería ayudar. en cuanto a un parámetro no estoy tan seguro pero podría ser.

$.fn.ajax.success =  function (){
  ///the rest goest here
}

¿Anular la función jQuery .val ()?

¿Cómo falsificar la respuesta de jquery.ajax()?
Pandilla de Weston

Aquí hay una solución de trabajo simple

var set_ajax_response = function(data){
  $.ajax = $.Deferred().resolve(data).promise;
}

var data = [1,2,3];

set_ajax_response(data);

  • no use diferido: stackoverflow.com/questions/63783936/…

    – Jiří

    6 ene a las 15:48

.

¿Ha sido útil esta solución?