Bug 302476
| Summary: | mistore.pk: Pagination / Filters have unintended bullets | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Ahmad Saleem <ahmad.saleem792> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | bfulgham, karlcow, simon.fraser, webkit-bug-importer, zalan |
| Priority: | P2 | Keywords: | InRadar |
| Version: | WebKit Nightly Build | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| Bug Depends on: | 283695 | ||
| Bug Blocks: | |||
Ahmad Saleem
Hi Team,
While going through this website, I noticed this issue and now filing this bug.
*** Steps To Reproduce ***
1) Go to https://mistore.pk/collections/camera-visual
2) Just below `Camera & Visual`, look at `Relevance | New ...` filters
*** Expected Results ***
It should not have any extra bullets
*** Actual Result ***
It does have unintended extra bullets.
__________
Chrome Canary 144 seems to work fine while Safari Technology Preview 232 is broken.
Thanks!
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/164648118>
Karl Dubost
The style on Firefox is done inside the HTML with
https://mistore.pk/collections/camera-visual
```
li.option_value::marker {
content: none;
display: none;
}
```
It is hiding the dots.
Karl Dubost
> ::marker is a tree-abiding pseudo-element, but is not fully styleable; only a limited set of properties can be used on the ::marker pseudo-element. This list is defined in CSS Lists 3 § 3.1.1 Properties Applying to ::marker. — https://drafts.csswg.org/css-pseudo-4/#marker-pseudo
Then
> All properties can be set on a ::marker pseudo-element and will have a computed value which will then inherit to its text content. — https://drafts.csswg.org/css-lists-3/#marker-properties
but the spec also says:
> However, only the following CSS properties actually apply to a marker box:
>
> * the text-combine-upright, unicode-bidi, and direction properties (see [CSS-WRITING-MODES-3])
> * the content property (see § 3.2 Generating Marker Contents, below)
> * all animation and transition properties (see [CSS-ANIMATIONS-1] and [CSS-TRANSITIONS-1])
>
> Other properties should not have an effect on the marker box when declared directly on ::marker in the author or user origin of the cascade. UAs may either treat such properties as not applying, or enforce their value or inheritance from the originating element by setting a user-agent origin !important rule. — https://drafts.csswg.org/css-lists-3/#marker-properties
Karl Dubost
hmmm and for the `content: none`
> content on the ::marker itself is not normal
> The contents of the marker box are determined as defined by the content property, exactly as for ::before.
https://drafts.csswg.org/css-lists-3/#content-property
> none
> On elements, this behaves as normal.
> *On pseudo-elements it inhibits the creation of the pseudo-element as if it had display: none.*
>
> In neither case does it prevent any pseudo-elements which have this element or pseudo-element as an originating element from being generated.
hence the dependency on https://bugs.webkit.org/show_bug.cgi?id=283695
Karl Dubost
I wonder why they didn't choose the easier:
li.option_value {
list-style-type: none;
}
That could be a solution if there is a need to quirk when waiting for
https://github.com/WebKit/WebKit/pull/37153