Render GFM Mermaid diagrams in a sandboxed iframe
Related issues: #342208 (closed), #345592 (closed)
What does this MR do and why?
This MR moves rendering of mermaid diagrams in GFM within a sandboxed environment by using iframe's sandbox attribute. This should help in minimizing the impact from XSS vulnerabilities caused by Mermaid, and possibly with other 3rd party libraries in the future.
Details:
- Each mermaid diagram is rendered in a separate iframe (
https://<gitlab-instance>/-/sandbox/mermaid
) - The iframe gets loaded in a cross-origin sandboxed environment
- The iframe gets the diagram source via
postMessage
once it's loaded - The iframe draws the diagram and sends a
postMessage
toparent
window communicated the rendered diagram size - Parent window receives the
postMessage
and adjusts the iframe size. - Act natural and say goodbye to
Found a new mermaid XSS vulnerability
emails
Note: The changes are behind a new feature flag sandboxed_mermaid
.
Screenshots or screen recordings
^ An example to illustrate that
- the mermaid diagram still gets rendered correctly
- the xss payloads taken from #345452 (closed) & #345035 (closed) did not trigger any cross-site script executions within the gitlab context.
Live Demo (Internal)
A live demo blocking an XSS vector was shared internally in this Slack thread.
Other screenshots
Follow-up issues
- copy as GFM / clipboard button is broken - #349497 (closed)
- Performance improvements, responsiveness & test coverage - #349602 (closed)
- jquery removal - #349779 (closed)
- Follow-up MR with small improvements - !77761 (closed)
- Related MR - !76470 (merged) which was merged into this
Notes for maintainer
- QA specs failures are unrelated and known - !74414 (comment 804219786)
- CSP changes - !74414 (diffs, comment 804364338)
How to set up and validate locally
- Checkout the branch
djadmin-sandbox-mermaid
- Enable
sandboxed_mermaid
feature flag - Update a README.md for any project
- Preview the markdown
- Check the console for any errors when XSS payloads are used
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Edited by Dheeraj Joshi