URL inside inline code is automatically converted into a link

[dmgawel]

With the introduction of #309, URL typed inside inline code blocks are automatically converted into links, which is most likely not the behaviour we want. At least it's not what I would expect, as I usually use inline code block to avoid URL->link conversion. The conversion happens after closing the code block and pressing space.

CleanShot.2023-06-22.at.22.54.59.mp4

[rfgamaral]

I took a quick look and I don't think a solution on our side will be possible, we'll need built-in support to disable autolinking when links are inside inline code marks. Support will need to be added to helpers/autolink.ts.

[rfgamaral]

I couldn't help myyself 😅 and I spend a bit of time digging for a solution. I believe I found one:

diff --git a/packages/extension-link/src/helpers/autolink.ts b/packages/extension-link/src/helpers/autolink.ts
index 123a610c2..71f00d856 100644
--- a/packages/extension-link/src/helpers/autolink.ts
+++ b/packages/extension-link/src/helpers/autolink.ts
@@ -107,18 +107,27 @@ export function autolink(options: AutolinkOptions): Plugin {
 
           find(lastWordBeforeSpace)
             .filter(link => link.isLink)
-            .filter(link => {
-              if (options.validate) {
-                return options.validate(link.value)
-              }
-              return true
-            })
             // calculate link position
             .map(link => ({
               ...link,
               from: lastWordAndBlockOffset + link.start + 1,
               to: lastWordAndBlockOffset + link.end + 1,
             }))
+            // ignore link inside code mark
+            .filter(link => {
+              return !newState.doc.rangeHasMark(
+                link.from,
+                link.to,
+                newState.schema.marks.code,
+              )
+            })
+            // validate link
+            .filter(link => {
+              if (options.validate) {
+                return options.validate(link.value)
+              }
+              return true
+            })
             // add link mark
             .forEach(link => {
               tr.addMark(

Anyone should feel free to open an upstream PR with the patch above, otherwise I'll do it myself, eventually.

[rfgamaral]

Opened a PR upstream with the patch above. Assuming it gets merged, and once it gets merged, we still need to wait for a new Tiptap version to be published, and Typist updated with it, before being able to close this issue on our side.

[engfragui]

As a note, a side-effect caused by this issue is also that Cypress file names get treated as links 😅

CleanShot.2023-08-01.at.10.26.10.mp4

I guess this is because .cy gets detected as a website domain (I'm assuming it might happen with other file extensions other than .cy but haven't tested thoroughly).

[rfgamaral]

@engfragui Yes, that's expected to happen because .cy is a valid TLD.

[doistbot]

🎉 This issue has been resolved in version 1.4.5 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀