Удаление ::shadow и /deep/ в Chrome 63

Начиная с Chrome 63, вы не можете использовать селекторы прокалывания тени ::shadow и /deep/ для стилизации содержимого внутри теневого корня.

  • Комбинатор /deep/ будет действовать как селектор потомков. x-foo /deep/ div будет работать как x-foo div .
  • Псевдоэлемент ::shadow не будет соответствовать ни одному элементу.

Решение об удалении

::shadow и /deep/ устарели в Chrome версии 45. Это было решено всеми участниками на встрече веб-компонентов в апреле 2015 года .

Основная проблема с селекторами с пробивкой теней заключается в том, что они нарушают инкапсуляцию и создают ситуации, когда компонент больше не может изменить свою внутреннюю реализацию.

Спецификация CSS Shadow Parts развивается как альтернатива селекторам с прокалыванием теней. Shadow Parts позволит автору компонента предоставлять именованные элементы таким образом, чтобы сохранить инкапсуляцию и при этом предоставить авторам страниц возможность стилизовать несколько свойств одновременно.

Что делать, если на моем сайте используются ::shadow и /deep/?

Селекторы ::shadow и /deep/ влияют только на устаревшие компоненты Shadow DOM v0. Если вы используете Shadow DOM v1, вам не нужно ничего менять на своем сайте.

Вы можете использовать Chrome Canary, чтобы убедиться, что ваш сайт не пострадает из-за этих новых изменений. Если вы заметили проблемы, попробуйте удалить любое использование ::shadow и /deep/ . Если отказаться от использования этих селекторов слишком сложно, рассмотрите возможность перехода от собственного теневого DOM к теневому полифилу DOM. Вам необходимо внести это изменение только в том случае, если ваш сайт использует встроенную теневую DOM версии 0.

Дополнительная информация

Намерение удалить | Трекер Chromestatus | Ошибка хрома