WhatsApp Web : mode développeur (data-testid)
Encadre les éléments avec data-testid et affiche leur nom, utile pour écrire des sélecteurs.
Code à copier
/* 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;
}
Comment utiliser cet exemple
- Copiez le code avec le bouton ci-dessus.
- Installez JustZix (2 minutes) et ouvrez l'extension sur la page cible.
- Ajoutez une nouvelle règle correspondant à cette page.
- Collez le code dans le panneau CSS de la règle et enregistrez — l'effet apparaît aussitôt.
Notez cet exemple
Aucune note — soyez le premier.