A bit of a side note but if you are not familiar with the Mutation Observer API (what is running behind the scene in Stimulus) and want to get a quick understanding, here is a short 10 min video that I found very informative on that subject.
6 Likes
javan
September 6, 2018, 2:03pm
2
Nice! Thanks for sharing.
You can see how Stimulus uses MutationObserver in the @stimulus/mutation-observers
this.elements = new Set
this.mutationObserver = new MutationObserver((mutations) => this.processMutations(mutations))
}
start() {
if (!this.started) {
this.started = true
this.mutationObserver.observe(this.element, { attributes: true, childList: true, subtree: true })
this.refresh()
// Mutation record processing
private processMutations(mutations: MutationRecord[]) {
if (this.started) {
for (const mutation of mutations) {
this.processMutation(mutation)
}
}
}
private processMutation(mutation: MutationRecord) {
if (mutation.type == "attributes") {
this.processAttributeChange(mutation.target, mutation.attributeName!)
} else if (mutation.type == "childList") {
this.processRemovedNodes(mutation.removedNodes)
this.processAddedNodes(mutation.addedNodes)
}
}
2 Likes