Skip to content

shikiToMonaco needs to take into account high-contrast themes #1081

@dobromir-hristov

Description

@dobromir-hristov

Validations

Describe the bug

Enabling a high contrast theme, like the github high contrast one, does not apply a visible foreground color when selecting.

Themes that are meant to be "high contrast" in monaco use the editor.selectionForeground to apply a foreground color when selecting. However, this color is only used if the base of the theme is hc-black or hc-light. I did not find this anywhere specified, I figured it out by trial and error in the monaco playground.

For this to work, we need a way to tell high contrast themes apart. There is already a key in themes for type for the light/dark mode, relying on the name to have high contrast would be brittle.

Setting the base in shikiToMonaco to hc-black for a high-contrast theme enables high contrast mode in Monaco and applies the proper colors.

Reproduction

https://microsoft.github.io/monaco-editor/playground.html?source=v0.54.0#XQAAAAL7LQAAAAAAAABBqQkHQ5NjdMjwa-jY7SIQ9S7DNlzs5W-mwj0fe1ZCDRFc9ws9XQE0SJE1jc2VKxhaLFIw9vEWSxW3yscyeurPvqoxpZvJ0pN64XW8cZPI4S40Vg8c1LA7wDMSmjV0jMU7SwHrLaPWy10wdKQj_5Y1rHmapjwWWhLHG9tWUqapa4osFgf4C4QegJfC4f1Knu3c24NbBlM80-pq3BE0YIXqS-qgAkSTOBXUp52Ois6_IjjhdQ4SxMYpeNdIRaedPphSgYI5DD-yK-WYMwa_qg5Mrk9jH5_286ccFE-PsBx6RvgNiMPYh76cvX0IWilFKyTsIlq1tNTpuzJUmvzS19lU0gsqorgM6gDNWif57h-zoz0EOVaObCXf9myEaBlmMoviWjS5CBz4vRvwYr0jNMRNQAJSunmBhkIOBlGUGF1HyG0pc6rzeliqLG6QRRbfOo0Tt0v1QlBWHuRHNVFb7bT9uClmJfrmVnJL6q36so_Sca0W0mEtg3jP-TbhpKRiIQF9g-lKkO8KjLAsLLK3va-TmshKcQpjpPH9DLNSmTGWxI0lkbfXbIo5TVWb-o4vX1Yb_APiJFXEj55nS7johOY0MF6QBxkZwOk11q9ztdX2kWoLn-gmWNW69viCE3Q1YRbcbKjgpjUp9YR4EzN0hG_casKWQiS8BKAzU85ZhPXDBuE_VkmaCHytyJ9XrZqc0a-mCoWCzBWdVjS0oXS29l1eSvrvrx6DawbHgRpJyJ9WroeFcO59ZHemnp6ITtXZOyaCwYpk6aJhWHEM-kiQAmth-pb9RCYjqLWP38--4_ODApm6jmkulo0105-l_QwXY4maPuUSC-2xzanBUU_Yz9B6ZVoRZrji7LYv1Rf_aZjUu0gj3jHioNNqUuTNaT8FlR_0DY6OGYO8Kcf_Vv5WPZO8QDyUnJB17ZmOcugdrZPEe6dfI-UW2otEQGTFEhrTIxhkR0BnM3-Yl-MmTehbrPzzVnevn-WaebQQs2czSS97vhz9AwGPf7votzs8NLxvVvJ31Xtz721GhUBQX4RAaOpfYVfK9u5V68KtpyEgkHc-9JbxM9EAaE9SVDCE2MUPUdLb3TIKaMjalPzDb8glSoUkM2Yt0WIKpHbDsArHNSCA_mOoxfI8feWGn2pPN0Opn83u1e1p4zkZ3o6wfgMHXfqYev4i_oJoBANIbWWIw8i508pRYihYqa6MP3NybRA3qou9GtmTkiVxBfFut0D_ty4ldUbVxNTYd8rafJp7I6y16uZv6qHBP1Mfe5GykBIQ4JU7R4XQ3yQjdBJ_8o2BmYF_Wxs6CN-AnYUjT6_soPGgPWBVzMpWV0hMkeJNu5_8tdU-i18y8bYQqZOuTaOFfwAZzxk8XJ1mqlXHz8m6UpBDfUFLcNUq9Xp9Jr6qZkOdlg5O6j0ddTXud3oQWhYReDvF3rcmV-G_9S7uFvh4wPYVrz48ObS5itk68p6_0JN5CQIiixgni0Y87LOSQ0NnuVnKrdi3TIVRbaWlLWdG_LiLrQnqyZuB8n7YE71fF0ROXAB0iZi2orPZcXImpOwS0jwr-kDE8HDaIFY9KfTopUzIQ451LSoqLOhu8aIPrjeM8W4lcigFdwGViO9iiugl4tvfWaRhZ3bp1Yq_qxx8Dgu_nHnUOWOEFrehsU48v4ej6IeF_30LQwqOBxQNkz1quJtZhqz-5GZLbACNmpDgUZ4u3W0qCeTl5k1eFGKiOl6QOwu668n8CtbYCKgXLiS1vH_HpgIR5j4xNO071Mq6u1ClyPD_WDu7-EbsBz_6Sl-yLtAjA4JZuaSj9KmTp4KrHq--FB3ysytuIryMnA-fn_E_lofzF0i8FaQE7j4SkAaJM_xkz_hQO23wBVhQpQnJxG0LdhT-gVPpUsByYDtv6gA4_qHiCOb8lrKv-aAXEHguoNgqVfM4zwNV8Fw4G9MPaDG0ttuAMX9-zHEZdKPDGUlEWo-jSD0GPG1DU3lV_8GEm6y2njn01-IUTfWi8h-QsVvhvsvUd4h131OSGeXq22u1cfDJzal8k-TcBFMHNF0NGxdjMNTr4Kmi6oKBsWbV5D_JTQyl_Z8-iDcfsXtWD_-D8gjGHyZn6dSfCRv7lofL_Mwu38q3P89GbACx7DMD9Ha0MmXkzvTynKrhchCUGKPHbWGBpRbKPd8ZVyfF_lLayy_70oZRfzDccfxuZ7g_qCyEfjwrXd1MJXhX3pv0n8O_sOj3HJ6QkcbLKPzb77__Goq9nAf_J3yU4dURXIkSEoapElmzJOSuAJCQ5q8FIL6_pc5dWvy98MRn0amTkCjGQ3AKgajv1CVOqmgNpXx9Gl5FC2vwOrI1giOtzqM5NuQvC8NnWKAG8atwBaTh4BL-dnWuiTnNb6ptAPDhgLaZyCIcOjjXQGIqaX9CqUMPj6spMfYUn8PQXPmOnEGSY-kymZloR6PdmtEP0L76xEJhRrVL-cuuz6_DqKjUVpmMDGR6W3kwK1fAp7p4fQ8nTvcT6KHlstW_Xu1Cu5ESDEIU-MTIGBk9R772w2go1KW8UZOVPcwFPm13UG079jSRwkXaI8I_E8dWKqqGmDYBenfcmI4LdxP5-GiOAtTfAgwjApp2GK2AsTs7sRyfiRAApi8TgIwpiiwf91g-JB8XdNuAo2NahMFhWZXN04J5psgYe_jpEfJ2FWN_b4DIKgbvp7CVtPb4CXj5AWjZv2x7pPk3IhWjzKoY8YcF1b0AyU-kwAz_6zHkBaPFGm2sRBmKkqs7KBLF3FJyIUjxzkS--Nh86oEzvbGm1tYIv5S0VHU2_jipwqnchk2-_FexDtP-_uTsRk8XxBDVor2pTvQGh-5KRURf-y9pANvWVuisZTNGKNdIclzdmObs3KoofKPd60nSvkufYdnL_xm5feQMqcXHRt6lxxt2CniR217dFprzJR1vMvE3DVDnddU7AWM6ZmAl7-NEjbI_GqhaSUge9JWxWK7lqSoqeT5jf1oICLGnm664asmR8-ezEZzfiMCIbR8mNbzm6uUquOOe8g9mSX_fA-TsiHCc8RgBL6DG9VGQe1VXY5WRK0yERdNmawjpvcRkBVX4KK0vlMmxIDscRIJcTXptbNL7L8z2EntWTijmQR51zhXqnAF4Bfbp-zOZKNzQKeMG7RshBcWBoJOJBWJMEO7vIBhh_-MwUAm4WPn3-Qn_OtOLS94p75xBHmFArk3D5Bn7iJL6tI2Nbi4ex_rP0ehsmEoQk7wY1-7NIjCSZc_EJ_FaSCNj9g9IOLxHQa_MNgHO1TVUSuvbPaNUNXnEfCakNbJbAcgRxtsOV9gzqRVDnjzDl7IptEVCKwZaXqva90ZSf5I6hgIST1c2evyph83AqnqLNU-bxdwpURMHil5AfZHIXD04TdWJXyqta4Q_S4Oz62fQDGWFvoV3BU3uU86vUvfgO4HAFvPw0ol1HiW24W7da8-8JDg1l-ZeMBMDybbimcEII9d3UxT8pIb8hrNCZvONxPWkyewkOx_LGdeyZ5N_OYb3Y1zDC9NIryRlAZxAAJHrSiuLi5cUzptb2HYggf7v3n4

Contributes

  • I am willing to submit a PR to fix this issue
  • I am willing to submit a PR with failing tests

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions