A partire da Chrome 63, non puoi utilizzare i selettori di perforazione delle ombre ::shadow
e /deep/
per applicare uno stile ai contenuti all'interno di una radice shadow.
- Il combinatore
/deep/
agirà come un selettore discendente.x-foo /deep/ div
funzionerà comex-foo div
. - Lo pseudo-elemento
::shadow
non corrisponderà ad alcun elemento.
La decisione di rimuovere
I ::shadow
e le /deep/
sono stati deprecati nella versione 45 di Chrome. Questo è stato deciso da tutti i partecipanti al meet di Web components di aprile 2015.
Il problema principale dei selettori shadow-piercing è che violano l'incapsulamento e creano situazioni in cui un componente non può più modificare la propria implementazione interna.
La specifica Parti ombra CSS è in fase di sviluppo come alternativa ai selettori di shadowing. Le parti ombra consentono all'autore di un componente di esporre gli elementi denominati in modo da preservare l'incapsulamento e consentire agli autori delle pagine di applicare uno stile a più proprietà contemporaneamente.
Che cosa devo fare se il mio sito utilizza ::shadow e /deep/?
I selettori ::shadow
e /deep/
interessano solo i componenti precedenti Shadow DOM v0. Se utilizzi Shadow DOM v1, non devi apportare alcuna modifica al sito.
Puoi utilizzare Chrome Canary per verificare che il tuo sito non presenti violazioni di queste nuove modifiche. Se riscontri problemi, prova e rimuovi qualsiasi utilizzo di ::shadow
e /deep/
. Se risulta troppo difficile rimuovere l'utilizzo di questi selettori, valuta la possibilità di passare dallo shadow DOM nativo al polyfill DOM ombreggiato. Dovresti apportare questa modifica solo se il tuo sito si basa su shadow DOM nativo v0.
Maggiori informazioni
Intento di rimozione | Tracker dello stato di Chrome | Bug di Chromium