MkCodeEditorの行がずれてしまう

[1STEP621]

💡 Summary

MkCodeEditorのコードハイライトが実際の字の位置とずれてしまいます。
少なくともコードブロックにAndale Monoが適用される環境、Ubuntu Monoが適用される環境ではずれることを確認しました。

🥰 Expected Behavior

ずれない

🤬 Actual Behavior

ずれる

📝 Steps to Reproduce

1. MkCodeEditorに長めのコードを書く

💻 Frontend Environment

* Model and OS of the device(s): Ubuntu 22.04 LTS
* Browser: Firefox 121.0 (64bit)
* Server URL: misskey.systems
* Misskey: 2023.12.2

🛰 Backend Environment (for server admin)

* Installation Method or Hosting Service:
* Misskey:
* Node:
* PostgreSQL:
* Redis:
* OS and Architecture:

Do you want to address this bug yourself?

• Yes, I will patch the bug myself and send a pull request

[kakkokari-gtyih]

line-heightは統一したはずなんだけどな…なんでだ

[1STEP621]

こちらの環境では違う値が指定されてた(カスタムCSS等は設定していないです)

textareaのほう

highlighterのほう

Edit: highlighter内側の<pre>以下は同じになっていたので謎

[1STEP621]

これ直ってなさそう

[kakkokari-gtyih]

まだだめか（こっちでは問題ないレベルになったんだが）

[1STEP621]

これくらいずれる

[kakkokari-gtyih]

Firefox Developer Edition v123.0b6 (Windows 11 22H2) で再現しなかった

[kakkokari-gtyih]

(PRで加えた変更と同等のcssを適用したioで検証)

[1STEP621]

同じFirefoxでもWindows(11)だと再現しなかった

[kakkokari-gtyih]

Browser-specificだし私はmac持ってないので対応できない🫠

[1STEP621]

(弊環境はUbuntu 22.04)
フォントによる差の可能性もあるかも

[1STEP621]

#13175 の修正が入る前はUbuntu Monoでもずれが再現していたけど、Ubuntu Monoでは再現しなくなっている

[1STEP621]

font-family: Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace(自分の環境では最終的にAndale Monoが適用される)
と
font-family: Andale Mono
で挙動が異なる🤯
後者だとずれない

[kakkokari-gtyih]

textareaかshikiどちらかに別のフォントが適用されている可能性

[1STEP621]

Shikiのルートにある<pre>にはmonospaceが設定されていた
Consolas,Monaco,Andale Mono,Ubuntu Mono,monospaceの指定がUAスタイルシートに負けている...？？