Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MkCodeEditorの行がずれてしまう #12927

Closed
1 task
1Step621 opened this issue Jan 6, 2024 · 14 comments · Fixed by #13175 or #13188
Closed
1 task

MkCodeEditorの行がずれてしまう #12927

1Step621 opened this issue Jan 6, 2024 · 14 comments · Fixed by #13175 or #13188
Labels
⚠️bug? This might be a bug

Comments

@1Step621
Copy link
Contributor

1Step621 commented Jan 6, 2024

💡 Summary

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

🥰 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
@1Step621 1Step621 added the ⚠️bug? This might be a bug label Jan 6, 2024
@kakkokari-gtyih
Copy link
Contributor

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

@1Step621
Copy link
Contributor Author

1Step621 commented Jan 10, 2024

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

textareaのほう
Screenshot from 2024-01-11 01-19-11
highlighterのほう
Screenshot from 2024-01-11 01-19-16

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

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

これ直ってなさそう

@kakkokari-gtyih
Copy link
Contributor

kakkokari-gtyih commented Feb 6, 2024

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

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

Screenshot from 2024-02-06 21-18-20
これくらいずれる

@kakkokari-gtyih
Copy link
Contributor

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

@kakkokari-gtyih
Copy link
Contributor

kakkokari-gtyih commented Feb 6, 2024

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

image

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

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

@kakkokari-gtyih
Copy link
Contributor

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

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

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

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

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

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

font-family: Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace(自分の環境では最終的にAndale Monoが適用される)

font-family: Andale Mono
で挙動が異なる🤯
後者だとずれない

@kakkokari-gtyih
Copy link
Contributor

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

@1Step621
Copy link
Contributor Author

1Step621 commented Feb 6, 2024

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
⚠️bug? This might be a bug
Projects
None yet
2 participants