Rob Dodson
Chrome 63부터 그림자 관통 선택자 ::shadow 및 /deep/를 사용하여 그림자 루트 내부의 콘텐츠에 스타일을 지정할 수 없습니다.
/deep/결합자는 하위 요소 선택기 역할을 합니다.x-foo /deep/ div는x-foo div와 같이 작동합니다.::shadow가상 요소는 어떤 요소와도 일치하지 않습니다.
삭제 결정
::shadow 및 /deep/는 Chrome 버전 45에서 지원 중단되었습니다. 이는 2015년 4월 웹 구성요소 미팅의 모든 참석자가 결정했습니다.
그림자 관통 선택기의 주요 문제는 캡슐화를 위반하고 구성요소가 더 이상 내부 구현을 변경할 수 없는 상황을 만든다는 점입니다.
CSS Shadow Parts 사양은 그림자 관통 선택자의 대안으로 개발되고 있습니다. Shadow Parts를 사용하면 구성요소 작성자가 캡슐화를 유지하면서도 페이지 작성자가 한 번에 여러 속성의 스타일을 지정할 수 있는 방식으로 이름이 지정된 요소를 노출할 수 있습니다.
사이트에서 ::shadow 및 /deep/를 사용하는 경우 어떻게 해야 하나요?
::shadow 및 /deep/ 선택기는 기존 Shadow DOM v0 구성요소에만 영향을 미칩니다. Shadow DOM v1을 사용하는 경우 사이트에서 아무것도 변경할 필요가 없습니다.
Chrome Canary를 사용하여 이러한 새로운 변경사항으로 인해 사이트가 중단되지 않는지 확인할 수 있습니다. 문제가 발생하면 ::shadow 및 /deep/ 사용을 삭제해 보세요. 이러한 선택기의 사용을 삭제하기가 너무 어렵다면 네이티브 Shadow DOM에서 Shady DOM 폴리필로 전환하는 것이 좋습니다. 사이트에서 네이티브 Shadow DOM v0을 사용하는 경우에만 이 변경사항을 적용하면 됩니다.