fix: Prevent auto-linking when typing URL inside inline code mark #4160
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Please describe your changes
At Doist we have extended the Code extension to allow all marks (e.g., Bold, Italic, and Strikethrough) to coexist with the
Code
mark, which gives a behaviour that more closely resembles GitHub, allowing us to render inline code marks with formatting and links, like this:Typist
.However, this created an issue for us, where URLs typed inside inline code marks were automatically converted into links, which is not the behaviour we want. Here's a demo of our own editor based on Tiptap exhibiting the issue:
CleanShot.2023-06-22.at.22.54.59.mp4
How did you accomplish your changes
Added a filter rule to the autolink helper where we check if the detected link being typed is inside a code mark, if it is, we discard it.
How have you tested your changes
Manually by bringing the autolink.ts file into our own editor and our own extended Link extension with the changes proposed in this PR.
How can we verify your changes
Tweak the editor running on Tiptap's homepage to run the Code extension without excluding all other marks (ref), and to use the changes proposed here. Then try something similar to demo above.
Checklist