Sanitize DOM Data

LogRocket records a "video" of your users' sessions by logging diffs in the DOM via MutationObserver.

By default, LogRocket does not record any password inputs, DOM trees that contain the _lr-hide class, or any element with the data-private attribute.

Disable DOM Logging

isEnabled - Boolean

optional (default - true)

If you would like to disable all DOM recording regardless of class or attribute, you may set isEnabled to false

LogRocket.init(YOUR_APP_ID, {
  dom: {
    isEnabled: false,
  },
});

Sanitize all user input fields

inputSanitizer - Boolean

optional (default - false)

With this set to true, LogRocket will automatically obfuscate all user-input elements like <input> and <select> from session recordings. None of that data will be recorded or sent to LogRocket. Note that this includes the following attributes: mailto (in an href), alt, title, aria-label, and aria-description.

Nodes can be allowlisted with the data-public attribute. This attribute will not affect existing data-private privacy settings.

When configured with "lipsum", user input is replaced with Lorem Ipsum to simulate content without capturing any actual user input.

LogRocket.init(YOUR_APP_ID, {
  dom: {
    inputSanitizer: true,
  },
});

<input data-public title="this is not private"/>

Sanitize all text fields

textSanitizer - Boolean

optional (default - false)

With this set to true, LogRocket will automatically obfuscate all text nodes from all session recordings. None of that data will be recorded or sent to LogRocket. Note that this includes the following attributes: mailto(in an href), alt, title, aria-label, and aria-description.

Nodes can be allowlisted with the data-public attribute. This attribute will not affect existing data-private privacy settings.

LogRocket.init(YOUR_APP_ID, {
  dom: {
    textSanitizer: true,
  },
});

<textarea data-public>This is not private</textarea>

Disable Recording Specific Elements

By default, LogRocket does not record any password inputs, DOM trees that contain the _lr-hide class, or any element with the data-private attribute. You can also customize attributes or classes to be redacted as described below.

By Attribute

privateAttributeBlocklist String[]

optional (default - null)

You may want to disable recording elements based on specific attributes (for example, for third party tracking tools). To achieve this you must pass a list of those attributes to the config. These elements will not be recorded, including all user input on them. They act just like data-private.

LogRocket.init(YOUR_APP_ID, {
  dom: {
    privateAttributeBlocklist: ['data-hide-this']
  },
});

// will not record: <div data-hide-this></div>

By CSS Class Name

privateClassNameBlocklist String[]

optional (default - null)

You may want to disable recording elements based on specific CSS Class Names. To achieve this you must pass a list of those classNames to the initialization config. These elements will not be recorded, including all user input on them. They act just like data-private.

LogRocket.init(YOUR_APP_ID, {
  dom: {
    privateClassNameBlocklist: ['class-hide-this']
  },
});

// will not record: <div class="class-hide-this"></div>

Disable Recording Specific Attributes

hiddenAttributes String[]

optional (default - null)

For more fine-grained control, you can configure LogRocket to ignore specific HTML attributes instead of an entire element by using the hiddenAttributes value. For any attribute name matching one of the provided strings, neither the attribute name nor value will be recorded by the SDK.

LogRocket.init(YOUR_APP_ID, {
  dom: {
    hiddenAttributes: ['hidden-value']
  },
});

// the element:
//  <div hidden-value="foo" shown-value="bar"></div>
// will be recorded as:
//  <div shown-value="bar"></div>