@dotcms/experiments 1.4.0-next.1 → 1.4.0-next.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.esm.js +103 -10
- package/package.json +1 -1
- package/src/index.d.ts +0 -1
- package/src/lib/components/DotExperimentHandlingComponent.d.ts +0 -20
- package/src/lib/components/DotExperimentsProvider.d.ts +0 -47
- package/src/lib/components/withExperiments.d.ts +0 -20
- package/src/lib/contexts/DotExperimentsContext.d.ts +0 -12
- package/src/lib/dot-experiments.d.ts +0 -289
- package/src/lib/hooks/useExperimentVariant.d.ts +0 -17
- package/src/lib/hooks/useExperiments.d.ts +0 -14
- package/src/lib/shared/constants.d.ts +0 -95
- package/src/lib/shared/mocks/mock.d.ts +0 -43
- package/src/lib/shared/models.d.ts +0 -209
- package/src/lib/shared/parser/parser.d.ts +0 -54
- package/src/lib/shared/persistence/index-db-database-handler.d.ts +0 -87
- package/src/lib/shared/utils/DotLogger.d.ts +0 -15
- package/src/lib/shared/utils/memoize.d.ts +0 -7
- package/src/lib/shared/utils/utils.d.ts +0 -73
- package/src/lib/standalone.d.ts +0 -7
package/index.esm.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
1
|
import { createContext, useContext, useState, useEffect, useRef, useCallback } from 'react';
|
|
3
2
|
import { UVE_MODE } from '@dotcms/types';
|
|
4
3
|
import { getUVEState } from '@dotcms/uve';
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
5
|
import { jitsuClient } from '@jitsu/sdk-js';
|
|
6
6
|
|
|
7
7
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
@@ -1664,6 +1664,7 @@ const useExperimentVariant = data => {
|
|
|
1664
1664
|
viewAs
|
|
1665
1665
|
} = data;
|
|
1666
1666
|
const variantId = viewAs == null ? void 0 : viewAs.variantId;
|
|
1667
|
+
|
|
1667
1668
|
// By default, wait for the variant
|
|
1668
1669
|
const [shouldWaitForVariant, setShouldWaitForVariant] = useState(true);
|
|
1669
1670
|
useEffect(() => {
|
|
@@ -1673,6 +1674,7 @@ const useExperimentVariant = data => {
|
|
|
1673
1674
|
setShouldWaitForVariant(false);
|
|
1674
1675
|
return;
|
|
1675
1676
|
}
|
|
1677
|
+
|
|
1676
1678
|
// If variantId is not provided, show content and warn
|
|
1677
1679
|
if (!variantId) {
|
|
1678
1680
|
// eslint-disable-next-line no-console
|
|
@@ -1719,14 +1721,14 @@ const DotExperimentHandlingComponent = _ref => {
|
|
|
1719
1721
|
shouldWaitForVariant
|
|
1720
1722
|
} = useExperimentVariant(props.page);
|
|
1721
1723
|
if (shouldWaitForVariant) {
|
|
1722
|
-
return jsx("div", {
|
|
1724
|
+
return /*#__PURE__*/jsx("div", {
|
|
1723
1725
|
style: {
|
|
1724
1726
|
visibility: 'hidden'
|
|
1725
1727
|
},
|
|
1726
|
-
children: jsx(WrappedComponent, Object.assign({}, props))
|
|
1728
|
+
children: /*#__PURE__*/jsx(WrappedComponent, Object.assign({}, props))
|
|
1727
1729
|
});
|
|
1728
1730
|
}
|
|
1729
|
-
return jsx(WrappedComponent, Object.assign({}, props));
|
|
1731
|
+
return /*#__PURE__*/jsx(WrappedComponent, Object.assign({}, props));
|
|
1730
1732
|
};
|
|
1731
1733
|
|
|
1732
1734
|
var NATIVE_BIND$1 = functionBindNative;
|
|
@@ -4279,6 +4281,7 @@ if (DESCRIPTORS$3 && !('size' in URLSearchParamsPrototype)) {
|
|
|
4279
4281
|
*
|
|
4280
4282
|
* @constant {string}
|
|
4281
4283
|
*/
|
|
4284
|
+
|
|
4282
4285
|
/**
|
|
4283
4286
|
* The default variant name for an experiment.
|
|
4284
4287
|
*
|
|
@@ -4286,12 +4289,14 @@ if (DESCRIPTORS$3 && !('size' in URLSearchParamsPrototype)) {
|
|
|
4286
4289
|
* @constant
|
|
4287
4290
|
*/
|
|
4288
4291
|
const EXPERIMENT_DEFAULT_VARIANT_NAME = 'DEFAULT';
|
|
4292
|
+
|
|
4289
4293
|
/**
|
|
4290
4294
|
* The key used to store or retrieve the information in the SessionStore
|
|
4291
4295
|
*
|
|
4292
4296
|
* @constant {string}
|
|
4293
4297
|
*/
|
|
4294
4298
|
const EXPERIMENT_QUERY_PARAM_KEY = 'variantName';
|
|
4299
|
+
|
|
4295
4300
|
/**
|
|
4296
4301
|
* The key used to store or retrieve the information in the SessionStore
|
|
4297
4302
|
* indicating whether an experiment has already been checked.
|
|
@@ -4299,6 +4304,7 @@ const EXPERIMENT_QUERY_PARAM_KEY = 'variantName';
|
|
|
4299
4304
|
* @constant {string}
|
|
4300
4305
|
*/
|
|
4301
4306
|
const EXPERIMENT_ALREADY_CHECKED_KEY = 'experimentAlreadyCheck';
|
|
4307
|
+
|
|
4302
4308
|
/**
|
|
4303
4309
|
* EXPERIMENT_FETCH_EXPIRE_TIME is a constant that represents the name of the variable used to store
|
|
4304
4310
|
* the expire time for experiment fetching. It is a string value 'experimentFetchExpireTime'.
|
|
@@ -4306,6 +4312,7 @@ const EXPERIMENT_ALREADY_CHECKED_KEY = 'experimentAlreadyCheck';
|
|
|
4306
4312
|
* @constant {string}
|
|
4307
4313
|
*/
|
|
4308
4314
|
const EXPERIMENT_FETCH_EXPIRE_TIME_KEY = 'experimentFetchExpireTime';
|
|
4315
|
+
|
|
4309
4316
|
/**
|
|
4310
4317
|
* The duration in milliseconds for which data should be stored in the local storage.
|
|
4311
4318
|
*
|
|
@@ -4315,6 +4322,7 @@ const EXPERIMENT_FETCH_EXPIRE_TIME_KEY = 'experimentFetchExpireTime';
|
|
|
4315
4322
|
*
|
|
4316
4323
|
*/
|
|
4317
4324
|
const LOCAL_STORAGE_TIME_DURATION_MILLISECONDS = 86400 * 1000;
|
|
4325
|
+
|
|
4318
4326
|
/**
|
|
4319
4327
|
* API_EXPERIMENTS_URL
|
|
4320
4328
|
*
|
|
@@ -4324,6 +4332,7 @@ const LOCAL_STORAGE_TIME_DURATION_MILLISECONDS = 86400 * 1000;
|
|
|
4324
4332
|
* @constant
|
|
4325
4333
|
*/
|
|
4326
4334
|
const API_EXPERIMENTS_URL = 'api/v1/experiments/isUserIncluded';
|
|
4335
|
+
|
|
4327
4336
|
/**
|
|
4328
4337
|
* The name of the experiment database store in indexDB.
|
|
4329
4338
|
*
|
|
@@ -4331,24 +4340,26 @@ const API_EXPERIMENTS_URL = 'api/v1/experiments/isUserIncluded';
|
|
|
4331
4340
|
* @constant
|
|
4332
4341
|
*/
|
|
4333
4342
|
const EXPERIMENT_DB_STORE_NAME = 'dotExperimentStore';
|
|
4343
|
+
|
|
4334
4344
|
/**
|
|
4335
4345
|
* The path to the key in the database IndexDB representing the running experiment data.
|
|
4336
4346
|
* @type {string}
|
|
4337
4347
|
*/
|
|
4338
4348
|
const EXPERIMENT_DB_KEY_PATH = 'running_experiment';
|
|
4349
|
+
|
|
4339
4350
|
/**
|
|
4340
4351
|
* Enumeration of debug levels.
|
|
4341
4352
|
*
|
|
4342
4353
|
* @enum {string}
|
|
4343
4354
|
* @readonly
|
|
4344
4355
|
*/
|
|
4345
|
-
|
|
4346
|
-
(function (DEBUG_LEVELS) {
|
|
4356
|
+
let DEBUG_LEVELS = /*#__PURE__*/function (DEBUG_LEVELS) {
|
|
4347
4357
|
DEBUG_LEVELS["NONE"] = "NONE";
|
|
4348
4358
|
DEBUG_LEVELS["DEBUG"] = "DEBUG";
|
|
4349
4359
|
DEBUG_LEVELS["WARN"] = "WARN";
|
|
4350
4360
|
DEBUG_LEVELS["ERROR"] = "ERROR";
|
|
4351
|
-
|
|
4361
|
+
return DEBUG_LEVELS;
|
|
4362
|
+
}({});
|
|
4352
4363
|
const PAGE_VIEW_EVENT_NAME = 'pageview';
|
|
4353
4364
|
|
|
4354
4365
|
var $$6 = _export;
|
|
@@ -6269,6 +6280,7 @@ const parseDataForAnalytics = (experiments, location) => {
|
|
|
6269
6280
|
}))
|
|
6270
6281
|
};
|
|
6271
6282
|
};
|
|
6283
|
+
|
|
6272
6284
|
/**
|
|
6273
6285
|
* This utility function performs regular expression (regex) matching on a supplied URL.
|
|
6274
6286
|
*
|
|
@@ -6290,6 +6302,7 @@ const verifyRegex = (regexToCheck, href) => {
|
|
|
6290
6302
|
return false;
|
|
6291
6303
|
}
|
|
6292
6304
|
};
|
|
6305
|
+
|
|
6293
6306
|
/**
|
|
6294
6307
|
* This function merges newly fetched data with the data stored from IndexedDB, preparing it for re-storage in IndexedDB.
|
|
6295
6308
|
*
|
|
@@ -6329,6 +6342,7 @@ const parseData = (fetchExperiments, storedExperiments) => {
|
|
|
6329
6342
|
}
|
|
6330
6343
|
return dataToStorage;
|
|
6331
6344
|
};
|
|
6345
|
+
|
|
6332
6346
|
/**
|
|
6333
6347
|
* Retrieves the array of experiment IDs from the given AssignedExperiments..
|
|
6334
6348
|
*
|
|
@@ -6336,6 +6350,7 @@ const parseData = (fetchExperiments, storedExperiments) => {
|
|
|
6336
6350
|
* @param experiments
|
|
6337
6351
|
*/
|
|
6338
6352
|
const getExperimentsIds = experiments => experiments.map(experiment => experiment.id) || [];
|
|
6353
|
+
|
|
6339
6354
|
/**
|
|
6340
6355
|
* Sets the expire time for new experiments based on the current time.
|
|
6341
6356
|
* The expire time is calculated by adding the expireMillis value of each experiment's lookBackWindow to the current time (Date.now()).
|
|
@@ -6351,6 +6366,7 @@ const addExpireTimeToExperiments = experiments => {
|
|
|
6351
6366
|
})
|
|
6352
6367
|
}));
|
|
6353
6368
|
};
|
|
6369
|
+
|
|
6354
6370
|
/**
|
|
6355
6371
|
* Returns an array of experiments that have not expired yet.
|
|
6356
6372
|
*
|
|
@@ -6367,6 +6383,11 @@ const getUnexpiredExperiments = (experiments, excludedExperimentIdsEnded) => {
|
|
|
6367
6383
|
});
|
|
6368
6384
|
};
|
|
6369
6385
|
|
|
6386
|
+
/**
|
|
6387
|
+
* Represents the configuration for a database connection.
|
|
6388
|
+
* @interface
|
|
6389
|
+
*/
|
|
6390
|
+
|
|
6370
6391
|
/**
|
|
6371
6392
|
* The default version of the database.
|
|
6372
6393
|
*
|
|
@@ -6374,6 +6395,7 @@ const getUnexpiredExperiments = (experiments, excludedExperimentIdsEnded) => {
|
|
|
6374
6395
|
* @constant
|
|
6375
6396
|
*/
|
|
6376
6397
|
const DB_DEFAULT_VERSION = 1;
|
|
6398
|
+
|
|
6377
6399
|
/**
|
|
6378
6400
|
* The `DatabaseHandler` class offers specific methods to store and get data
|
|
6379
6401
|
* from IndexedDB.
|
|
@@ -6391,6 +6413,7 @@ const DB_DEFAULT_VERSION = 1;
|
|
|
6391
6413
|
* await DatabaseHandler.persistData(anAssignedExperiment);
|
|
6392
6414
|
*
|
|
6393
6415
|
*/
|
|
6416
|
+
|
|
6394
6417
|
class IndexDBDatabaseHandler {
|
|
6395
6418
|
constructor(config) {
|
|
6396
6419
|
this.config = config;
|
|
@@ -6412,6 +6435,7 @@ class IndexDBDatabaseHandler {
|
|
|
6412
6435
|
throw new Error("'db_key_path' is required in config");
|
|
6413
6436
|
}
|
|
6414
6437
|
}
|
|
6438
|
+
|
|
6415
6439
|
/**
|
|
6416
6440
|
* Saves the provided data to indexDB.
|
|
6417
6441
|
*
|
|
@@ -6433,6 +6457,7 @@ class IndexDBDatabaseHandler {
|
|
|
6433
6457
|
};
|
|
6434
6458
|
});
|
|
6435
6459
|
}
|
|
6460
|
+
|
|
6436
6461
|
/**
|
|
6437
6462
|
* Retrieves data from the database using a specific key.
|
|
6438
6463
|
*
|
|
@@ -6449,6 +6474,7 @@ class IndexDBDatabaseHandler {
|
|
|
6449
6474
|
request.onerror = () => reject(request.error);
|
|
6450
6475
|
});
|
|
6451
6476
|
}
|
|
6477
|
+
|
|
6452
6478
|
/**
|
|
6453
6479
|
* Deletes all the data from the IndexedDB store.
|
|
6454
6480
|
*
|
|
@@ -6465,6 +6491,7 @@ class IndexDBDatabaseHandler {
|
|
|
6465
6491
|
request.onerror = () => reject(request.error);
|
|
6466
6492
|
});
|
|
6467
6493
|
}
|
|
6494
|
+
|
|
6468
6495
|
/**
|
|
6469
6496
|
* Sets the flag indicating that the experiment has already been checked.
|
|
6470
6497
|
*
|
|
@@ -6474,6 +6501,7 @@ class IndexDBDatabaseHandler {
|
|
|
6474
6501
|
setFlagExperimentAlreadyChecked() {
|
|
6475
6502
|
sessionStorage.setItem(EXPERIMENT_ALREADY_CHECKED_KEY, 'true');
|
|
6476
6503
|
}
|
|
6504
|
+
|
|
6477
6505
|
/**
|
|
6478
6506
|
* Sets the fetch expired time in the local storage.
|
|
6479
6507
|
*
|
|
@@ -6483,6 +6511,7 @@ class IndexDBDatabaseHandler {
|
|
|
6483
6511
|
const expireTime = Date.now() + LOCAL_STORAGE_TIME_DURATION_MILLISECONDS;
|
|
6484
6512
|
localStorage.setItem(EXPERIMENT_FETCH_EXPIRE_TIME_KEY, expireTime.toString());
|
|
6485
6513
|
}
|
|
6514
|
+
|
|
6486
6515
|
/**
|
|
6487
6516
|
* Builds an error message based on the provided error object.
|
|
6488
6517
|
* @param {DOMException | null} error - The error object to build the message from.
|
|
@@ -6497,6 +6526,7 @@ class IndexDBDatabaseHandler {
|
|
|
6497
6526
|
}
|
|
6498
6527
|
return errorMessage;
|
|
6499
6528
|
}
|
|
6529
|
+
|
|
6500
6530
|
/**
|
|
6501
6531
|
* Creates or opens a IndexedDB database with the specified version.
|
|
6502
6532
|
*
|
|
@@ -6523,6 +6553,7 @@ class IndexDBDatabaseHandler {
|
|
|
6523
6553
|
};
|
|
6524
6554
|
});
|
|
6525
6555
|
}
|
|
6556
|
+
|
|
6526
6557
|
/**
|
|
6527
6558
|
* Retrieves the result of a database request from an Event object.
|
|
6528
6559
|
*
|
|
@@ -6539,6 +6570,8 @@ class IndexDBDatabaseHandler {
|
|
|
6539
6570
|
*/
|
|
6540
6571
|
class DotLogger {
|
|
6541
6572
|
constructor(isDebug, packageName) {
|
|
6573
|
+
this.isDebug = void 0;
|
|
6574
|
+
this.packageName = void 0;
|
|
6542
6575
|
this.isDebug = isDebug;
|
|
6543
6576
|
this.packageName = packageName;
|
|
6544
6577
|
}
|
|
@@ -6592,6 +6625,7 @@ const checkFlagExperimentAlreadyChecked = () => {
|
|
|
6592
6625
|
const flag = sessionStorage.getItem(EXPERIMENT_ALREADY_CHECKED_KEY);
|
|
6593
6626
|
return flag === 'true';
|
|
6594
6627
|
};
|
|
6628
|
+
|
|
6595
6629
|
/**
|
|
6596
6630
|
* Checks if the data needs to be invalidated based on the creation date.
|
|
6597
6631
|
*
|
|
@@ -6609,6 +6643,7 @@ const isDataCreateValid = () => {
|
|
|
6609
6643
|
return false;
|
|
6610
6644
|
}
|
|
6611
6645
|
};
|
|
6646
|
+
|
|
6612
6647
|
/**
|
|
6613
6648
|
* Ad to an absolute path the baseUrl depending on the location.
|
|
6614
6649
|
*
|
|
@@ -6630,6 +6665,7 @@ const isFullUrl = url => {
|
|
|
6630
6665
|
const pattern = /^https?:\/\//i;
|
|
6631
6666
|
return pattern.test(url);
|
|
6632
6667
|
};
|
|
6668
|
+
|
|
6633
6669
|
/**
|
|
6634
6670
|
* Updates the URL with the queryParam with the experiment variant name.
|
|
6635
6671
|
*
|
|
@@ -6647,6 +6683,7 @@ const updateUrlWithExperimentVariant = (location, variant) => {
|
|
|
6647
6683
|
}
|
|
6648
6684
|
return url.toString();
|
|
6649
6685
|
};
|
|
6686
|
+
|
|
6650
6687
|
/**
|
|
6651
6688
|
* Check if two arrays of Experiment objects are equal.
|
|
6652
6689
|
*
|
|
@@ -6660,6 +6697,7 @@ const objectsAreEqual = (obj1, obj2) => {
|
|
|
6660
6697
|
}
|
|
6661
6698
|
return JSON.stringify(obj1) === JSON.stringify(obj2);
|
|
6662
6699
|
};
|
|
6700
|
+
|
|
6663
6701
|
/**
|
|
6664
6702
|
* A function to redirect the user to a new URL.
|
|
6665
6703
|
*
|
|
@@ -6696,11 +6734,27 @@ class DotExperiments {
|
|
|
6696
6734
|
* @private
|
|
6697
6735
|
*/
|
|
6698
6736
|
this.initializationPromise = null;
|
|
6737
|
+
/**
|
|
6738
|
+
* Represents the analytics client for Analytics.
|
|
6739
|
+
* @private
|
|
6740
|
+
*/
|
|
6741
|
+
this.analytics = void 0;
|
|
6742
|
+
/**
|
|
6743
|
+
* Class representing a database handler for IndexDB.
|
|
6744
|
+
* @class
|
|
6745
|
+
*/
|
|
6746
|
+
this.persistenceHandler = void 0;
|
|
6699
6747
|
/**
|
|
6700
6748
|
* Represents the stored data in the IndexedDB.
|
|
6701
6749
|
* @private
|
|
6702
6750
|
*/
|
|
6703
6751
|
this.experimentsAssigned = [];
|
|
6752
|
+
/**
|
|
6753
|
+
* A logger utility for logging messages.
|
|
6754
|
+
*
|
|
6755
|
+
* @class
|
|
6756
|
+
*/
|
|
6757
|
+
this.logger = void 0;
|
|
6704
6758
|
/**
|
|
6705
6759
|
* Represents the current location.
|
|
6706
6760
|
* @private
|
|
@@ -6723,6 +6777,7 @@ class DotExperiments {
|
|
|
6723
6777
|
}
|
|
6724
6778
|
this.logger = new DotLogger(this.config.debug, 'DotExperiment');
|
|
6725
6779
|
}
|
|
6780
|
+
|
|
6726
6781
|
/**
|
|
6727
6782
|
* Retrieves the array of experiments assigned to an instance of the class.
|
|
6728
6783
|
*
|
|
@@ -6731,6 +6786,7 @@ class DotExperiments {
|
|
|
6731
6786
|
get experiments() {
|
|
6732
6787
|
return this.experimentsAssigned;
|
|
6733
6788
|
}
|
|
6789
|
+
|
|
6734
6790
|
/**
|
|
6735
6791
|
* Returns a custom redirect function. If a custom redirect function is not configured,
|
|
6736
6792
|
* the default redirect function will be used.
|
|
@@ -6742,6 +6798,7 @@ class DotExperiments {
|
|
|
6742
6798
|
var _this$config$redirect;
|
|
6743
6799
|
return (_this$config$redirect = this.config.redirectFn) != null ? _this$config$redirect : defaultRedirectFn;
|
|
6744
6800
|
}
|
|
6801
|
+
|
|
6745
6802
|
/**
|
|
6746
6803
|
* Retrieves the current location.
|
|
6747
6804
|
*
|
|
@@ -6750,6 +6807,7 @@ class DotExperiments {
|
|
|
6750
6807
|
get location() {
|
|
6751
6808
|
return this.currentLocation;
|
|
6752
6809
|
}
|
|
6810
|
+
|
|
6753
6811
|
/**
|
|
6754
6812
|
* Retrieves instance of DotExperiments class if it doesn't exist create a new one.
|
|
6755
6813
|
* If the instance does not exist, it creates a new instance with the provided configuration and calls the `getExperimentData` method.
|
|
@@ -6770,6 +6828,7 @@ class DotExperiments {
|
|
|
6770
6828
|
}
|
|
6771
6829
|
return DotExperiments.instance;
|
|
6772
6830
|
}
|
|
6831
|
+
|
|
6773
6832
|
/**
|
|
6774
6833
|
* Waits for the initialization process to be completed.
|
|
6775
6834
|
*
|
|
@@ -6779,6 +6838,7 @@ class DotExperiments {
|
|
|
6779
6838
|
var _this$initializationP;
|
|
6780
6839
|
return (_this$initializationP = this.initializationPromise) != null ? _this$initializationP : Promise.resolve();
|
|
6781
6840
|
}
|
|
6841
|
+
|
|
6782
6842
|
/**
|
|
6783
6843
|
* This method appends variant parameters to navigation links based on the provided navClass.
|
|
6784
6844
|
*
|
|
@@ -6822,6 +6882,7 @@ class DotExperiments {
|
|
|
6822
6882
|
});
|
|
6823
6883
|
}
|
|
6824
6884
|
}
|
|
6885
|
+
|
|
6825
6886
|
/**
|
|
6826
6887
|
* Retrieves the current debug status.
|
|
6827
6888
|
*
|
|
@@ -6831,6 +6892,7 @@ class DotExperiments {
|
|
|
6831
6892
|
getIsDebugActive() {
|
|
6832
6893
|
return this.config.debug;
|
|
6833
6894
|
}
|
|
6895
|
+
|
|
6834
6896
|
/**
|
|
6835
6897
|
* Updates the current location and checks if a variant should be applied.
|
|
6836
6898
|
* Redirects to the variant URL if necessary.
|
|
@@ -6867,6 +6929,7 @@ class DotExperiments {
|
|
|
6867
6929
|
this.logger.timeEnd('Total location changed');
|
|
6868
6930
|
this.logger.groupEnd();
|
|
6869
6931
|
}
|
|
6932
|
+
|
|
6870
6933
|
/**
|
|
6871
6934
|
* Tracks a page view event in the analytics system.
|
|
6872
6935
|
*
|
|
@@ -6876,6 +6939,7 @@ class DotExperiments {
|
|
|
6876
6939
|
this.track(PAGE_VIEW_EVENT_NAME);
|
|
6877
6940
|
this.prevLocation = this.currentLocation.href;
|
|
6878
6941
|
}
|
|
6942
|
+
|
|
6879
6943
|
/**
|
|
6880
6944
|
* This method is used to retrieve the variant associated with a given URL.
|
|
6881
6945
|
*
|
|
@@ -6894,6 +6958,7 @@ class DotExperiments {
|
|
|
6894
6958
|
});
|
|
6895
6959
|
return (experiment == null ? void 0 : experiment.variant) || null;
|
|
6896
6960
|
}
|
|
6961
|
+
|
|
6897
6962
|
/**
|
|
6898
6963
|
* Returns the experiment variant name as a URL search parameter.
|
|
6899
6964
|
*
|
|
@@ -6916,6 +6981,7 @@ class DotExperiments {
|
|
|
6916
6981
|
}
|
|
6917
6982
|
return new URLSearchParams(params);
|
|
6918
6983
|
}
|
|
6984
|
+
|
|
6919
6985
|
/**
|
|
6920
6986
|
* Determines whether a page view should be tracked.
|
|
6921
6987
|
*
|
|
@@ -6931,6 +6997,7 @@ class DotExperiments {
|
|
|
6931
6997
|
this.logger.log(`No send pageView. No experiments to track.`);
|
|
6932
6998
|
return false;
|
|
6933
6999
|
}
|
|
7000
|
+
|
|
6934
7001
|
// If the previous location is the same as the current location, we don't need to track the page view
|
|
6935
7002
|
if (this.prevLocation === this.currentLocation.href) {
|
|
6936
7003
|
this.logger.log(`No send pageView. Same location.`);
|
|
@@ -6938,6 +7005,7 @@ class DotExperiments {
|
|
|
6938
7005
|
}
|
|
6939
7006
|
return true;
|
|
6940
7007
|
}
|
|
7008
|
+
|
|
6941
7009
|
/**
|
|
6942
7010
|
* Tracks an event using the analytics service.
|
|
6943
7011
|
*
|
|
@@ -6950,6 +7018,7 @@ class DotExperiments {
|
|
|
6950
7018
|
this.logger.log(`${typeName} event sent`);
|
|
6951
7019
|
});
|
|
6952
7020
|
}
|
|
7021
|
+
|
|
6953
7022
|
/**
|
|
6954
7023
|
* Initializes the application using lazy initialization. This method performs
|
|
6955
7024
|
* necessary setup steps and should be invoked to ensure proper execution of the application.
|
|
@@ -6982,6 +7051,7 @@ class DotExperiments {
|
|
|
6982
7051
|
}();
|
|
6983
7052
|
}
|
|
6984
7053
|
}
|
|
7054
|
+
|
|
6985
7055
|
/**
|
|
6986
7056
|
* Fetches experiments from the server.
|
|
6987
7057
|
*
|
|
@@ -7027,6 +7097,7 @@ class DotExperiments {
|
|
|
7027
7097
|
this.logger.groupEnd();
|
|
7028
7098
|
}
|
|
7029
7099
|
}
|
|
7100
|
+
|
|
7030
7101
|
/**
|
|
7031
7102
|
* This method is responsible for retrieving and persisting experiment data from the server to the local indexDB database.
|
|
7032
7103
|
*
|
|
@@ -7049,11 +7120,13 @@ class DotExperiments {
|
|
|
7049
7120
|
experiments: []
|
|
7050
7121
|
};
|
|
7051
7122
|
const storedExperiments = this.experimentsAssigned ? this.experimentsAssigned : [];
|
|
7123
|
+
|
|
7052
7124
|
// Checks whether fetching experiment data from the server is necessary.
|
|
7053
7125
|
if (this.shouldFetchNewData()) {
|
|
7054
7126
|
fetchedExperiments = await this.getExperimentsFromServer();
|
|
7055
7127
|
}
|
|
7056
7128
|
const dataToPersist = parseData(fetchedExperiments, storedExperiments);
|
|
7129
|
+
|
|
7057
7130
|
// If my stored data is equal to my parsed data, I don't need to persist again
|
|
7058
7131
|
if (!objectsAreEqual(dataToPersist, storedExperiments)) {
|
|
7059
7132
|
this.experimentsAssigned = await this.persistExperiments(dataToPersist);
|
|
@@ -7063,6 +7136,7 @@ class DotExperiments {
|
|
|
7063
7136
|
throw Error(`Error persisting experiments to indexDB, ${e}`);
|
|
7064
7137
|
}
|
|
7065
7138
|
}
|
|
7139
|
+
|
|
7066
7140
|
/**
|
|
7067
7141
|
* Persists the parsed experiment data into the indexDB database.
|
|
7068
7142
|
*
|
|
@@ -7101,6 +7175,7 @@ class DotExperiments {
|
|
|
7101
7175
|
this.logger.groupEnd();
|
|
7102
7176
|
}
|
|
7103
7177
|
}
|
|
7178
|
+
|
|
7104
7179
|
/**
|
|
7105
7180
|
* Initializes the database handler.
|
|
7106
7181
|
*
|
|
@@ -7116,6 +7191,7 @@ class DotExperiments {
|
|
|
7116
7191
|
db_key_path: EXPERIMENT_DB_KEY_PATH
|
|
7117
7192
|
});
|
|
7118
7193
|
}
|
|
7194
|
+
|
|
7119
7195
|
/**
|
|
7120
7196
|
* Initializes the Jitsu analytics client.
|
|
7121
7197
|
*
|
|
@@ -7139,6 +7215,7 @@ class DotExperiments {
|
|
|
7139
7215
|
this.logger.log(`Error creating/updating analytics client: ${error}`);
|
|
7140
7216
|
}
|
|
7141
7217
|
}
|
|
7218
|
+
|
|
7142
7219
|
/**
|
|
7143
7220
|
* Updates the analytics client's data using the experiments data
|
|
7144
7221
|
* currently available in the IndexDB database, based on the current location.
|
|
@@ -7167,12 +7244,14 @@ class DotExperiments {
|
|
|
7167
7244
|
});
|
|
7168
7245
|
this.logger.log('No experiments data available to update analytics client.');
|
|
7169
7246
|
}
|
|
7247
|
+
|
|
7170
7248
|
// trigger the page view event
|
|
7171
7249
|
if (this.shouldTrackPageView()) {
|
|
7172
7250
|
this.trackPageView();
|
|
7173
7251
|
return;
|
|
7174
7252
|
}
|
|
7175
7253
|
}
|
|
7254
|
+
|
|
7176
7255
|
/**
|
|
7177
7256
|
* Determines whether analytics should be checked.
|
|
7178
7257
|
*
|
|
@@ -7196,6 +7275,7 @@ class DotExperiments {
|
|
|
7196
7275
|
this.logger.log(`Not should Check Analytics by now...`);
|
|
7197
7276
|
return false;
|
|
7198
7277
|
}
|
|
7278
|
+
|
|
7199
7279
|
/**
|
|
7200
7280
|
* Retrieves persisted data from the database.
|
|
7201
7281
|
*
|
|
@@ -7222,6 +7302,11 @@ class DotExperiments {
|
|
|
7222
7302
|
return storedData;
|
|
7223
7303
|
}
|
|
7224
7304
|
}
|
|
7305
|
+
/**
|
|
7306
|
+
* The instance of the DotExperiments class.
|
|
7307
|
+
* @private
|
|
7308
|
+
*/
|
|
7309
|
+
DotExperiments.instance = void 0;
|
|
7225
7310
|
/**
|
|
7226
7311
|
* Represents the default configuration for the DotExperiment library.
|
|
7227
7312
|
* @property {boolean} trackPageView - Specifies whether to track page view or not. Default value is true.
|
|
@@ -7264,6 +7349,7 @@ const useExperiments = instance => {
|
|
|
7264
7349
|
}
|
|
7265
7350
|
}
|
|
7266
7351
|
}, [instance]);
|
|
7352
|
+
|
|
7267
7353
|
/**
|
|
7268
7354
|
* This effect sets a click handler on the document.
|
|
7269
7355
|
* It captures click events and redirects to a new URL if the clicked anchor has a variant assigned,
|
|
@@ -7281,19 +7367,23 @@ const useExperiments = instance => {
|
|
|
7281
7367
|
const clickedHref = target.getAttribute('href');
|
|
7282
7368
|
if (clickedHref) {
|
|
7283
7369
|
const modifiedUrl = new URL(clickedHref, instance.location.href);
|
|
7370
|
+
|
|
7284
7371
|
// Remove the experiment query param from the URL
|
|
7285
7372
|
modifiedUrl.searchParams.delete(EXPERIMENT_QUERY_PARAM_KEY);
|
|
7286
7373
|
event.preventDefault();
|
|
7374
|
+
|
|
7287
7375
|
// Get the variant from the href of the clicked anchor
|
|
7288
7376
|
const variant = instance.getVariantFromHref(clickedHref);
|
|
7289
7377
|
if (variant && variant.name !== EXPERIMENT_DEFAULT_VARIANT_NAME) {
|
|
7290
7378
|
// Set the experiment query param in the URL if the variant is not the default one
|
|
7291
7379
|
modifiedUrl.searchParams.set(EXPERIMENT_QUERY_PARAM_KEY, variant.name);
|
|
7292
7380
|
}
|
|
7381
|
+
|
|
7293
7382
|
// Redirect to the new URL using the custom redirect function
|
|
7294
7383
|
instance.customRedirectFn(modifiedUrl.toString());
|
|
7295
7384
|
}
|
|
7296
7385
|
};
|
|
7386
|
+
|
|
7297
7387
|
// Register the click handler to all elements in the document
|
|
7298
7388
|
document.addEventListener('click', customClickHandler);
|
|
7299
7389
|
return () => {
|
|
@@ -7347,8 +7437,10 @@ const DotExperimentsProvider = ({
|
|
|
7347
7437
|
config
|
|
7348
7438
|
}) => {
|
|
7349
7439
|
const [instance, setInstance] = useState(null);
|
|
7440
|
+
|
|
7350
7441
|
// Run Experiments detection
|
|
7351
7442
|
useExperiments(instance);
|
|
7443
|
+
|
|
7352
7444
|
// Initialize the DotExperiments instance
|
|
7353
7445
|
useEffect(() => {
|
|
7354
7446
|
var _getUVEState;
|
|
@@ -7364,7 +7456,7 @@ const DotExperimentsProvider = ({
|
|
|
7364
7456
|
}
|
|
7365
7457
|
}
|
|
7366
7458
|
}, [config]);
|
|
7367
|
-
return jsx(DotExperimentsContext.Provider, {
|
|
7459
|
+
return /*#__PURE__*/jsx(DotExperimentsContext.Provider, {
|
|
7368
7460
|
value: instance,
|
|
7369
7461
|
children: children
|
|
7370
7462
|
});
|
|
@@ -7395,6 +7487,7 @@ function shallowEqual(objA, objB) {
|
|
|
7395
7487
|
}
|
|
7396
7488
|
return true;
|
|
7397
7489
|
}
|
|
7490
|
+
|
|
7398
7491
|
/**
|
|
7399
7492
|
* Memoizes an object and returns the memoized object.
|
|
7400
7493
|
* Mantaing the same reference if the object is the same independently if is called inside any component.
|
|
@@ -7427,9 +7520,9 @@ const withExperiments = (WrappedComponent, config) => {
|
|
|
7427
7520
|
// in each render, causing the experiment handling to be reinitialized.
|
|
7428
7521
|
const memoizedConfig = useMemoizedObject(config);
|
|
7429
7522
|
return useCallback(props => {
|
|
7430
|
-
return jsx(DotExperimentsProvider, {
|
|
7523
|
+
return /*#__PURE__*/jsx(DotExperimentsProvider, {
|
|
7431
7524
|
config: memoizedConfig,
|
|
7432
|
-
children: jsx(DotExperimentHandlingComponent, Object.assign({}, props, {
|
|
7525
|
+
children: /*#__PURE__*/jsx(DotExperimentHandlingComponent, Object.assign({}, props, {
|
|
7433
7526
|
WrappedComponent: WrappedComponent
|
|
7434
7527
|
}))
|
|
7435
7528
|
});
|
package/package.json
CHANGED
package/src/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './lib/components/withExperiments';
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { DotCMSLayoutBodyProps } from '@dotcms/react';
|
|
2
|
-
interface ExperimentHandlingProps extends DotCMSLayoutBodyProps {
|
|
3
|
-
WrappedComponent: React.ComponentType<DotCMSLayoutBodyProps>;
|
|
4
|
-
}
|
|
5
|
-
/**
|
|
6
|
-
* A React functional component that conditionally renders a WrappedComponent based on the
|
|
7
|
-
* experiment variant state. It uses the `useExperimentVariant` hook to determine if there's a
|
|
8
|
-
* variant mismatch. If the current variant does not match the assigned variant, it temporarily
|
|
9
|
-
* hides the WrappedComponent by rendering it with `visibility: hidden`. Once the correct variant
|
|
10
|
-
* is confirmed, it renders the WrappedComponent normally.
|
|
11
|
-
*
|
|
12
|
-
* @param {React.ComponentType<DotcmsPageProps>} WrappedComponent - The React component that will be
|
|
13
|
-
* conditionally rendered based on the experiment variant.
|
|
14
|
-
* @param {DotcmsPageProps} props - Props expected by the WrappedComponent, along with any additional
|
|
15
|
-
* props that extend from DotcmsPageProps.
|
|
16
|
-
* @returns {React.ReactElement} A React element that either renders the WrappedComponent hidden or visible
|
|
17
|
-
* based on the experiment variant.
|
|
18
|
-
*/
|
|
19
|
-
export declare const DotExperimentHandlingComponent: React.FC<ExperimentHandlingProps>;
|
|
20
|
-
export {};
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import { ReactElement, ReactNode } from 'react';
|
|
2
|
-
import { DotExperimentConfig } from '../shared/models';
|
|
3
|
-
interface DotExperimentsProviderProps {
|
|
4
|
-
children?: ReactNode;
|
|
5
|
-
config: DotExperimentConfig;
|
|
6
|
-
}
|
|
7
|
-
/**
|
|
8
|
-
* `DotExperimentsProvider` is a component that uses React's Context API to provide
|
|
9
|
-
* an instance of `DotExperiments` to all of its descendants.
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
* @component
|
|
13
|
-
* @example
|
|
14
|
-
* ```jsx
|
|
15
|
-
*
|
|
16
|
-
* // Your application component
|
|
17
|
-
* function App() {
|
|
18
|
-
*
|
|
19
|
-
* // Configuration options could be taken from environment variables or can send you own.
|
|
20
|
-
* const experimentConfig = {
|
|
21
|
-
* apiKey: process.env.NEXT_PUBLIC_EXPERIMENTS_API_KEY ,
|
|
22
|
-
* server: process.env.NEXT_PUBLIC_DOTCMS_HOST ,
|
|
23
|
-
* debug: process.env.NEXT_PUBLIC_EXPERIMENTS_DEBUG,
|
|
24
|
-
* redirectFn: YourRedirectFunction
|
|
25
|
-
* };
|
|
26
|
-
*
|
|
27
|
-
* return (
|
|
28
|
-
* <DotExperimentsProvider config={experimentConfig}>
|
|
29
|
-
* <Header>
|
|
30
|
-
* <Navigation items={nav} />
|
|
31
|
-
* </Header>
|
|
32
|
-
* <DotcmsLayout entity={{...}} config={{...}} />
|
|
33
|
-
* </DotExperimentsProvider>
|
|
34
|
-
* );
|
|
35
|
-
* }
|
|
36
|
-
* ```
|
|
37
|
-
*
|
|
38
|
-
* @param {object} props - The properties that define the `DotExperimentsProvider`.
|
|
39
|
-
* @param {ReactNode} props.children - The descendants of this provider, which will
|
|
40
|
-
* have access to the provided `DotExperiments` instance.
|
|
41
|
-
* @param {DotExperimentConfig} props.config - The configuration object for `DotExperiments`.
|
|
42
|
-
*
|
|
43
|
-
* @returns {ReactElement} The provider component, which should wrap the components
|
|
44
|
-
* that need access to the `DotExperiments` instance.
|
|
45
|
-
*/
|
|
46
|
-
export declare const DotExperimentsProvider: ({ children, config }: DotExperimentsProviderProps) => ReactElement;
|
|
47
|
-
export {};
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React, { ReactNode } from 'react';
|
|
2
|
-
import { DotCMSLayoutBodyProps } from '@dotcms/react';
|
|
3
|
-
import { DotExperimentConfig } from '../shared/models';
|
|
4
|
-
export interface PageProviderProps {
|
|
5
|
-
readonly entity: any;
|
|
6
|
-
readonly children: ReactNode;
|
|
7
|
-
}
|
|
8
|
-
/**
|
|
9
|
-
* Wraps a given component with experiment handling capabilities using the 'useExperimentVariant' hook.
|
|
10
|
-
* This HOC checks if the entity's assigned experiment variant differs from the currently displayed variant.
|
|
11
|
-
* If they differ, the content is hidden until the correct variant is displayed. Once the assigned variant
|
|
12
|
-
* matches the displayed variant, the content of the WrappedComponent is shown.
|
|
13
|
-
*
|
|
14
|
-
* @param {React.ComponentType<DotcmsPageProps>} WrappedComponent - The component to be enhanced.
|
|
15
|
-
* @param {DotExperimentConfig} config - Configuration for experiment handling, including any necessary
|
|
16
|
-
* redirection functions or other settings.
|
|
17
|
-
* @returns {React.FunctionComponent<DotcmsPageProps>} A component that wraps the original component,
|
|
18
|
-
* adding experiment handling based on the specified configuration.
|
|
19
|
-
*/
|
|
20
|
-
export declare const withExperiments: (WrappedComponent: React.ComponentType<DotCMSLayoutBodyProps>, config: DotExperimentConfig) => (props: DotCMSLayoutBodyProps) => import("react/jsx-runtime").JSX.Element;
|