Add a same site cookie option (#246)

Author: Krishna Rajendran

src/amplitude-client.js

@@ -98,6 +98,7 @@ AmplitudeClient.prototype.init = function init(apiKey, opt_userId, opt_config, o
       expirationDays: this.options.cookieExpiration,
       domain: this.options.domain,
       secure: this.options.secureCookie,
+      sameSite: this.options.sameSiteCookie
     });
     this.options.domain = this.cookieStorage.options().domain;
 
@@ -786,7 +787,8 @@ AmplitudeClient.prototype.setDomain = function setDomain(domain) {
     this.cookieStorage.options({
       expirationDays: this.options.cookieExpiration,
       secure: this.options.secureCookie,
-      domain: domain
+      domain: domain,
+      sameSite: this.options.sameSiteCookie
     });
     this.options.domain = this.cookieStorage.options().domain;
     _loadCookieData(this);

src/base-cookie.js

@@ -39,7 +39,9 @@ const set = (name, value, opts) => {
   if (opts.secure) {
     str += '; Secure';
   }
-  str += '; SameSite=Lax';
+  if (opts.sameSite) {
+    str += '; SameSite=' + opts.sameSite;
+  }
   document.cookie = str;
 };
 

src/cookie.js

@@ -70,6 +70,7 @@ var options = function(opts) {
 
   _options.expirationDays = opts.expirationDays;
   _options.secure = opts.secure;
+  _options.sameSite = opts.sameSite;
 
   var domain = (!utils.isEmptyString(opts.domain)) ? opts.domain : '.' + topDomain(getLocation().href);
   var token = Math.random();

src/options.js

@@ -16,6 +16,7 @@ export default {
   batchEvents: false,
   cookieExpiration: 365 * 10,
   cookieName: 'amplitude_id',
+  sameSiteCookie: 'None',
   deviceIdFromUrlParam: false,
   domain: '',
   eventUploadPeriodMillis: 30 * 1000, // 30s

test/amplitude-client.js

@@ -9,6 +9,7 @@ import queryString from 'query-string';
 import Identify from '../src/identify.js';
 import Revenue from '../src/revenue.js';
 import constants from '../src/constants.js';
+import { mockCookie, restoreCookie, getCookie } from './mock-cookie';
 
 // maintain for testing backwards compatability
 describe('AmplitudeClient', function() {
@@ -34,6 +35,7 @@ describe('AmplitudeClient', function() {
   function reset() {
     localStorage.clear();
     sessionStorage.clear();
+    restoreCookie();
     cookie.remove(amplitude.options.cookieName);
     cookie.remove(amplitude.options.cookieName + keySuffix);
     cookie.remove(amplitude.options.cookieName + '_new_app');
@@ -74,6 +76,24 @@ describe('AmplitudeClient', function() {
       assert.ok(onInitCalled);
     });
 
+    it('should set the Secure flag on cookie with the secureCookie option', () => {
+      mockCookie();
+      amplitude.init(apiKey, null, { secureCookie: true });
+      assert.include(getCookie('amplitude_id_' + apiKey).options, 'Secure');
+    });
+
+    it('should set the SameSite cookie option to None by default', () => {
+      mockCookie();
+      amplitude.init(apiKey);
+      assert.include(getCookie('amplitude_id_' + apiKey).options, 'SameSite=None');
+    });
+
+    it('should set the sameSite option on a cookie with the sameSiteCookie Option', () => {
+      mockCookie();
+      amplitude.init(apiKey, null, {sameSiteCookie: 'Strict'});
+      assert.include(getCookie('amplitude_id_' + apiKey).options, 'SameSite=Strict');
+    });
+
     it('should immediately invoke onInit callbacks if already initialized', function() {
       let onInitCalled = false;
       amplitude.init(apiKey);
@@ -3352,6 +3372,7 @@ describe('setVersionName', function() {
       assert.lengthOf(server.requests, 1, 'should have sent a request to Amplitude');
       assert.equal(events[0].event_type, '$identify');
     });
+
     describe('prior to opting into analytics', function () {
       beforeEach(function () {
         reset();

test/base-cookie.js

@@ -0,0 +1,24 @@
+import cookie from '../src/base-cookie';
+import { mockCookie, restoreCookie, getCookie } from './mock-cookie';
+
+describe('cookie', function() {
+  beforeEach(() => {
+    mockCookie();
+  })
+
+  afterEach(() => {
+    restoreCookie();
+  });
+
+  describe('set', () => {
+    it('should set the secure flag with the secure option', () => {
+      cookie.set('key', 'val', {secure: true});
+      assert.include(getCookie('key').options, 'Secure');
+    })
+
+    it('should set the same site value with the sameSite option', () => {
+      cookie.set('key', 'val', {sameSite: "Lax"});
+      assert.include(getCookie('key').options, 'SameSite=Lax');
+    })
+  })
+});

test/mock-cookie.js

@@ -0,0 +1,36 @@
+let rawCookieData = {};
+
+let isMocked = false;
+
+export const mockCookie = () => {
+  isMocked = true;
+
+  document.__defineGetter__('cookie', function () {
+    return Object.keys(rawCookieData).map(key => `${key}=${rawCookieData[key].val}`).join(";");
+  });
+
+  document.__defineSetter__('cookie', function (str) {
+    const indexEquals = str.indexOf("=");
+    const key = str.substr(0, indexEquals);
+    const remainingStr = str.substring(str + 1);
+    const splitSemi = remainingStr.split(';').map((str)=> str.trim());
+
+    rawCookieData[key] = {
+      val: splitSemi[0],
+      options: splitSemi.slice(1)
+    };
+    return str;
+  });
+};
+
+export const restoreCookie = () => {
+  if (isMocked) {
+    delete document['cookie'];
+    rawCookieData = {};
+    isMocked = false;
+  }
+};
+
+export const getCookie = (key) => {
+  return rawCookieData[key];
+};

test/tests.js

@@ -11,3 +11,4 @@ import './amplitude.js';
 import './amplitude-client.js';
 import './utils.js';
 import './revenue.js';
+import './base-cookie.js';