feat(cdk/observers): Choosing CDK MutationObserver properties

[Marius-Romanus]

Feature Description

Hello, by default in the MutationObserver CDK all three types of changes are detected. It would be nice to be able to choose each of them on true or false for each use case.

components/src/cdk/observers/observe-content.ts

Line 131 in 3dc01c1

observer.observe(element, {

greetings!

Use Case

Being able to choose what type of changes you want to observe.

[amysorto]

The MutationObserver is a native to the web, so it might not be something we could have control over in this library.

What are the types of changes you are referring to specifically? My understanding is that it will watch for any change to the DOM.

[Marius-Romanus]

Hi, I know it's web native, but the library hears three default options: characterData, childList and subtree. People may be interested in hearing only certain events and not all, or at least being able to choose. There is also no "attributes" property.

https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver/observe#options

observer.observe(element, {
            characterData: true,
            childList: true,
            subtree: true,
          });

[mmalerba]

This utility is specifically for observing content changes, so it has settings that are appropriate for that. Of course you are still welcome to use the native browser API if you need to watch something else, but we don't plan to add those options to this utility