24/01/2017 Development / java script

insert in your component - attribute (data-componente="namecomponente")

function debugComponent(){

    document.querySelectorAll("[data-component]").forEach(function(component, index){

        var modulo = document.createElement('div');
        modulo.classList.add('debug-modulo');

        var moduloName = document.createTextNode(component.getAttribute('data-component'));
        modulo.appendChild(moduloName);

        component.classList.toggle("debug-modulo-active");
        component.appendChild(modulo);
    });
}

//css

.debug-modulo-active {
    border: 1px solid red;
    position: relative;
    display: block;
}

.debug-modulo {
    position: absolute;
    top: 0;
    left : 0;
    z-index: 1000;
    right: 0;
    background-color: #fff;
    color: #000;
    font-size: 10px;
}