Fix TechDocs download bug when backend/app hosts are the same.

Signed-off-by: Eric Peterson <ericpeterson@spotify.com>
backstage · Feb 1, 2022 · 742434a · 742434a
1 parent a28838a
commit 742434a
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 1 deletion.
diff --git a/.changeset/techdocs-funkar-varje-gang.md b/.changeset/techdocs-funkar-varje-gang.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs': patch
+---
+
+Fixed a bug where links to files within a TechDocs site that use the `download` attribute would result in a 404 in cases where the TechDocs backend and Backstage frontend application are on the same host.
diff --git a/plugins/techdocs-backend/examples/documented-component/docs/extensions.md b/plugins/techdocs-backend/examples/documented-component/docs/extensions.md
@@ -88,6 +88,12 @@ Weather: :sunny: :umbrella: :cloud: :snowflake:
 
 Animals: :tiger: :horse: :turtle: :wolf: :frog:
 
+### Attributes
+
+[A Download Link](./images/backstage-logo-cncf.svg){: download }
+
+![A Scaled Image](./images/backstage-logo-cncf.svg){: style="width: 100px" }
+
 ### MDX truly sane lists
 
 - attributes

diff --git a/plugins/techdocs/src/reader/transformers/addLinkClickListener.test.ts b/plugins/techdocs/src/reader/transformers/addLinkClickListener.test.ts
@@ -71,4 +71,31 @@ describe('addLinkClickListener', () => {
 
     expect(fn).toHaveBeenCalledTimes(0);
   });
+
+  it('does not call onClick when a link has a download attribute', async () => {
+    const fn = jest.fn();
+    const shadowDom = await createTestShadowDom(
+      `
+      <!DOCTYPE html>
+      <html>
+        <body>
+          <a download href="http://localhost:3000/file.pdf">Download</a>
+        </body>
+      </html>
+    `,
+      {
+        preTransformers: [],
+        postTransformers: [
+          addLinkClickListener({
+            baseUrl: 'http://localhost:3000',
+            onClick: fn,
+          }),
+        ],
+      },
+    );
+
+    shadowDom.querySelector('a')?.click();
+
+    expect(fn).toHaveBeenCalledTimes(0);
+  });
 });
diff --git a/plugins/techdocs/src/reader/transformers/addLinkClickListener.ts b/plugins/techdocs/src/reader/transformers/addLinkClickListener.ts
@@ -32,7 +32,7 @@ export const addLinkClickListener = ({
         const href = target.getAttribute('href');
 
         if (!href) return;
-        if (href.startsWith(baseUrl)) {
+        if (href.startsWith(baseUrl) && !elem.hasAttribute('download')) {
           e.preventDefault();
           onClick(e, href);
         }