Allow popups and links within mermaid diagrams

Related issue - #354010

What does this MR do and why?

This fixes an issue with mermaid diagrams where the links are not opened.

Context

We moved to use iframe sandbox feature to rendering mermaid diagrams with !74414 (merged)

This doesn't allow any popups by default unless allow-popups attribute is used.

Allows popups (like from window.open, target="_blank", showModalDialog). If this keyword is not used, that functionality will silently fail.

Why

Hyperlinks within mermaid diagrams are opened in another window using target="_blank".

Security concerns

  • Allowing external links could lead to phishing attacks. However, it's a feature across GitLab to hyperlink external links, eg in issue descriptions

  • javascript: link are converted to about:blank by mermaid library

  • Attacker can bypass mermaid protections to inject javascript: payloads. However, it could not be abused becaue of GitLab CSP and Iframe sandbox protection.

Screenshots or screen recordings

Before

image

After

allow-popups-mermaid

How to set up and validate locally

  1. Create a README.md
  2. Use the following content to draw diagram (with mermaid syntax)
    sequenceDiagram
    links Alice: {"External Link": "https://google.com", "js link": "javascript:alert(document.domain)"}

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Dheeraj Joshi

Merge request reports

Loading