Extended text masking function to include relevant HTMLElement

[benjackwhite]

A while back I added the element-to-be-masked to the masking function for inputs. This offers ultimate flexibility as the implementor can re-implement any of the other masking checks or any other thing they can come up with.

What was missing was the corresponding thing for text. This PR adds it.

For example it can solve the request in this issue without needing to add more, conflicting options.

{
    maskAllInputs: true,
    maskInputFn: (text, element) => {
        if (element?.dataset['rr-unmask'] === 'true') {
            return text
        }
        return '*'.repeat(text.length)
    },
    maskTextSelector: "*",
    maskTextFn: (text, element) => {
        if (element?.dataset['rr-unmask'] === 'true') {
            return text
        }
        return '*'.repeat(text.length)
    },
}

With this example, everything will be masked except elements with the data attribute rr-unmask.

[changeset-bot]

🦋 Changeset detected

Latest commit: 0c26420

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 8 packages

Name	Type
rrweb-snapshot	Minor
rrweb	Minor
rrdom	Minor
rrdom-nodejs	Minor
rrweb-player	Minor
@rrweb/types	Minor
@rrweb/web-extension	Minor
rrvideo	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[ArkadyFukzon]

+1 for this, really useful change

[benjackwhite]

@Juice10 made the changes 👍

[Juice10]

Great addition @benjackwhite thanks!

[eoghanmurray]

naming suggestion

getElementFromNode sounded like a built in getElementById and hid the 'find parent' aspect.

the "closest" idea has precedence in https://developer.mozilla.org/en-US/docs/Web/API/Element/closest but maybe I'm overthinking it?

[benjackwhite]

@eoghanmurray committed your changes (an then corrected the typos that I didn't initially notice 😅 )
Naming definitely makes sense