progress – Bug in Chrome?

[Tim Tepaße]

Diese ganze Shadow-DOM-Geschichte aktuell in Browsern ist noch ein merkwürdiges Schattenreich. Es existieren die DOM-Strukturen, aber das unnötigerweise.

Weitere Forschungen dazu: Ich habe mich erinnert, dass in früheren Shadow-DOM-Spezifikationen für Bestandteile des shadow trees eigens definierte Peudo-Elemente zum Styling frei geben kann. In Chromes progress-Shadow-DOM geht das im Prinzip auch …

~~~css progress::-webkit-progress-bar {
    background-color: red;
  }

  
… man sieht die Auswirkungen aber nur im Web Inspector, nicht im Renderung.  
  
Dann erinnerte ich mich an [uralte Planungen](https://www.webkit.org/blog/17/the-new-form-controls-checkbox-2/) zum Rendering von Controls in Webkit, nämlich, dass damalige Proto-Shadow-DOM erst dann aktiv wird, setzt man das bepräfixte appearance-property von Webkit auf none. Dies gilt jetzt auch für Blink, d.h. Shadow Dom existiert in etwa:  
  
  ~~~css
progress {  
    -webkit-appearance: none;  
  }  
  
  progress::-webkit-progress-bar {  
    background-color: red;  
  }  
  
  progress::-webkit-progress-value::before {  
    content: "foo";  
    color: white;  
  }

Die Eigenschaft appearance, obwohl in Browsern genutzt ist nicht spezifiziert, auch nicht in Zusammenhang mit Shadow DOM. Das ganze bleibt ein Chaos.