UserExperior Web SDK

UserExperior's web application performance monitoring sdk.

Installation

• Via Package Manager

  npm install user-experior-web

• Via CDN

  <script src="https://unpkg.com/user-experior-web@latest/bundle/ue-web-bundle.js"></script>

Initializing UserExperior

startRecording(versionKey, options?)

• For NPM

  import UserExperior from "user-experior-web";
  
  const ue = new UserExperior();
  
  ue.startRecording("your-version-key-here");

• For Script

  <script type="module">
    const ue = new UserExperior.init();
  
    ue.startRecording("your-version-key-here");
  </script>

  Method parameters

  1. versionKey - (REQUIRED) string
     Your User Experior License or Project key.

  2. options - (optional) object
     Initialization options.

     Availabe options properties

     ---

     • sessionReplay - (optional) object
       Session Replay initialization options.

       Availabe sessionReplay properties

       ---

       • maskAllInputs (default: false) - (optional) boolean
         Mask all input content as *

       • maskInputOptions (default: { password: true, email: true, tel: true }) - (optional) object
         Mask some kinds of input *

         Availabe Mask Input Options:
         {
             color: boolean,
             date: boolean,
             'datetime-local': boolean,
             email: boolean,
             month: boolean,
             number: boolean,
             range: boolean,
             search: boolean,
             tel: boolean,
             text: boolean,
             time: boolean,
             url: boolean,
             week: boolean,
             textarea: boolean,
             select: boolean,
             password: boolean
         }
         

  Example
  Showing an example with all possible default options.

  ue.startRecording("5a77c399-61cd-4848-9a46-9c0c21263430", {
      sessionReplay: { 
          maskAllInputs: false,
          maskInputOptions: {
              password: true,
              email: true,
              tel: true,
              color: false,
              date: false,
              'datetime-local': false,
              month: false;
              number: false;
              range: false;
              search: false;
              text: false;
              time: false;
              url: false;
              week: false;
              textarea: false;
              select: false;
          }
      }
  });

Initializing User (or) Set User Identifier

setUserIdentifier(userIdentifier)

• Syntax

  ue.setUserIdentifier('unique-user-identifier')

• Example

  ue.setUserIdentifier("[email protected]");

• Method parameters

  userIdentifier - (REQUIRED) string
  User's unique identifier (eg. Email Id, Phone Number, etc.)

Send additional user information

setUserProperties(userTraits)

• Syntax

  ue.setUserProperties({
      key1: value1,
      key2: value2, 
      ...
  })

• Example

  ue.setUserProperties({
      "start_date": "2020/12/31",
      "plan_subscribed": "trial",
      "user_type": "guest"
  });

• Method parameters

  userTraits - (REQUIRED) object
  User related additional information (eg. user type, plan type, etc.)

Log Event

logEvent(eventName, eventProperties?)

• Syntax

  ue.logEvent("YOUR_EVENT", {
      key1: value1,
      key2: value2, 
      ...
  })

• Example

  ue.logEvent("Profile Created", {
      "organisation": "Google",
      "user_type": "guest"
  });

• Method parameters

  eventName - (REQUIRED) string
  Custom event name (eg. profile created, visited pricing, etc.)

  eventProperties - (optional) object
  Event related additional information (eg. has_upgraded, etc.)

Unset User Identifier

unsetUserIdentifier()

• Syntax

  ue.unsetUserIdentifier()

• Example

  ue.setUserIdentifier();