WhatsApp Web: tryb deweloperski z data-testid
Obrysowuje elementy z atrybutem data-testid i wyświetla ich nazwy, ułatwiając pisanie własnych selektorów.
Kod do skopiowania
/* Developer mode: outline elements that expose data-testid attributes */
[data-testid] {
outline: 1px dashed rgba(255,82,82,0.45) !important;
outline-offset: -1px !important;
}
[data-testid]::after {
content: attr(data-testid);
position: absolute;
background: rgba(255,82,82,0.85);
color: #fff;
font: 10px/1.2 ui-monospace, monospace;
padding: 1px 4px;
border-radius: 2px;
pointer-events: none;
z-index: 99999;
}
Jak użyć tego przykładu
- Skopiuj kod przyciskiem powyżej.
- Zainstaluj JustZix (2 minuty) i otwórz wtyczkę na docelowej stronie.
- Dodaj nową regułę dopasowaną do tej strony.
- Wklej kod w panelu CSS reguły i zapisz — efekt pojawi się od razu.
Oceń ten przykład
Brak ocen — oceń jako pierwszy.