Suite: RUM-Agent integration [WIP]

.github/workflows/ci-cd.yml

@@ -58,7 +58,7 @@ jobs:
         run: BUILD_BRANCH=$(echo "${GITHUB_REF#refs/heads/}") npm run build
 
       - name: Store assets
-        if: ${{ github.event_name == 'push' && (github.ref == 'refs/heads/development' || github.ref == 'refs/heads/master') }}
+        if: ${{ github.event_name == 'push' && (github.ref == 'refs/heads/rum-agent-integration/suite' || github.ref == 'refs/heads/master') }}
         uses: actions/upload-artifact@v3
         with:
           name: assets
@@ -69,7 +69,7 @@ jobs:
     name: Upload assets
     runs-on: ubuntu-20.04
     needs: build
-    if: ${{ github.event_name == 'push' && github.ref == 'refs/heads/development' }}
+    if: ${{ github.event_name == 'push' && github.ref == 'refs/heads/rum-agent-integration/suite' }}
     strategy:
       matrix:
         environment:

CHANGES.txt

@@ -2,7 +2,7 @@
  - Updated @splitsoftware/splitio-commons package to version 1.9.1. This update removes the handler for 'unload' DOM events, that can prevent browsers from being able to put pages in the back/forward cache for faster back and forward loads (Related to issue https://github.com/splitio/javascript-client/issues/759).
 
 10.23.0 (July 18, 2023)
- - Updated @splitsoftware/splitio-commons package to version 1.8.4 that includes minor improvements:
+ - Updated @splitsoftware/splitio-commons package to version 1.9.0 that includes minor improvements:
     - Updated streaming architecture implementation to apply feature flag updates from the notification received which is now enhanced, improving efficiency and reliability of the whole update system.
 
 10.22.6 (July 6, 2023)

karma/e2e.suite.karma.conf.js

@@ -0,0 +1,20 @@
+const assign = require('lodash/assign');
+
+module.exports = function(config) {
+  'use strict';
+
+  config.set(assign({}, require('./config'), {
+    // list of files / patterns to load in the browser
+    files: [
+      '__tests__/suite/browser.spec.js'
+    ],
+    // prepare code for the browser using webpack
+    preprocessors: {
+      '__tests__/suite/browser.spec.js': ['webpack']
+    },
+
+    // level of logging
+    // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
+    logLevel: config.LOG_WARN
+  }));
+};

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splitsoftware/splitio",
-  "version": "10.23.1",
+  "version": "10.23.1-rc.3",
   "description": "Split SDK",
   "files": [
     "README.md",
@@ -12,6 +12,7 @@
     "es",
     "src",
     "scripts/ga-to-split-autorequire.js",
+    "suite",
     "client",
     "server"
   ],
@@ -40,7 +41,8 @@
     "node": ">=6"
   },
   "dependencies": {
-    "@splitsoftware/splitio-commons": "1.9.1",
+    "@splitsoftware/browser-rum-agent": "0.3.2-rc.0",
+    "@splitsoftware/splitio-commons": "1.9.2-rc.2",
     "@types/google.analytics": "0.0.40",
     "@types/ioredis": "^4.28.0",
     "bloom-filters": "^3.0.0",
@@ -100,13 +102,14 @@
     "check:version": "cross-env NODE_ENV=test tape -r ./ts-node.register src/settings/__tests__/defaults.spec.js",
     "test-browser": "npm run test-browser-unit && npm run test-browser-e2e",
     "test-browser-unit": "cross-env NODE_ENV=test karma start karma/unit.karma.conf.js",
-    "test-browser-e2e": "npm run test-browser-e2e-online && npm run test-browser-e2e-offline && npm run test-browser-e2e-destroy && npm run test-browser-e2e-errorCatching && npm run test-browser-e2e-push && npm run test-browser-e2e-gaIntegration",
+    "test-browser-e2e": "npm run test-browser-e2e-online && npm run test-browser-e2e-offline && npm run test-browser-e2e-destroy && npm run test-browser-e2e-errorCatching && npm run test-browser-e2e-push && npm run test-browser-e2e-gaIntegration && npm run test-browser-e2e-suite",
     "test-browser-e2e-online": "cross-env NODE_ENV=test karma start karma/e2e.online.karma.conf.js",
     "test-browser-e2e-offline": "cross-env NODE_ENV=test karma start karma/e2e.offline.karma.conf.js",
     "test-browser-e2e-destroy": "cross-env NODE_ENV=test karma start karma/e2e.destroy.karma.conf.js",
     "test-browser-e2e-errorCatching": "cross-env NODE_ENV=test karma start karma/e2e.errorCatching.karma.conf.js",
     "test-browser-e2e-push": "cross-env NODE_ENV=test karma start karma/e2e.push.karma.conf.js",
     "test-browser-e2e-gaIntegration": "cross-env NODE_ENV=test karma start karma/e2e.gaIntegration.karma.conf.js",
+    "test-browser-e2e-suite": "cross-env NODE_ENV=test karma start karma/e2e.suite.karma.conf.js",
     "test-node": "npm run test-node-unit && npm run test-node-e2e",
     "test-node-unit": "cross-env NODE_ENV=test tape -r ./ts-node.register \"src/*/**/__tests__/**/!(browser).spec.js\" | tap-min",
     "test-node-e2e": "npm run test-node-e2e-online && npm run test-node-e2e-offline && npm run test-node-e2e-destroy && npm run test-node-e2e-errorCatching && npm run test-node-e2e-push && npm run test-node-e2e-redis",

src/__tests__/destroy/browser.spec.js

@@ -19,7 +19,7 @@ const settings = settingsFactory({
 });
 
 fetchMock.getOnce(url(settings, '/splitChanges?since=-1'), { status: 200, body: splitChangesMock1 });
-fetchMock.getOnce(url(settings, '/splitChanges?since=-1500492097547'), { status: 200, body: splitChangesMock2 });
+fetchMock.getOnce(url(settings, '/splitChanges?since=1500492097547'), { status: 200, body: splitChangesMock2 });
 fetchMock.getOnce(url(settings, '/mySegments/ut1'), { status: 200, body: mySegmentsMock });
 fetchMock.getOnce(url(settings, '/mySegments/ut2'), { status: 200, body: mySegmentsMock });
 fetchMock.getOnce(url(settings, '/mySegments/ut3'), { status: 200, body: mySegmentsMock });

src/__tests__/destroy/node.spec.js

@@ -18,7 +18,7 @@ import splitChangesMock2 from '../mocks/splitChanges.since.1500492097547.json';
 import impressionsMock from '../mocks/impressions.json';
 
 fetchMock.get(url(settings, '/splitChanges?since=-1'), { status: 200, body: splitChangesMock1 });
-fetchMock.get(url(settings, '/splitChanges?since=-1500492097547'), { status: 200, body: splitChangesMock2 });
+fetchMock.get(url(settings, '/splitChanges?since=1500492097547'), { status: 200, body: splitChangesMock2 });
 fetchMock.postOnce(url(settings, '/v1/metrics/config'), 200);
 
 tape('SDK destroy for NodeJS', async function (assert) {

src/__tests__/suite/browser.spec.js

@@ -0,0 +1,165 @@
+import sinon from 'sinon';
+import tape from 'tape-catch';
+import fetchMock from '../testUtils/fetchMock';
+import { url } from '../testUtils';
+import { settingsFactory } from '../../settings';
+
+import splitChangesMock1 from '../mocks/splitChanges.since.-1.till.1500492097547.json';
+import splitChangesMock2 from '../mocks/splitChanges.since.1500492097547.json';
+import mySegmentsMock from '../mocks/mySegmentsEmpty.json';
+import { triggerPagehideEvent } from '../testUtils/browser';
+import { version } from '../../../node_modules/@splitsoftware/browser-rum-agent/package.json';
+
+// Test target
+import { SplitSuite } from '../../factory/browserSuite';
+
+tape('Split Suite: Browser SDK & RUM Agent', async function (assert) {
+  const config = {
+    core: {
+      authorizationKey: 'fake-key',
+      key: 'ut1'
+    },
+    streamingEnabled: false,
+    rumAgent: {
+      prefix: 'prefix'
+    }
+  };
+
+  // Mock fetch requests
+  const settings = settingsFactory(config);
+  fetchMock.getOnce(url(settings, '/splitChanges?since=-1'), { status: 200, body: splitChangesMock1 });
+  fetchMock.getOnce(url(settings, '/splitChanges?since=1500492097547'), { status: 200, body: splitChangesMock2 });
+  fetchMock.getOnce(url(settings, '/mySegments/ut1'), { status: 200, body: mySegmentsMock });
+  fetchMock.getOnce(url(settings, '/mySegments/ut2'), { status: 200, body: mySegmentsMock });
+  fetchMock.getOnce(url(settings, '/mySegments/ut3'), { status: 200, body: mySegmentsMock });
+  fetchMock.postOnce(url(settings, '/v1/metrics/config'), 200); // 0.1% sample rate
+
+  const suite = SplitSuite(config);
+
+  // Assert RUM-Agent is properly configured
+  assert.deepEqual(window.SplitRumAgent.__getConfig(), {
+    i: [], a: 'fake-key', p: {},
+    prefix: settings.rumAgent.prefix,
+    url: settings.urls.events,
+    log: settings.log,
+    userConsent: settings.userConsent,
+    pushRate: 30, queueSize: 5000, // RUM Agent has its own push rate and queue size
+  }, 'RUM Agent is properly configured.');
+  assert.deepEqual(window.SplitRumAgent.getIdentities(), [], 'No identities are added to the RUM Agent until clients are retrieved.');
+
+  const client = suite.client();
+  assert.deepEqual(window.SplitRumAgent.getIdentities(), [{ key: config.core.key, trafficType: 'user' }], 'Identity for the main client.');
+
+  const client2 = suite.client('ut2');
+  const client3 = suite.client('ut3', 'tt2');
+  assert.deepEqual(window.SplitRumAgent.getIdentities(), [{
+    key: config.core.key, trafficType: 'user'
+  }, {
+    key: 'ut2', trafficType: 'user'
+  }, {
+    key: 'ut3', trafficType: 'tt2'
+  }], 'Identity for the main and shared clients.');
+
+  window.SplitRumAgent.track('custom-event-for-all-clients');
+
+  const manager = suite.manager();
+
+  client.track('tt2', 'eventType', 1);
+  client2.track('tt', 'eventType', 2);
+  client3.track('otherEventType', 3);
+
+  // Assert we are sending the impressions while doing the destroy
+  fetchMock.postOnce(url(settings, '/testImpressions/bulk'), 200);
+
+  // Assert we are sending the impressions count while doing the destroy
+  fetchMock.postOnce(url(settings, '/testImpressions/count'), 200);
+
+  // Assert we are sending events tracked by SDK clients, while doing the destroy
+  fetchMock.postOnce(url(settings, '/events/bulk'), (url, opts) => {
+    const events = JSON.parse(opts.body);
+
+    /* 3 events were pushed */
+    assert.equal(events.length, 3, 'Should flush all events on destroy.');
+
+    const firstEvent = events[0];
+    const secondEvent = events[1];
+    const thirdEvent = events[2];
+
+    assert.equal(firstEvent.trafficTypeName, 'tt2', 'The flushed events should match the events on the queue.');
+    assert.equal(firstEvent.eventTypeId, 'eventType', 'The flushed events should match the events on the queue.');
+    assert.equal(firstEvent.value, 1, 'The flushed events should match the events on the queue.');
+    assert.equal(secondEvent.trafficTypeName, 'tt', 'The flushed events should match the events on the queue.');
+    assert.equal(secondEvent.eventTypeId, 'eventType', 'The flushed events should match the events on the queue.');
+    assert.equal(secondEvent.value, 2, 'The flushed events should match the events on the queue.');
+    assert.equal(thirdEvent.trafficTypeName, 'tt2', 'The flushed events should match the events on the queue.');
+    assert.equal(thirdEvent.eventTypeId, 'otherEventType', 'The flushed events should match the events on the queue.');
+    assert.equal(thirdEvent.value, 3, 'The flushed events should match the events on the queue.');
+
+    return 200;
+  });
+
+  await client.ready();
+
+  assert.equal(client.getTreatment('Single_Test'), 'on');
+  assert.equal(client2.getTreatment('Single_Test'), 'on');
+  assert.equal(client3.getTreatment('Single_Test'), 'on');
+  assert.ok(manager.splits().length > 0, 'control assertion');
+  assert.ok(manager.names().length > 0, 'control assertion');
+  assert.ok(manager.split('Single_Test'), 'control assertion');
+
+  // Assert that the RUM Agent flush events on pagehide event
+  const sendBeaconSpy = sinon.spy(window.navigator, 'sendBeacon');
+  triggerPagehideEvent();
+
+  const eventsCallArgs = sendBeaconSpy.firstCall.args;
+  assert.equal(eventsCallArgs[0], url(settings, '/events/beacon'), 'assert correct url');
+  const parsedPayload = JSON.parse(eventsCallArgs[1]);
+  assert.equal(parsedPayload.token, 'fake-key', 'assert correct payload token');
+  assert.equal(parsedPayload.sdk, 'jsrum-' + version, 'assert correct sdk version');
+  assert.deepEqual(parsedPayload.entries.map(event => ({ eventTypeId: event.eventTypeId, key: event.key, trafficTypeName: event.trafficTypeName })), [
+    { trafficTypeName: 'user', key: 'ut1', eventTypeId: 'prefix.custom-event-for-all-clients' },
+    { trafficTypeName: 'user', key: 'ut2', eventTypeId: 'prefix.custom-event-for-all-clients' },
+    { trafficTypeName: 'tt2', key: 'ut3', eventTypeId: 'prefix.custom-event-for-all-clients' },
+    { trafficTypeName: 'user', key: 'ut1', eventTypeId: 'prefix.time.to.dom.interactive' },
+    { trafficTypeName: 'user', key: 'ut2', eventTypeId: 'prefix.time.to.dom.interactive' },
+    { trafficTypeName: 'tt2', key: 'ut3', eventTypeId: 'prefix.time.to.dom.interactive' },
+    { trafficTypeName: 'user', key: 'ut1', eventTypeId: 'prefix.page.load.time' },
+    { trafficTypeName: 'user', key: 'ut2', eventTypeId: 'prefix.page.load.time' },
+    { trafficTypeName: 'tt2', key: 'ut3', eventTypeId: 'prefix.page.load.time' },
+  ], 'assert correct entries');
+
+  // Events are not sent again
+  triggerPagehideEvent();
+  assert.equal(sendBeaconSpy.callCount, 3, 'sendBeacon should have been called 3 times');
+  assert.ok(sendBeaconSpy.firstCall.calledWith(url(settings, '/events/beacon')), 'RUM Agent events');
+  assert.ok(sendBeaconSpy.secondCall.calledWith(url(settings, '/testImpressions/beacon')), 'SDK impressions');
+  assert.ok(sendBeaconSpy.thirdCall.calledWith(url(settings, '/events/beacon')), 'SDK events');
+
+  // Updating user consent should update the RUM Agent user consent
+  assert.ok(suite.UserConsent.setStatus(false));
+  assert.equal(suite.UserConsent.getStatus(), 'DECLINED');
+  assert.equal(window.SplitRumAgent.getUserConsent(), 'DECLINED');
+
+  assert.ok(suite.UserConsent.setStatus(true));
+  assert.equal(suite.UserConsent.getStatus(), 'GRANTED');
+  assert.equal(window.SplitRumAgent.getUserConsent(), 'GRANTED');
+
+  assert.notOk(suite.UserConsent.setStatus('invalid'));
+  assert.equal(suite.UserConsent.getStatus(), 'GRANTED');
+  assert.equal(window.SplitRumAgent.getUserConsent(), 'GRANTED');
+
+  // Calls `client.destroy()` for all clients
+  const destroyPromise = suite.destroy();
+  assert.equal(client.getTreatment('Single_Test'), 'control', 'After destroy, getTreatment returns control for every destroyed client.');
+  assert.deepEqual(client2.getTreatments(['Single_Test']), { 'Single_Test': 'control' }, 'After destroy, getTreatments returns map of controls for every destroyed client.');
+  assert.notOk(client3.track('tt', 'eventType', 2), 'After destroy, track calls return false.');
+  assert.equal(manager.splits().length, 0, 'After the main client is destroyed, manager.splits will return empty array');
+  assert.equal(manager.names().length, 0, 'After the main client is destroyed, manager.names will return empty array');
+  assert.equal(manager.split('Single_Test'), null, 'After the main client is destroyed, manager.split will return null');
+
+  await destroyPromise;
+  fetchMock.restore();
+  sendBeaconSpy.restore();
+
+  assert.end();
+});