AdguardTeam / AdguardTeam/VscodeAdblockSyntax

Implement a CSS syntax highlighter

Đang mở
#89 4 bình luận 1 reaction 0 người được giao Xem trên GitHub
feature request Priority: P4 T: syntax highlighter
Ngôn ngữ chính
TypeScript
Star
88
Fork
8
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

A lot of adblock filter rules use CSS, so we should consider implementing a good CSS highlighter according to our goals (this doesn't necessarily mean full CSS support, e.g. we don't have to support comments).

The benefits of this are:
- Make CSS-based cosmetic rules much more transparent
- it improves maintainability
- it makes the rules clearer for those who don't have much experience in writing rules
- Many incorrect selectors can be marked as invalid even at the highlighter level

Because of "Extended CSS syntax", we should definitely think about creating our own highlighter, rather than integrating an existing CSS highlighter. In addition, this will ensure consistent results, since VSCode doesn't use the same CSS scope as GitHub.

I started implementing this earlier (last year), here is a demo of what it would look like:

![image](https://user-images.githubusercontent.com/57285466/235619213-b3d9c74a-1286-4b11-8eee-34aba16309b3.png)

In the case of CSS injection rules, [at-rules](https://developer.mozilla.org/en-US/docs/Web/CSS/At-rule) and [declaration block](https://developer.mozilla.org/en-US/docs/Web/API/CSS_Object_Model/CSS_Declaration_Block) should also be handled, but the development can be done step-by-step, so e.g. in the first round, we only implement the CSS selectors for element hiding rules.

Reference:
- https://www.w3.org/TR/selectors-3/
- https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors
- https://developer.mozilla.org/en-US/docs/Web/CSS/At-rule
- https://developer.mozilla.org/en-US/docs/Web/API/CSS_Object_Model/CSS_Declaration_Block
- https://github.com/AdguardTeam/ExtendedCss
- https://github.com/gorhill/uBlock/wiki/Procedural-cosmetic-filters

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.