JSFiddle - React, Tailwind, and code Playground

HTML

<section>
    <div>
        <button type="button">Clica-me!</button>
    </div>
</section>

JavaScript

function logCaptura(e) {
    console.log(this.tagName, 'fase de captura');
	if (this.tagName == 'DIV') e.stopPropagation();
}

function logBubble(e) {
    console.log(this.tagName, 'fase de bubling');
}


document.querySelector('section').addEventListener('click', logCaptura, true);
document.querySelector('div').addEventListener('click', logCaptura, true);
document.querySelector('button').addEventListener('click', logCaptura, true);

document.querySelector('section').addEventListener('click', logBubble);
document.querySelector('div').addEventListener('click', logBubble);
document.querySelector('button').addEventListener('click', logBubble);