| javascript:(function(){ var dataId="data-testing-id",selector="["+dataId+"]";function createLabels(){var e=document.getElementById("data-id-canvas").getContext("2d");e.canvas.width=window.innerWidth,e.canvas.height=window.innerHeight,e.clearRect(0,0,e.canvas.width,e.canvas.height),document.querySelectorAll(selector).forEach(function(t,a,n){var i=t.getBoundingClientRect(),d=t.getAttribute(dataId);e.beginPath(),e.lineWidth="1",e.strokeStyle="red",e.rect(i.left,i.top,i.width,i.height),e.stroke(),e.font="12px consolas",e.beginPath(),e.lineWidth="1",e.fillStyle="red",e.rect(i.left,i.top-16,e.measureText(d).width+10,16),e.fill(),e.fillStyle="white",e.fillText(d,i.left+5,i.top-3)}),requestAnimationFrame(createLabels)}requestAnimationFrame(createLabels);var canvas=document.createElement("canvas");canvas.id="data-id-canvas",canvas.style="position: fixed;left: 0;top: 0; pointer-events: none;z-index: 9999999",document.getElementsByTagName("body")[0].appendChild(canvas); })() |
