js selectorTextにdataタグが反応しない

Question

おこっていること

insertしたcssルールをdeleteRulesで消したいのですが、dataタグが反応しません。

var stylesheets = document.styleSheets.item(0);

stylesheets.insertRule(".chat-line__username-container span{ display: none !important; }" , stylesheets.cssRules.length);
 
stylesheets.insertRule('span[data-test-selector="chat-message-separator"]{ display: none !important; }', stylesheets.cssRules.length);

stylesheets.insertRule(".chat-scrollable-area__message-container > :nth-child(even){ background-color: #f5f5f5; }", stylesheets.cssRules.length);

上記の３つを追加したのですが、真ん中のdataタグのクラスルールだけselectorTextに反応してくれません。(下記コード)
他２つはselectorTextで確認できました。
console.log(stylesheets)で確認できるクラスルールリストにはちゃんと表示されています。

for(var i = 0; i < stylesheets.cssRules.length; i++){
 console.log(stylesheets.cssRules[i].selectorText);
//'span[data-test-selector="chat-message-separator"]'のところだけundefinedとでる
}

Comments

[m.ts10806]

dataタグ　とは。
data-test-selectorのことならdata属性です。
styleではないのでは。

[int32_t]

Chromeで2つ目のselectorTextは普通に表示されました。何のブラウザで確認しましたか?

[Styfish]

chromeです！

[int32_t]

では開示されていないコードが原因の可能性が高いです。問題を再現できる完全なコードを開示してください。

[Styfish]

すみません！自己解決しました！
ありがとうございました！

[m.ts10806]

あとから他人が見ても参考にできるように質問内容調整し、具体的に回答としておこして解決済みとしてください。

[int32_t]

できれば原因と解決方法を回答として書いてくださいね。トラブル事例として他者の役に立ちますので。

Answer 1

消すと順番が変わってしまうのを頭に入れてなかっただけでした。