format the whole codebase

.eslintrc.js

@@ -1,7 +1,5 @@
 module.exports = {
-  extends: [
-    'plugin:@typescript-eslint/recommended'
-  ],
+  extends: ['plugin:@typescript-eslint/recommended'],
   parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaVersion: 2020,

.prettierrc.js

@@ -0,0 +1,8 @@
+const config = {
+  trailingComma: 'es5',
+  tabWidth: 2,
+  semi: true,
+  singleQuote: true,
+};
+
+module.exports = config;

README.md

@@ -15,9 +15,10 @@ A Typescript library for sending Yext Analytics events.
 [Full Documentation](./docs/analytics.md)
 
 # Yext Analytics
-Yext Analytics is a Typescript library for sending analytics events that occur on your digital experiences to the Yext Analytics platform. You can record user actions that we offer out-of-the-box, such as page views and clicks, or custom actions that are unique to your business! Yext uses the same analytics reporting features across Search, Pages, and Chat so these products all use one interface. 
 
-- Works in the **browser** only. 
+Yext Analytics is a Typescript library for sending analytics events that occur on your digital experiences to the Yext Analytics platform. You can record user actions that we offer out-of-the-box, such as page views and clicks, or custom actions that are unique to your business! Yext uses the same analytics reporting features across Search, Pages, and Chat so these products all use one interface.
+
+- Works in the **browser** only.
 - 100% **TypeScript**, with detailed analytics event models
 - Compatible with both **CommonJS** and **ES6** imports
 
@@ -28,103 +29,126 @@ First, install the library via [npm](https://www.npmjs.com/get-npm):
 ```bash
 npm install @yext/analytics
 ```
+
 ### Initialize Analytics Reporter
 
 Next, import and initialize the library in your application. When initializing your analytics reporter, you only need to provide an API Key that has access to the Events API. Other attributes such as your business ID will be automatically inferred. You can acquire this API key in the developer console of the Yext Platform.
+
 ```ts
-import { analytics } from "@yext/analytics";
+import { analytics } from '@yext/analytics';
 
 // Root analytics service with no defaults.
-const rootAnalytics = analytics({ key: "MY_API_KEY" }); 
+const rootAnalytics = analytics({ key: 'MY_API_KEY' });
 ```
+
 In many cases, you might need to repeatedly specify the same properties, such as a Pages site ID or Chat bot ID. Yext Analytics allows you to avoid having to repeatedly specify the same code by allowing you to set **default values**.
 
 You can add a `.with()` method to the root analytics service you initialized, which returns a new analytics object with the specified JSON merged on top of the existing defaults.
+
 ```ts
-import { Analytics } from "@yext/analytics";
+import { Analytics } from '@yext/analytics';
 
 // Root analytics service with no defaults.
-const rootAnalytics = new Analytics({ key: "MY_API_KEY" }); 
+const rootAnalytics = new Analytics({ key: 'MY_API_KEY' });
 
 // Pages analytics service with Pages defaults.
-const pageAnalytics = rootAnalytics.with({ pages: { siteId: 123 } }); 
+const pageAnalytics = rootAnalytics.with({ pages: { siteId: 123 } });
 
 // Chat analytics service with both Chat **and** Pages defaults.
-const chatAnalytics = pageAnalytics.with({ chat: { botId: "my-bot" } }); 
+const chatAnalytics = pageAnalytics.with({ chat: { botId: 'my-bot' } });
 ```
+
 Calling `pageAnalytics.report()` sends an event with the `pages` object, plus anything passed to `report`. Calling `chatAnalytics.report()` sends an event with both the `pages` and `chat` objects, plus anything passed to `report`. You can override the default values defined in the .with() method by sending them along with the event.
 
 For other configuration features, see [AnalyticsConfig.ts](/docs/analytics.analyticsconfig.md)
+
 ### Fire an Event
-Now that we’ve initialized our analytics reporter, we can fire an event! This sends a `CHAT_IMPRESSION` event type, along with a `sessionId`, a `pages.siteId`, and a `chat.botId`. 
+
+Now that we’ve initialized our analytics reporter, we can fire an event! This sends a `CHAT_IMPRESSION` event type, along with a `sessionId`, a `pages.siteId`, and a `chat.botId`.
+
 ```ts
 chatAnalytics.report({
-  action: "CHAT_IMPRESSION"
+  action: 'CHAT_IMPRESSION',
 });
 ```
-### Additional Configuration 
+
+### Additional Configuration
+
 #### Session Tracking
+
 Session tracking is now available for Chat, Pages, and Search. Yext uses a browser-based method (sessionStorage) to track this. By default, session tracking is **enabled** in **both** the US and EU environments. This can be disabled by setting `sessionTrackingEnabled` to `false`.
 
 When `sessionTrackingEnabled` is set to `true`, Analytics will automatically generate a ULID for `sessionId` and bind that ULID to events from the same browser session. Users may also provide their own `sessionId`, which takes precedence over the auto-generated ID by Analytics. [To read more about how we generate ULIDs, check out ulidx.](https://github.com/perry-mitchell/ulidx)
 
 #### Custom Events
+
 You can also send custom analytics events.
+
 ```ts
 pagesAnalytics.report({
-  action: "C_MY_CUSTOM_EVENT"
+  action: 'C_MY_CUSTOM_EVENT',
 });
 ```
-Additionally, you can send arbitrary conversion events by specifying a `value` JSON object with a dollar `amount` and a `currency` in ISO format. 
+
+Additionally, you can send arbitrary conversion events by specifying a `value` JSON object with a dollar `amount` and a `currency` in ISO format.
+
 ```ts
 chatAnalytics.report({
-  action: "C_CONVERSION_EVENT",
+  action: 'C_CONVERSION_EVENT',
   value: {
     amount: 10,
-    currency: "USD",
+    currency: 'USD',
   },
 });
 ```
+
 To learn more about sending conversion events, see our [API documentation](https://hitchhikers.yext.com/docs/eventsapis/events/events#operation/sendEvents).
 
 #### Custom Properties
+
 You can attach custom properties to your analytics events by specifying either `customTags` or `customValues` with your request. `customTags` represent up to ten **string** key-value pairs and `customValues` represent up to ten **numeric** key-value pairs.
 
 For example, if I set up an `ORDER` event for my restaurant and wanted to track whether a promotional code was used on the order, I could add an `promoCode` custom tag to the event.
+
 ```ts
 pagesAnalytics.report({
-  action: "C_CONVERSION_EVENT",
-  sessionId: "e790f75d-4f1e-4a1b-b57b-9a456019b176",
+  action: 'C_CONVERSION_EVENT',
+  sessionId: 'e790f75d-4f1e-4a1b-b57b-9a456019b176',
   value: {
-    amount: 35.50,
-    currency: "USD",
+    amount: 35.5,
+    currency: 'USD',
   },
   customTags: {
-      "promoCode": "SPRING15OFF"
-  }
+    promoCode: 'SPRING15OFF',
+  },
 });
 ```
+
 Additionally, if I wanted to record the discount amount of the promotion, I could add a `promoDiscount` custom value to the `ORDER` event.
+
 ```ts
 pagesAnalytics.report({
-  action: "C_CONVERSION_EVENT",
-  sessionId: "e790f75d-4f1e-4a1b-b57b-9a456019b176",
+  action: 'C_CONVERSION_EVENT',
+  sessionId: 'e790f75d-4f1e-4a1b-b57b-9a456019b176',
   value: {
-    amount: 35.50,
-    currency: "USD",
+    amount: 35.5,
+    currency: 'USD',
   },
   customTags: {
-      "promoCode": "SPRING15OFF"
+    promoCode: 'SPRING15OFF',
   },
   customValues: {
-      "promoDiscount": 41.76
-  }
+    promoDiscount: 41.76,
+  },
 });
 ```
+
 ### Debugging
+
 We use `fetch()` + `keepalive` by default in [supported browsers](https://developer.mozilla.org/en-US/docs/Web/API/fetch) to make debugging easier. For browsers like Firefox that do not support `keepalive`, [we use the Beacon API](https://developer.mozilla.org/en-US/docs/Web/API/Beacon_API). Users can set `forceFetch: true` in their config, which will make these browsers use `fetch()` instead of the `Beacon API`. Be warned, since `forceFetch` uses `fetch()` without `keepalive`, **requests in progress for browsers like FireFox will be canceled if the page is unloaded**.
- 
+
 ## Module support
+
 - The ESM (ES6) build will be used automatically by module bundlers that support it (e.g. Webpack). It can be specified directly by importing `@yext/analytics/lib/esm`
 - The CommonJS build will be used automatically by Node, but it can be specified directly by importing `@yext/analytics/lib/commonjs`
 
@@ -134,4 +158,4 @@ Yext Analytics is an open-sourced library licensed under the [BSD-3 License](./L
 
 ## Third Party Licenses
 
-The licenses of our 3rd party dependencies are collected here: [THIRD-PARTY-NOTICES](./THIRD-PARTY-NOTICES).
+The licenses of our 3rd party dependencies are collected here: [THIRD-PARTY-NOTICES](./THIRD-PARTY-NOTICES).

api-extractor.json

@@ -45,7 +45,7 @@
    *
    * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
    */
-   "mainEntryPointFilePath": "<projectFolder>/lib/esm/src/index.d.ts",
+  "mainEntryPointFilePath": "<projectFolder>/lib/esm/src/index.d.ts",
 
   /**
    * A list of NPM package names whose exports should be treated as part of this package.

babel.config.js

@@ -4,4 +4,4 @@ module.exports = {
     ['@babel/preset-env', { targets: { node: 'current' } }],
     '@babel/preset-typescript',
   ],
-};
+};

package.json

@@ -22,11 +22,11 @@
     "build": "rm -rf lib/** && tsc -p tsconfig.cjs.json && tsc -p tsconfig.esm.json && npm run format-check && npm run api-extractor && npm run generate-docs && npm run generate-notices && vite build",
     "prepare": "husky install",
     "format-check": "prettier --check . && eslint .",
-    "format-fix": "prettier --write . && eslint . --fix",
+    "format-fix": "prettier --write .",
     "api-extractor": "api-extractor run --local --verbose",
     "generate-docs": "api-documenter markdown --input-folder temp --output-folder docs && rm -rf temp",
     "prepublishOnly": "npm run build",
-    "test": "jest && playwright test",
+    "test": "jest && playwright install --with-deps && playwright test",
     "dev": "tsc -p tsconfig.esm.json --watch",
     "generate-notices": "generate-license-file --input package.json --output THIRD-PARTY-NOTICES --overwrite"
   },

src/Action.ts

@@ -4,54 +4,54 @@
  * @public
  */
 export type Action =
- | `C_${string}`
- | `c_${string}`
- | 'ADD_TO_CART'
- | 'ALL_TAB_NAVIGATION'
- | 'APPLY'
- | 'AUTO_COMPLETE_SELECTION'
- | 'BACKWARD_PAGINATE'
- | 'BOOK'
- | 'BRAND_ICON'
- | 'CALL_TO_ACTION'
- | 'CASE_START'
- | 'CASE_SUBMITTED'
- | 'CHAT_IMPRESSION'
- | 'CHAT_LINK_CLICK'
- | 'CHAT_RESPONSE'
- | 'COLLAPSE'
- | 'DIRECTIONS'
- | 'EVENT'
- | 'EXPAND'
- | 'FEATURED_MESSAGE'
- | 'FILTERING_WITHIN_SECTION'
- | 'FORWARD_PAGINATE'
- | 'HEADER_LINKS'
- | 'ITEM_IN_LIST'
- | 'MAP_CARD'
- | 'MAP_PIN'
- | 'MENU'
- | 'MESSAGE'
- | 'ORDER'
- | 'PAGINATE'
- | 'PHONE'
- | 'POST'
- | 'PRESET_PROMPT'
- | 'PRODUCT'
- | 'PROFILE'
- | 'QUESTION_FOCUS'
- | 'QUESTION_SUBMIT'
- | 'REMOVED_FILTER'
- | 'REVIEW'
- | 'SCROLL_TO_BOTTOM_OF_PAGE'
- | 'SEARCH_BAR_IMPRESSION'
- | 'SEARCH_CLEAR_BUTTON'
- | 'THUMBS_DOWN'
- | 'THUMBS_UP'
- | 'TICKET_URL'
- | 'TITLE'
- | 'VERTICAL_TAB_NAVIGATION'
- | 'VERTICAL_VIEW_ALL'
- | 'VOICE_START'
- | 'VOICE_STOP'
- | 'WEBSITE';
+  | `C_${string}`
+  | `c_${string}`
+  | 'ADD_TO_CART'
+  | 'ALL_TAB_NAVIGATION'
+  | 'APPLY'
+  | 'AUTO_COMPLETE_SELECTION'
+  | 'BACKWARD_PAGINATE'
+  | 'BOOK'
+  | 'BRAND_ICON'
+  | 'CALL_TO_ACTION'
+  | 'CASE_START'
+  | 'CASE_SUBMITTED'
+  | 'CHAT_IMPRESSION'
+  | 'CHAT_LINK_CLICK'
+  | 'CHAT_RESPONSE'
+  | 'COLLAPSE'
+  | 'DIRECTIONS'
+  | 'EVENT'
+  | 'EXPAND'
+  | 'FEATURED_MESSAGE'
+  | 'FILTERING_WITHIN_SECTION'
+  | 'FORWARD_PAGINATE'
+  | 'HEADER_LINKS'
+  | 'ITEM_IN_LIST'
+  | 'MAP_CARD'
+  | 'MAP_PIN'
+  | 'MENU'
+  | 'MESSAGE'
+  | 'ORDER'
+  | 'PAGINATE'
+  | 'PHONE'
+  | 'POST'
+  | 'PRESET_PROMPT'
+  | 'PRODUCT'
+  | 'PROFILE'
+  | 'QUESTION_FOCUS'
+  | 'QUESTION_SUBMIT'
+  | 'REMOVED_FILTER'
+  | 'REVIEW'
+  | 'SCROLL_TO_BOTTOM_OF_PAGE'
+  | 'SEARCH_BAR_IMPRESSION'
+  | 'SEARCH_CLEAR_BUTTON'
+  | 'THUMBS_DOWN'
+  | 'THUMBS_UP'
+  | 'TICKET_URL'
+  | 'TITLE'
+  | 'VERTICAL_TAB_NAVIGATION'
+  | 'VERTICAL_VIEW_ALL'
+  | 'VOICE_START'
+  | 'VOICE_STOP'
+  | 'WEBSITE';

src/AnalyticsConfig.ts

@@ -1,35 +1,35 @@
-import {Environment} from './Environment';
-import {Region} from './Region';
+import { Environment } from './Environment';
+import { Region } from './Region';
 
 /**
  * The main configuration options for Analytics Events.
  *
  * @public
  */
 export interface AnalyticsConfig {
-    /** The API Key or OAuth for accessing the Analytics Events API
-     * Only one of key or bearer should be set.
-     * */
-    key?: string;
-    /** The bearer token for accessing the Analytics Events API.
-     * Only one of key or bearer should be set.
-     * */
-    bearer?: string;
-    /** The Yext environment to send requests to. Defaults to 'PRODUCTION'. */
-    env?: Environment;
-    /** The region to send requests to. Defaults to 'US'. */
-    region?: Region;
-    /**
-     * Whether to enable session tracking for analytics events.
-     * Defaults to true for both environments. If set to false, sessionId will automatically
-     * be set to undefined in the event payload.
-     * @remarks
-     * This generates a ULID to tie together events in a single browsing session.
-     */
-    sessionTrackingEnabled?: boolean;
-    /**
-     * Used to force sending the request with fetch even if the browser
-     * does not support fetch with the keepalive flag (like Firefox).
-     * If the browser does support it, fetch is used by default. */
-    forceFetch?: boolean;
-}
+  /** The API Key or OAuth for accessing the Analytics Events API
+   * Only one of key or bearer should be set.
+   * */
+  key?: string;
+  /** The bearer token for accessing the Analytics Events API.
+   * Only one of key or bearer should be set.
+   * */
+  bearer?: string;
+  /** The Yext environment to send requests to. Defaults to 'PRODUCTION'. */
+  env?: Environment;
+  /** The region to send requests to. Defaults to 'US'. */
+  region?: Region;
+  /**
+   * Whether to enable session tracking for analytics events.
+   * Defaults to true for both environments. If set to false, sessionId will automatically
+   * be set to undefined in the event payload.
+   * @remarks
+   * This generates a ULID to tie together events in a single browsing session.
+   */
+  sessionTrackingEnabled?: boolean;
+  /**
+   * Used to force sending the request with fetch even if the browser
+   * does not support fetch with the keepalive flag (like Firefox).
+   * If the browser does support it, fetch is used by default. */
+  forceFetch?: boolean;
+}