Bug 167645 – Implement @counter-style

• Component: CSS
• Status: RESOLVED FIXED

[Ebrahim Byagowi]

Related w3 document:
https://www.w3.org/TR/css-counter-styles-3/

To repro:
data:text/html,<style>@counter-style negplus { system: numeric; symbols: '-' '+'; } ol { list-style: negplus }</style><ol><li>1</li><li>2</li></ol>

Expected:
Like Firefox, you should see something like:
 +. 1
+-. 2

Actual:
Whole @counter-style is not supported it seems.

[Radar WebKit Bug Importer]

<rdar://problem/30318695>

[Alexey Proskuryakov]

*** Bug 167847 has been marked as a duplicate of this bug. ***

[Addison Phillips]

You may find the testing information from the duplicate bug useful:


See https://www.w3.org/International/tests/repo/results/counter-styles.en.html  (click on the large text in the left-most column to run the tests)

The lack of counter style support affects Japanese, Chinese and Korean numbering, which should use "、" or "," instead of "." after each counter. See https://github.com/w3c/jlreq/issues/12 as discussed in w3c Japanese layout requirements task force.

[Liam Quin]

At the very least it would be heplful if Webkit implemented
list-style: "foo";
so that a polyfill could be written reliably. But it would be better if the @counter-style rule was implemented.

This affects a long list of languages that were removed from the draft of the counter styles spec when the @counter-style rule was added to let stylesheet authors define them.

[Liam Quin]

See also bug 167729 for requesting the string-value for supporting Russian.

[Sierk Bornemann]

Any progress with fixing this issue?

[r12a]

Ping?

[Gérard Talbot (no longer involved)]

Chrome/Blink equivalent bug report:

Issue 687225: Lack of @counter-style support
https://bugs.chromium.org/p/chromium/issues/detail?id=687225

[r12a]

@counter-styles is now supported on Gecko and Blink browsers.  Is there any progress on support for WebKit ?

See test results at https://www.w3.org/International/i18n-tests/results/counter-styles

[Tyler Wilcock]

(In reply to r12a from comment #10)
> @counter-styles is now supported on Gecko and Blink browsers.  Is there any
> progress on support for WebKit ?
> 
> See test results at
> https://www.w3.org/International/i18n-tests/results/counter-styles

WebKit can parse @counter-style rules and descriptors behind a feature flag, but everything else remains (making a map of @counter-styles available in style resolvers, using that map to render lists).  I've been busy for the last month and will be for at least another, but I'd like to get back to this when I can.  Otherwise, if anyone else has time, feel free to take this on.

[Subbu Sastry]

Hello folks! A gentle nudge and check in regarding this bug.

I work at the Wikimedia Foundation and on my team, we are working on a replacement wikipage rendering engine (Parsoid) which plans to use CSS counters for localized numbering schemes. We are beginning to nudge different wikis to use custom counter styles instead of hardcoded strings in text for improved UX when these pages are edited. But, not having this support in Safari would limit the availability of this localization (hebrew, hindi, spanish, vietnamese are a few prominent examples). I wanted to gently nudge you all to see if you could prioritize this request. 

Even with the current wikipage rendering engine, having this support would improve rendering for some wikis that already use custom counter styles for ordered lists.

https://sat.wikipedia.org/wiki/%E1%B1%A5%E1%B1%A4%E1%B1%A0%E1%B1%A0%E1%B1%A4%E1%B1%A2#%E1%B1%A5%E1%B1%9F%E1%B1%B9%E1%B1%A0%E1%B1%B7%E1%B1%AD%E1%B1%9F%E1%B1%B9%E1%B1%9B is an example.

Thanks very much!

[Tim Nguyen (:ntim)]

This is mostly implemented at this point, please file separate issues if needed.