Control how LogRocket records the DOM
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
isEnabled
- Booleanoptional (default - true
)
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
inputSanitizer
- Booleanoptional (default - false
)
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
textSanitizer
- Booleanoptional (default - false
)
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[]
privateAttributeBlocklist
String[]optional (default - null
)
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[]
privateClassNameBlocklist
String[]optional (default - null
)
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[]
hiddenAttributes
String[]optional (default - null
)
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>