reactour
reactour copied to clipboard
Observables: search inside added/removed nodes
We're working with pages that are rendered depending on API requests, so we do something like this:
{
selector: '#create_question',
content: 'Click on + Query',
highlightedSelectors: ['#create_question'],
mutationObservables: ['#create_question'],
resizeObservables: ['#create_question'],
},
Because of some interaction between react-dom and Intersection Observer API that I don't really understand, mutationObservables is not deterministic, sometimes it gets the element I'm looking for (<div id="create_question">...</div>
), sometimes it gets an ancestor (<div ...>...<div id="create_question">...</div>...</div>
) and not always the same ancestor. When it gets an ancestor, it doesn't match the selector and so it doesn't refresh.
This PR makes Observables search inside the added/removed elements instead of just looking at them.