@fullstory/browser 1.4.7 → 1.5.0

package/CHANGELOG.md

@@ -1,6 +1,18 @@
 # Changelog
 
-## 1.4.5
+## 1.5.0
+
+- Adding the `setVars` API function
+
+## 1.4.10
+
+- Adding docs to the types file (index.d.ts)
+
+## 1.4.8
+
+- Updating README to better describe the behavior of the `recordCrossDomainIFrames` option
+
+## 1.4.7
 -  Updating README to include vue 3
 - `npm audit fix` to clean up npm audit warnings
 

package/README.md

@@ -29,7 +29,7 @@ The only required option is `orgId`, all others are optional.
 *  `orgId` -  Sets your FullStory Org Id. Find out how to get your Org Id [here](https://help.fullstory.com/hc/en-us/articles/360047075853).
 *  `debug` - When set to `true`, enables FullStory debug messages; defaults to `false`.
 * `namespace` - Sets the global identifier for FullStory when conflicts with `FS` arise; see [help](https://help.fullstory.com/hc/en-us/articles/360020624694-What-if-the-identifier-FS-is-used-by-another-script-on-my-site-).
-* `recordCrossDomainIFrames` - When set to `true`, FullStory is added to cross-domain IFrames and records content; defaults to `false`. Before using, you should understand the security implications, and configure your [Content Security Policy](https://www.html5rocks.com/en/tutorials/security/content-security-policy/) (CSP) HTTP headers accordingly - specifically the frame-ancestors directive. Failure to configure your CSP headers while using this setting can bypass IFrames security protections that are included in modern browsers.
+* `recordCrossDomainIFrames` - Defaults to `false`. FullStory can record cross-domain iFrames if: 1. The FullStory Browser SDK is running in the cross-domain iFrame and 2. `recordCrossDomainIFrames` is set to `true` in the cross-domain iFrame and 3. The FullStory Browser SDK is running in the parent page of the cross-domain iFrame. Click [here](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy) for a detailed explanation of what "cross-domain" means. Before using, you should understand the security implications, and configure your [Content Security Policy](https://www.html5rocks.com/en/tutorials/security/content-security-policy/) (CSP) HTTP headers accordingly - specifically the frame-ancestors directive. Failure to configure your CSP headers while using this setting can bypass IFrames security protections that are included in modern browsers. More information about cross-domain iFrame recording can be found on our [Knowledge Base](https://help.fullstory.com/hc/en-us/articles/360020622514-Can-FullStory-capture-content-that-is-presented-in-iframes-#2-the-outer-page-is-running-fullstory-and-you-have-iframes-runni). Note: the `recordCrossDomainIFrames` parameter is the same as the `window['_fs_run_in_iframe']` referenced in the KB article.
 * `recordOnlyThisIFrame` - When set to `true`, this tells FullStory that the IFrame is the "root" of the recording and should be its own session; defaults to `false`. Use this when your app is embedded in an IFrame on a site not running FullStory or when the site *is* running FullStory, but you want your content sent to a different FullStory org.
 * `devMode` - Set to `true` if you want to deactivate FullStory in your development environment. When set to `true`, FullStory will shutdown recording and all subsequent SDK method calls will be no-ops. At the time `init` is called with `devMode: true`, a single `event` call will be sent to FullStory to indicate that the SDK is in `devMode`; this is to help trouble-shoot the case that the SDK was accidentally set to `devMode: true` in a production environment. Additionally, any calls to SDK methods will `console.warn` that FullStory is in `devMode`. Defaults to `false`.
 
@@ -122,4 +122,17 @@ FullStory.event('Subscribed', {
 ```JavaScript
 const startOfPlayback = FullStory.getCurrentSessionURL();
 const playbackAtThisMomentInTime = FullStory.getCurrentSessionURL(true);
-```
+```
+
+### Sending custom page data
+```JavaScript
+FullStory.setVars('page', {
+ pageName : 'Checkout', // what is the name of the page?
+ cart_size_int : 10, // how many items were in the cart?
+ used_coupon_bool : true, // was a coupon used?
+});
+```
+For more information on setting page vars, view the FullStory help article on [Sending custom page data to FullStory](https://help.fullstory.com/hc/en-us/articles/1500004101581-FS-setVars-API-Sending-custom-page-data-to-FullStory).
+
+#### Note
+`FullStory.setVars(<scope>, <payload>)` currently only supports a string value of "page" for the scope. Using arbitrary strings for the scope parameter will result in an Error that will be logged to the browser console or discarded, depending on whether devMode or debug is enabled.

package/dist/index.d.ts

@@ -1,3 +1,15 @@
+/**
+ * FullStory Client SDK snippet options.
+ *
+ * - orgId: Reference for your [Org Id](https://help.fullstory.com/hc/en-us/articles/360047075853) listed in FullStory.
+ * - namespace: Global object name that contains the FullStory browser API methods and properties. Defaults to `FS`.
+ * - debug: Debug mode with extra browser console logging.
+ * - host: The recording server host domain. Can be set to direct recorded events to a proxy that you host. Defaults to `fullstory.com`.
+ * - script: FullStory script host domain. FullStory hosts the `fs.js` recording script on a CDN, but you can choose to host a copy yourself. Defaults to `edge.fullstory.com`.
+ * - recordCrossDomainIFrames: FullStory can record cross-domain iFrames. Defaults to `false`. Certain limitations apply and can be found [here](https://help.fullstory.com/hc/en-us/articles/360020622514-Can-FullStory-capture-content-that-is-presented-in-iframes-#h_01F1G333PYKPGZ4B42WDBV3YKV). 
+ * - recordOnlyThisIFrame: FullStory can record the iFrame as its own unique session. Defaults to `false`. Additional conditions apply and can be found [here](https://help.fullstory.com/hc/en-us/articles/360020622514-Can-FullStory-capture-content-that-is-presented-in-iframes-#h_01F1G33B40Q2TPQA8MA7SF8Y5P).
+ * - devMode: In dev mode FullStory won't record sessions. Any calls to SDK methods will `console.warn` that FullStory is in `devMode`. Defaults to `false`.
+ */
 interface SnippetOptions {
   orgId: string;
   namespace?: string;
@@ -5,7 +17,7 @@ interface SnippetOptions {
   host?: string;
   script?: string;
   recordCrossDomainIFrames?: boolean;
-  recordOnlyThisIFrame?: boolean;      // see README for details
+  recordOnlyThisIFrame?: boolean;
   devMode?: boolean;
 }
 
@@ -17,6 +29,8 @@ interface UserVars {
 
 type LogLevel = 'log' | 'info' | 'warn' | 'error' | 'debug';
 
+type VarScope = 'page';
+
 // API functions that are available as soon as the snippet has executed.
 export function anonymize(): void;
 export function consent(userConsents?: boolean): void;
@@ -28,6 +42,7 @@ export function log(msg: string): void;
 export function restart(): void;
 export function setUserVars(customVars: UserVars): void;
 export function shutdown(): void;
+export function setVars(varScope: VarScope, properties?: { [key: string]: any }): void;
 
 // API functions that are available after /rec/page returns.
 // FullStory bootstrapping details: https://help.fullstory.com/hc/en-us/articles/360032975773

package/dist/index.esm.js

@@ -155,6 +155,7 @@ var consent = guard('consent');
 var shutdown = guard('shutdown');
 var restart = guard('restart');
 var anonymize = guard('anonymize');
+var setVars = guard('setVars');
 
 var _init = function _init(options) {
   if (fs()) {
@@ -197,4 +198,4 @@ var initOnce = function initOnce(fn, message) {
 
 var init = initOnce(_init, 'FullStory init has already been called once, additional invocations are ignored');
 
-export { anonymize, consent, event, getCurrentSessionURL, identify, init, log, restart, setUserVars, shutdown };
+export { anonymize, consent, event, getCurrentSessionURL, identify, init, log, restart, setUserVars, setVars, shutdown };

package/dist/index.js

@@ -159,6 +159,7 @@ var consent = guard('consent');
 var shutdown = guard('shutdown');
 var restart = guard('restart');
 var anonymize = guard('anonymize');
+var setVars = guard('setVars');
 
 var _init = function _init(options) {
   if (fs()) {
@@ -210,4 +211,5 @@ exports.init = init;
 exports.log = log;
 exports.restart = restart;
 exports.setUserVars = setUserVars;
+exports.setVars = setVars;
 exports.shutdown = shutdown;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fullstory/browser",
-  "version": "1.4.7",
+  "version": "1.5.0",
   "description": "The official FullStory browser SDK",
   "repository": "git://github.com/fullstorydev/fullstory-browser-sdk.git",
   "homepage": "https://github.com/fullstorydev/fullstory-browser-sdk",
@@ -27,28 +27,27 @@
   ],
   "devDependencies": {
     "@babel/core": "^7.8.7",
+    "@babel/eslint-parser": "^7.16.5",
     "@babel/preset-env": "^7.10.4",
     "@babel/register": "^7.8.6",
-    "babel-eslint": "^10.1.0",
+    "@rollup/plugin-babel": "^5.3.0",
     "chai": "^4.1.2",
-    "eslint": "^5.16.0",
-    "eslint-config-airbnb": "^17.1.0",
+    "eslint": "^8.6.0",
+    "eslint-config-airbnb": "^19.0.4",
     "eslint-plugin-import": "^2.20.1",
-    "eslint-plugin-jsx-a11y": "^6.0.2",
-    "eslint-plugin-react": "^7.19.0",
-    "karma": "^5.0.4",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-react": "^7.28.0",
+    "karma": "^6.1.1",
     "karma-chai": "^0.1.0",
     "karma-chrome-launcher": "^3.1.0",
     "karma-mocha": "^2.0.1",
     "karma-spec-reporter": "0.0.32",
-    "karma-webpack": "^4.0.2",
-    "mocha": "^7.1.2",
+    "karma-webpack": "^5.0.0",
+    "mocha": "^9.2.0",
     "rimraf": "^2.7.1",
     "rollup": "^1.32.1",
-    "rollup-plugin-babel": "^4.4.0",
     "rollup-plugin-copy": "^3.3.0",
     "typescript": "^3.8.3",
-    "webpack": "^4.42.0"
-  },
-  "dependencies": {}
+    "webpack": "^5.38.1"
+  }
 }

package/src/index.d.ts

@@ -1,3 +1,15 @@
+/**
+ * FullStory Client SDK snippet options.
+ *
+ * - orgId: Reference for your [Org Id](https://help.fullstory.com/hc/en-us/articles/360047075853) listed in FullStory.
+ * - namespace: Global object name that contains the FullStory browser API methods and properties. Defaults to `FS`.
+ * - debug: Debug mode with extra browser console logging.
+ * - host: The recording server host domain. Can be set to direct recorded events to a proxy that you host. Defaults to `fullstory.com`.
+ * - script: FullStory script host domain. FullStory hosts the `fs.js` recording script on a CDN, but you can choose to host a copy yourself. Defaults to `edge.fullstory.com`.
+ * - recordCrossDomainIFrames: FullStory can record cross-domain iFrames. Defaults to `false`. Certain limitations apply and can be found [here](https://help.fullstory.com/hc/en-us/articles/360020622514-Can-FullStory-capture-content-that-is-presented-in-iframes-#h_01F1G333PYKPGZ4B42WDBV3YKV). 
+ * - recordOnlyThisIFrame: FullStory can record the iFrame as its own unique session. Defaults to `false`. Additional conditions apply and can be found [here](https://help.fullstory.com/hc/en-us/articles/360020622514-Can-FullStory-capture-content-that-is-presented-in-iframes-#h_01F1G33B40Q2TPQA8MA7SF8Y5P).
+ * - devMode: In dev mode FullStory won't record sessions. Any calls to SDK methods will `console.warn` that FullStory is in `devMode`. Defaults to `false`.
+ */
 interface SnippetOptions {
   orgId: string;
   namespace?: string;
@@ -5,7 +17,7 @@ interface SnippetOptions {
   host?: string;
   script?: string;
   recordCrossDomainIFrames?: boolean;
-  recordOnlyThisIFrame?: boolean;      // see README for details
+  recordOnlyThisIFrame?: boolean;
   devMode?: boolean;
 }
 
@@ -17,6 +29,8 @@ interface UserVars {
 
 type LogLevel = 'log' | 'info' | 'warn' | 'error' | 'debug';
 
+type VarScope = 'page';
+
 // API functions that are available as soon as the snippet has executed.
 export function anonymize(): void;
 export function consent(userConsents?: boolean): void;
@@ -28,6 +42,7 @@ export function log(msg: string): void;
 export function restart(): void;
 export function setUserVars(customVars: UserVars): void;
 export function shutdown(): void;
+export function setVars(varScope: VarScope, properties?: { [key: string]: any }): void;
 
 // API functions that are available after /rec/page returns.
 // FullStory bootstrapping details: https://help.fullstory.com/hc/en-us/articles/360032975773

package/src/index.js

@@ -11,10 +11,10 @@ const ensureSnippetLoaded = () => {
 
 const hasFullStoryWithFunction = (...testNames) => {
   ensureSnippetLoaded();
-  return testNames.every(current => fs()[current]);
+  return testNames.every((current) => fs()[current]);
 };
 
-const guard = name => (...args) => {
+const guard = (name) => (...args) => {
   if (window._fs_dev_mode) {
     const message = `FullStory is in dev mode and is not recording: ${name} method not executed`;
     console.warn(message); // eslint-disable-line no-console
@@ -37,6 +37,7 @@ export const consent = guard('consent');
 export const shutdown = guard('shutdown');
 export const restart = guard('restart');
 export const anonymize = guard('anonymize');
+export const setVars = guard('setVars');
 
 const _init = (options) => {
   if (fs()) {
@@ -45,7 +46,7 @@ const _init = (options) => {
     return;
   }
 
-  // inject FullStory into cross domain iFrames and record them
+  // see README for details on the recordCrossDomainIFrames option
   if (options.recordCrossDomainIFrames) {
     window._fs_run_in_iframe = true;
   }