Menu
I've been reading up on this selector, and getting conflicting answers.
In: What do /deep/ and ::shadow mean in a CSS selector?
We see:
As Joel H. points out in the comments, Chrome has since deprecated the /deep/ combinator, and it gives a syntax error in IE.
In: https://github.com/Microsoft/vscode/issues/7002
We see:
/deep/ no longer exists, so I don't think we should support it. >>> is the new version, which should probably be supported
However, in the Angular 2 docs: https://angular.io/docs/ts/latest/guide/component-styles.html
We see:
The /deep/ selector also has the alias >>>. We can use either of the two interchangeably.
Obviously it would be wise to trust the Angular 2 docs, but I'm a bit hesitant because of all this conflicting information.
In fact, in the latest version of Microsoft Visual Studio Code, BOTH /deep/ and >>> create errors, though they both do work despite the errors.
My question is twofold:
Is /deep/ here to stay? Do we have any source, a quote, or anything from any specification saying that it will be adopted? Or if it has officially been deprecated?
Can we suppress this error in Visual Studio Code without all-together disabling syntax checking?
667
::ng-deep is what's called a shadow-piercing descendant combinator. It works because it is able to pierce the shadow DOM. Using ::ng-deep to override a child components styles will achieve the desired result but with unintended side effects.
Both APIs ::ng-deep and /deep/ are deprecated and will eventually be removed in the future.
Perhaps it works so well because it bypasses Angular's View Encapsulation rules. Just don't use NG-Deep; it kind-of sort-of works but all the red flags are out on it and forget going too deep.
Is /deep/ here to stay? Do we have any source, a quote, or anything from any specification saying that it will be adopted? Or if it has officially been deprecated?
The /deep/ syntax is obsolete, last seen in css-scoping in 2014, and its replacement >>> was deprecated about half a year ago in Chrome 45.
The entire concept of the shadow-piercing descendant combinator is slated to be removed from the Shadow DOM entirely. Implementations may either remove it altogether or alias it to the regular descendant combinator (which depending on how the Shadow DOM is implemented in the future may or may not make sense).
Can we suppress this error in Visual Studio Code without all-together disabling syntax checking?
Unfortunately not.
Angular allows both in emulated view encapsulation for compatibility purposes, but authors are strongly encouraged to use >>> going forward, since /deep/ is technically invalid now, and therefore unsupported in native view encapsulation.
195
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
