Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Inject `dd-privacy-hidden` tag into specific inputs and inputs with autocomplete attribute
{
"exclusions": [
"email",
"firstName",
"lastName",
"phoneNumber",
"street1",
"street2",
"city",
"state",
"zipCode",
"other"
]
}
import { exclusions } from './dd_excludes.json';
const hideAutocompletes = () => {
const autoCompleteNodes = Array.from(document.querySelectorAll('input[autocomplete|=cc]'));
autoCompleteNodes.forEach((node) => {
node.classList.add('dd-privacy-hidden');
});
};
const hideInputExclusions = () => {
const inputNodes = Array.from(document.querySelectorAll('input'));
inputNodes.forEach((node) => {
if (exclusions.includes(node.name)) {
node.classList.add('dd-privacy-hidden');
}
});
};
const rumPromise = () =>
new Promise((resolve, reject) => {
try {
hideAutocompletes();
hideInputExclusions();
resolve();
} catch (e) {
reject(e);
}
});
const readyForRum = new Event('readyForRum');
// this can be useful with React, also note the 250ms timeout
// as sometimes input components haven't finished being 'painted'
document.addEventListener('readystatechange', () => {
if (document.readyState === 'complete') {
setTimeout(() => {
rumPromise().then(() => {
document.dispatchEvent(readyForRum);
});
}, 250);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment