Is it possible to mock document.cookie in JavaScript?

Question

document.cookie is like a string, but it is not a string. To quote the example from the Mozilla doc:

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

If you tried to make a mock cookie using only a string, you would not get the same results:

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

So, if you wanted to unit test a module that operates on the cookie, and if you wanted to use a mock cookie for those tests, could you? How?

Answer 1

You could create an object with a cookie setter and getter. Here is a very simple implementation:

var mock = {     value_: '',       get cookie() {         return this.value_;     },      set cookie(value) {         this.value_ += value + ';';     } }; 

Might not work in all browsers though (especially IE). Update: It only works in browsers supporting ECMAScript 5!

More about getter and setters.

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

DEMO

Answer 2

This implementation allows overwriting cookies, and adds 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);