validar - ¿Es posible simular document.cookie en JavaScript?

leer cookie javascript

Question

document.cookie es como una cadena, pero no es una cadena. Para citar el ejemplo del documento de Mozilla :

document.cookie = "name=oeschger";
document.cookie = "favorite_food=tripe";
alert(document.cookie);
// displays: name=oeschger;favorite_food=tripe

Si intentara hacer una cookie simulada usando solo una cadena, no obtendría los mismos resultados:

var mockCookie = "";
mockCookie = "name=oeschger";
mockCookie = "favorite_food=tripe";
alert(mockCookie);
// displays: favorite_food=tripe

Entonces, si desea probar un módulo que opera en la cookie, y si desea usar una cookie simulada para esas pruebas, ¿podría hacerlo? ¿Cómo?

Answer 1

Esta implementación permite sobrescribir las cookies y agrega document.clearCookies()

(function (document) {
    var cookies = {};
    document.__defineGetter__(''cookie'', function () {
        var output = [];
        for (var cookieName in cookies) {
            output.push(cookieName + "=" + cookies[cookieName]);
        }
        return output.join(";");
    });
    document.__defineSetter__(''cookie'', function (s) {
        var indexOfSeparator = s.indexOf("=");
        var key = s.substr(0, indexOfSeparator);
        var value = s.substring(indexOfSeparator + 1);
        cookies[key] = value;
        return key + "=" + value;
    });
    document.clearCookies = function () {
        cookies = {};
    };
})(document);

Answer 2

La respuesta de @Felix Kling es correcta, solo quería señalar que hay una sintaxis alternativa para definir los definidores y captadores en ECMAScript 5:

function MockCookie() {
  this.str = '''';
  this.__defineGetter__(''cookie'', function() {
    return this.str;
  });
  this.__defineSetter__(''cookie'', function(s) {
    this.str += (this.str ? '';'' : '''') + s;
    return this.str;
  });
}
var mock = new MockCookie();
mock.cookie = ''name=oeschger'';
mock.cookie = ''favorite_food=tripe'';
mock.cookie; // => "name=oeschger;favorite_food=tripe"

Y nuevamente, la mayoría de los navegadores son compatibles con ECMAScript 5 (definido por ECMA-262 5th Edition) pero no con MSIE (o JScript).

Answer 3

Me di cuenta de que el jazmín tiene spyOnProperty que se puede usar para cuando se quiere espiar a los captadores y establecedores de objetos. Así que resolví mi problema con esto:

const cookie: string = ''my-cookie=cookievalue;'';    
spyOnProperty(document, ''cookie'', ''get'').and.returnValue(cookie);

Answer 4

Personalmente no pude secuestrar el objeto de documento. Una solución simple que parece funcionar para mí fue la siguiente ...

En la parte superior de mi script de prueba defino un objeto fakeCookie:

var fakeCookie = {
    cookies: [],
    set: function (k, v) {
        this.cookies[k] = v;
    },
    get: function (k) {
        return this.cookies[k];
    },
    reset: function () {
        this.cookies = [];
    }
};

Luego en mi beforeEach () defino mi código auxiliar de cookie. Esto básicamente intercepta las llamadas a jQuery.cookie y (¡en su lugar!) Llama a la función de devolución de llamada que he definido (ver más abajo):

beforeEach(function() {
    var cookieStub = sinon.stub(jQuery, "cookie", function() {
        if (arguments.length > 1) {
            fakeCookie.set(arguments[0], arguments[1]);
        }
        else {
            return fakeCookie.get(arguments[0]);
        }
    });
});

Cada vez que obtengo o establezco un valor de cookie, utiliza mi fakeCookie en lugar del jQuery.cookie real. Para ello, observa el número de parámetros pasados ​​y deduce si se trata de obtener / establecer. Literalmente, puse esto y todo funcionó directamente. ¡¡Espero que esto ayude!!

Answer 5

Podría crear un objeto con un configurador de cookie y getter. Aquí hay una implementación muy simple:

var mock = {
    value_: '''', 

    get cookie() {
        return this.value_;
    },

    set cookie(value) {
        this.value_ += value + '';'';
    }
};

Aunque podría no funcionar en todos los navegadores (especialmente IE). Actualización: ¡Solo funciona en navegadores que soportan ECMAScript 5!

Más sobre getter y setters .

mock.cookie = "name=oeschger";
mock.cookie = "favorite_food=tripe";
alert(mock.cookie);
// displays: name=oeschger;favorite_food=tripe;

DEMO

Answer 6

Sé que este es un tema antiguo, pero en mi caso era necesario que las cookies expiraran, por lo que aquí hay una solución que combina las respuestas anteriores y una llamada a setTimeout para que expiren las cookies después de X segundos:

const fakeCookies = {
    // cookie jar
    all: {},

    // timeouts
    timeout: {},

    // get a cookie
    get: function(name)
    {
        return this.all[ name ]
    },

    // set a cookie
    set: function(name, value, expires_seconds)
    {
        this.all[ name ] = value;

        if ( expires_seconds ) {
            ! this.timeout[ name ] || clearTimeout( this.timeout[ name ] )
            this.timeout[ name ] = setTimeout(() => this.unset(name), parseFloat(expires_seconds) * 1000)
        }
    },

    // delete a cookie
    unset: function(name)
    {
        delete this.all[ name ]
    }    
}