fix test, fix open link (force push to make backport easier)

Author: wxiaoguang

modules/markup/internal/finalprocessor.go

@@ -45,8 +45,10 @@ func (p *finalProcessor) Close() error {
 	} else {
 		part1, part2 = nil, buf
 	}
-	if _, err := p.output.Write(part1); err != nil {
-		return err
+	if len(part1) > 0 {
+		if _, err := p.output.Write(part1); err != nil {
+			return err
+		}
 	}
 	if _, err := io.WriteString(p.output, string(p.extraHeadHTML)); err != nil {
 		return err

tests/integration/markup_external_test.go

@@ -68,14 +68,15 @@ func TestExternalMarkupRenderer(t *testing.T) {
 		assert.Equal(t, "text/html; charset=utf-8", resp.Header().Get("Content-Type"))
 		doc := NewHTMLParser(t, resp.Body)
 		iframe := doc.Find("iframe")
-		assert.Equal(t, "/user30/renderer/render/branch/master/README.html", iframe.AttrOr("src", ""))
+		assert.Empty(t, iframe.AttrOr("src", "")) // src should be empty, "data-src" is used instead
+		assert.Equal(t, "/user30/renderer/render/branch/master/README.html", iframe.AttrOr("data-src", ""))
 
 		req = NewRequest(t, "GET", "/user30/renderer/render/branch/master/README.html")
 		resp = MakeRequest(t, req, http.StatusOK)
 		assert.Equal(t, "text/html; charset=utf-8", resp.Header().Get("Content-Type"))
 		bs, err := io.ReadAll(resp.Body)
 		assert.NoError(t, err)
 		assert.Equal(t, "frame-src 'self'; sandbox allow-scripts allow-popups", resp.Header().Get("Content-Security-Policy"))
-		assert.Equal(t, "<div>\n\ttest external renderer\n</div>\n", string(bs))
+		assert.Equal(t, "<script src=\"/assets/js/external-render-iframe.js\"></script><link rel=\"stylesheet\" href=\"/assets/css/external-render-iframe.css\"><div>\n\ttest external renderer\n</div>\n", string(bs))
 	})
 }

web_src/js/markup/render-iframe.ts

@@ -6,8 +6,18 @@ export async function loadRenderIframeContent(iframe: HTMLIFrameElement) {
   if (!iframe.id) iframe.id = generateElemId('gitea-iframe-');
 
   window.addEventListener('message', (e) => {
-    if (e.data && e.data.giteaIframeCmd === 'resize' && e.data.giteaIframeId === iframe.id) {
-      iframe.style.height = `${e.data.giteaIframeHeight}px`;
+    if (!e.data?.giteaIframeCmd || e.data?.giteaIframeId !== iframe.id) return;
+    const cmd = e.data.giteaIframeCmd;
+    if (cmd === 'resize') {
+      iframe.style.height = `${e.data.iframeHeight}px`;
+    } else if (cmd === 'open-link') {
+      if (e.data.anchorTarget === '_blank') {
+        window.open(e.data.openLink, '_blank');
+      } else {
+        window.location.href = e.data.openLink;
+      }
+    } else {
+      throw new Error(`Unknown gitea iframe cmd: ${cmd}`);
     }
   });
 

web_src/js/standalone/external-render-iframe.ts

@@ -4,29 +4,36 @@
 ENABLED = true
 FILE_EXTENSIONS = .in-iframe
 RENDER_CONTENT_MODE = iframe
-RENDER_COMMAND = `echo '<div style="width: 100%; height: 2000px; border: 10px solid red; box-sizing: border-box;">content</div>'`
+RENDER_COMMAND = `echo '<div style="width: 100%; height: 2000px; border: 10px solid red; box-sizing: border-box;"><a href="/">a link</a> <a target="_blank" href="//gitea.com">external link</a></div>'`
 
 */
 
 function mainExternalRenderIframe() {
   const u = new URL(window.location.href);
-  const fn = () => window.parent.postMessage({
-    giteaIframeCmd: 'resize',
-    giteaIframeId: u.searchParams.get('gitea-iframe-id'),
-    giteaIframeHeight: document.documentElement.scrollHeight,
-  }, '*');
-  fn();
-  window.addEventListener('DOMContentLoaded', fn);
-  setInterval(fn, 1000);
+  const iframeId = u.searchParams.get('gitea-iframe-id');
 
-  // make all absolute links open in new window (otherwise they would be blocked by all parents' frame-src)
-  document.body.addEventListener('click', (e) => {
+  // iframe is in different origin, so we need to use postMessage to communicate
+  const postIframeMsg = (cmd: string, data: Record<string, any> = {}) => {
+    return window.parent.postMessage({giteaIframeCmd: cmd, giteaIframeId: iframeId, ...data}, '*');
+  };
+
+  const updateIframeHeight = () => postIframeMsg('resize', {iframeHeight: document.documentElement.scrollHeight});
+  updateIframeHeight();
+  window.addEventListener('DOMContentLoaded', updateIframeHeight);
+  setInterval(updateIframeHeight, 1000); // the easiest way to handle dynamic content changes and easy to debug, can be fine-tuned in the future
+
+  //  no way to open an absolute link with CSP frame-src, it also needs some tricks like "postMessage" or "copy the link to clipboard"
+  const openIframeLink = (link: string, target: string) => postIframeMsg('open-link', {openLink: link, anchorTarget: target});
+  document.addEventListener('click', (e) => {
     const el = e.target as HTMLAnchorElement;
     if (el.nodeName !== 'A') return;
-    const href = el.getAttribute('href');
-    if (!href.startsWith('//') && !href.includes('://')) return;
-    el.target = '_blank';
-  }, true);
+    const href = el.getAttribute('href') || '';
+    // safe links: "./any", "../any", "/any", "//host/any", "http://host/any", "https://host/any"
+    if (href.startsWith('.') || href.startsWith('/') || href.startsWith('http://') || href.startsWith('https://')) {
+      e.preventDefault();
+      openIframeLink(href, el.getAttribute('target'));
+    }
+  });
 }
 
 mainExternalRenderIframe();