fix: ignore data urls in parseImagePaths (#4053)

packages/cli/docs-markdown-utils/src/__test__/parseImagePaths.test.ts

@@ -273,6 +273,15 @@ describe("parseImagePaths", () => {
         );
     });
 
+    it("should ignore data urls", () => {
+        const page = "This is a test page with an image ![image](data:image/png;base64,abc)";
+        const result = parseImagePaths(page, PATHS);
+        expect(result.filepaths).toEqual([]);
+        expect(result.markdown.trim()).toMatchInlineSnapshot(
+            '"This is a test page with an image ![image](data:image/png;base64,abc)"'
+        );
+    });
+
     it("should ignore external urls in html tags", () => {
         const page = "This is a test page with an image <img src='https://external.com/image.png' />";
         const result = parseImagePaths(page, PATHS);
@@ -282,6 +291,15 @@ describe("parseImagePaths", () => {
         );
     });
 
+    it("should ignore data urls in html tags", () => {
+        const page = "This is a test page with an image <img src='data:image/png;base64,abc' />";
+        const result = parseImagePaths(page, PATHS);
+        expect(result.filepaths).toEqual([]);
+        expect(result.markdown.trim()).toMatchInlineSnapshot(
+            "\"This is a test page with an image <img src='data:image/png;base64,abc' />\""
+        );
+    });
+
     it("should ignore external urls in mdx img tags", () => {
         const page = "This is a test page with an image <img src={'https://external.com/image.png'} />";
         const result = parseImagePaths(page, PATHS);

packages/cli/docs-markdown-utils/src/parseImagePaths.ts

@@ -134,7 +134,7 @@ function resolvePath(
     pathToImage: string | undefined,
     { absolutePathToFernFolder, absolutePathToMdx }: AbsolutePathMetadata
 ): AbsoluteFilePath | undefined {
-    if (pathToImage == null || isExternalUrl(pathToImage)) {
+    if (pathToImage == null || isExternalUrl(pathToImage) || isDataUrl(pathToImage)) {
         return undefined;
     }
 
@@ -154,6 +154,10 @@ function isExternalUrl(url: string): boolean {
     return /^(https?:)?\/\//.test(url);
 }
 
+function isDataUrl(url: string): boolean {
+    return /^data:/.test(url);
+}
+
 /**
  * This step should run after the images have been uploaded. It replaces the image paths in the markdown with the fileIDs.
  * In the frontend, the fileIDs are then used to securely fetch the images.
@@ -184,7 +188,7 @@ export function replaceImagePathsAndUrls(
         let replaced = original;
 
         function replaceSrc(src: string | undefined) {
-            if (src != null && !isExternalUrl(src)) {
+            if (src != null && !isExternalUrl(src) && !isDataUrl(src)) {
                 try {
                     const fileId = fileIdsMap.get(AbsoluteFilePath.of(src));
                     if (fileId != null) {