A partire da Chrome 63, non puoi utilizzare i selettori che ignorano l'ombra ::shadow
e /deep/
per applicare stili ai contenuti all'interno di un elemento radice ombra.
- Il combinatore
/deep/
fungerà da selettore discendente.x-foo /deep/ div
funzionerà comex-foo div
. - L'elemento pseudo
::shadow
non corrisponderà a nessun elemento.
La decisione di rimozione
::shadow
e /deep/
sono stati ritirati nella versione 45 di Chrome. Questa decisione è stata presa da tutti i partecipanti al meetup di Web Components di aprile 2015.
Il problema principale dei selettori che ignorano le ombre è che violano l'incapsulamento e creano situazioni in cui un componente non può più modificare la propria implementazione interna.
La specifica Parti ombre CSS è in fase di avanzamento come alternativa ai selettori di ombreggiatura. Le parti in ombra consentono a un autore di componenti di esporre elementi denominati in modo da preservare l'incapsulamento e consentire comunque agli autori di pagine di applicare lo stile a più proprietà contemporaneamente.
Cosa devo fare se il mio sito utilizza ::shadow e /deep/?
I selettori ::shadow
e /deep/
influiscono solo sui componenti legacy Shadow DOM v0. Se utilizzi Shadow DOM 1, non dovresti dover modificare nulla sul tuo sito.
Puoi utilizzare Chrome Canary per verificare che il tuo sito non presenti problemi con queste nuove modifiche. Se riscontri problemi,
prova a rimuovere qualsiasi utilizzo di ::shadow
e /deep/
. Se è troppo difficile rimuovere l'utilizzo di questi selettori, valuta la possibilità di passare dal DOM ombra nativo al polyfill DOM ombra. Dovresti apportare questa modifica solo se il tuo sito si basa sulla versione 0 del DOM ombra nativo.
Ulteriori informazioni
Intento di rimozione | Tracker di Chromestatus | Bug di Chromium