CSSカウンターの入れ子？について

Question

前提

以下のHTMLとCSSで、ChromeとSafari・Firefoxの表示が異なります。

ul {
    counter-reset: test;
}

li::before {
    content: counters(test, "-");
    counter-increment: test;
}

li:nth-of-type(2) {
    counter-reset: test 10;
}

li:nth-of-type(4) {
    counter-reset: test 100;
}

<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

サンプル：
CSS counter test

↓Chromeのスクリーンショット

↓Firefoxのスクリーンショット（Safariも同様です）

質問

これはどちらの実装が仕様に忠実でしょうか。またはどちらも間違っていますか？
仕様に基づいてご回答いただけるのがベストですが、個人的見解でも構いません。

補足

なお、これは正しい実装についての質問であり、解決方法についての質問ではありません。ですので、「counter-resetをリストアイテムに対して使うのが間違っている」とか「counter-setを使えば解決する」とかそういう回答は求めていませんので、ご了承ください。

Answer 1

SafariとFirefoxの挙動が正しい間違っていると思います。

https://drafts.csswg.org/css-lists/#counter-scope

The scope of a counter therefore starts at the first element in the document that instantiates that counter and includes the element’s descendants and its following siblings with their descendants.

Chromeにバグレポートしたほうが良いかと。https://new.crbug.com/

https://drafts.csswg.org/css-lists/#inheriting-counters のステップ2により親要素のカウンターセットがコピーされ、ステップ3により同じ名前のカウンターがない場合のみ前の兄弟要素のカウンターセットがコピーされるとあるので、3番目と５番目の<li>では親要素の test カウンタを参照するのが正しいようです。

Comments

[Lhankor_Mhy]

ありがとうございます。リンクをヒントにIssueを検索してみました（初めからやっとけという話ではありますが）。同様の報告がありました。そして、これが仕様どおりの動作であるとされているようでした。
https://issues.chromium.org/issues/365493094

詳しくは、もう少し読んでみます。

[int32_t]

おお、https://issues.chromium.org/issues/346974104#comment20 によると、https://drafts.csswg.org/css-lists/#inheriting-counters を参照しないといけないみたいですね。回答を更新します。

[int32_t]

https://wpt.fyi/results/css/css-lists/counters-scope-001.html?label=master&label=experimental&aligned これがテストですかね。

[Lhankor_Mhy]

あ、なるほど。よくわかりました。
W3Cのドラフトの履歴を眺めてみたら、その部分の記述が変更されたのが2020年と比較的新しいんですね。このIssueからみたいです。
https://github.com/w3c/csswg-drafts/issues/5477

---

おや、Close されてないぞ、と思っていろいろ見てみたら、なんかこんなIssueも。
https://github.com/w3c/csswg-drafts/issues/9076