For our latest project, we chose to implement Angular Material for development. In order to customize the CSS properties, we decided to override the default angular material styles using ::ng-deep.
However, a sonar report flagged an error due to the usage of ::ng-deep, with the message "Unexpected unknown pseudo-element selector ::ng-deep."
https://i.sstatic.net/UVtSk.png
Prior to attempting ::ng-deep, our team experimented with overriding the properties through parent classes (such as mat-input-underline.mat-form-field-underline) and by utilizing a customstyle.scss file. Unfortunately, these methods did not produce the expected results.
We are now exploring alternative solutions to this issue or considering skipping this rule in our sonar metrics. Any advice from fellow developers would be greatly appreciated.
Reference
What to use in place of ::ng-deep