After updating to D11.2/10.5, Drupal ships with CKEditor 45. See https://www.drupal.org/project/ckeditor_link_styles/issues/3533296 🐛 Link styles no longer be available on link creation after D11.2/10.5 updates Active for explanation of how this changes link style UI.
Using the new UI, when a link style is applied to a link that has its URL supplied via LinkIt module, the URL alias is no longer output on the frontend.
LinkIt allows you to search for content on the site and takes care of substituting the content's path alias for its "real" URL such as /node/1234
Now, when a link style is added to a link and the content is saved, the link on the frontend is not the path alias. For example, if /about is expected, the link is /node/1234 instead.
By looking at the source in CKEditor, you can see that when the link style is applied to the link, the data attributes provided by LinkIt are removed:
Regular LinkIt link:
<a href="/node/25" data-entity-type="node" data-entity-uuid="919a970f-095b-4caa-aab7-40385d426bf5" data-entity-substitution="canonical">test</a>
After link style applied:
<a class="btn btn-black" href="/node/25">test</a>
Install and configure LinkIt module. Add a link via CKEditor by using the LinkIt field and then give it a link style. Note that the path alias is not used on the front end and data attributes for LinkIt are removed in CKEditor source.
Active
1.1
Code
Editor Advanced Link module has the same issues with LinkIt and the "Open in a new window" option that EAL module adds -- https://www.drupal.org/project/editor_advanced_link/issues/3534044 🐛 Adding "Open in new window" removes all other attributes Active