CSS esterno che influenza (“sanguinando” in) DOM ombra con Polimero

Devo mancare qualcosa, ma non riesco a capirlo. Ho un semplice elemento personalizzato implementato con il polymer:

   
TECK ... CHEST
Polymer('test-elem', { applyAuthorStyles: false, });

Lo uso poi in una pagina semplice:

        .deepinside { color: red; }    Hi   

Il contenuto del div interno dell’elemento (con class="deepinside" ) viene visualizzato in rosso. Se ho capito bene, questo non dovrebbe accadere (vedi questo documento ). Nota che ho dichiarato esplicitamente applyAuthorStyles: false nel costruttore dell’elemento (non dovrebbe essere necessario, perché è il comportamento predefinito). Non capisco perché il CSS esterno stia influenzando un elemento nel DOM ombra. Ho persino provato a specificare l’attributo shadowdom esplicitamente nella definizione dell’elemento, ma il risultato è lo stesso.

Cosa mi manca?

FWIW, sto eseguendo Chrome versione 31.0.1650.57 su OS X 10.7.5.

Questa è una limitazione nota del polyfill Shadow DOM . Fa un buon lavoro di impedire che gli stili dei componenti si dissanguino, ma non fa lo stesso per il contrario.

Ecco una codepen per il tuo caso d’uso. Funziona come intendi nel canarino di Chrome 33.0.1717.0 (per il quale Polymer non ha il DOM ombra ombreggiato), ma non in 31.0.1650.57.