fix: make Vue template rendering safer (086dfbe2) · Commits · GitLab.org / gitlab-vscode-extension

src/webview/.eslintrc.json

+1 −0

Original line number	Diff line number	Diff line
		@@ -28,6 +28,7 @@
		"vue": "never"
		}
		],
		"vue/no-v-html": "error",
		"vue/max-attributes-per-line": "off",
		"vue/html-indent": "off",
		"vue/html-closing-bracket-newline": "off",

src/webview/package-lock.json

+5 −0

Original line number	Diff line number	Diff line
		@@ -5955,6 +5955,11 @@
		}
		}
		},
		"dompurify": {
		"version": "2.3.3",
		"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.3.3.tgz",
		"integrity": "sha512-dqnqRkPMAjOZE0FogZ+ceJNM2dZ3V/yNOuFB7+39qpO93hHhfRpHw3heYQC7DPK9FqbQTfBKUJhiSfz4MvXYwg=="
		},
		"domutils": {
		"version": "1.7.0",
		"resolved": "https://registry.npmjs.org/domutils/-/domutils-1.7.0.tgz",

src/webview/package.json

+1 −0

Original line number	Diff line number	Diff line
		@@ -12,6 +12,7 @@
		},
		"dependencies": {
		"dayjs": "^1.10.7",
		"dompurify": "^2.3.3",
		"markdown-it": "^10.0.0",
		"markdown-it-checkbox": "^1.1.0",
		"v-tooltip": "^2.1.3",

src/webview/src/assets/icons.js

+0 −6

Original line number	Diff line number	Diff line
		export default {
		gitLabLogo:
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M29.782 199.732L256 493.714 8.074 309.699c-6.856-5.142-9.712-13.996-7.141-21.993l28.849-87.974zm75.405-174.806c-3.142-8.854-15.709-8.854-18.851 0L29.782 199.732h131.961L105.187 24.926zm56.556 174.806L256 493.714l94.257-293.982H161.743zm349.324 87.974l-28.849-87.974L256 493.714l247.926-184.015c6.855-5.142 9.711-13.996 7.141-21.993zm-85.404-262.78c-3.142-8.854-15.709-8.854-18.851 0l-56.555 174.806h131.961L425.663 24.926z"></path></svg>',
		label:
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="currentColor" d="M15 1H9.828a2 2 0 0 0-1.414.586L1.586 8.414a2 2 0 0 0 0 2.828l3.172 3.172a2 2 0 0 0 2.828 0l6.828-6.828A2 2 0 0 0 15 6.172V1zm-4 5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path></svg>',
		comment_dots:
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="currentColor" d="M14 1a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H4.71L1.5 14.855A1 1 0 0 1 0 13.99V3a2 2 0 0 1 2-2h12zm0 2H2v9.257L4.175 11H14V3zM5 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm3 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm3 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"></path></svg>',
		git_merge:
		@@ -43,8 +41,4 @@ export default {
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="currentColor" d="M4.17456,11 L14,11 L14,3 L2,3 L2,12.2568 L4.17456,11 Z M4.71094,13 L14,13 C15.1046,13 16,12.1046 16,11 L16,3 C16,1.89543 15.1046,1 14,1 L2,1 C0.895431,1 0,1.89543 0,3 L0,13.9897 C0,14.7597 0.833719,15.2408 1.50039,14.8555 L4.71094,13 Z"/></svg>',
		thumbtack:
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="currentColor" d="M15.0001,4.58579 C15.3906,4.97631 15.3906,5.60948 15.0001,6 C14.6787,6.32133 14.1931,6.37826 13.8136,6.1708 L11,8.98435 L11,10.5858 C11,11.4767 9.92288,11.9229 9.29292,11.2929 L8,9.99998 L2.55627,14.5364 C2.19684,14.836 1.743773,15 1.2759,15 L1,15 L1,14.7241 C1,14.2562 1.164032,13.8032 1.463557,13.4437 L6,8 L4.70713,6.707106 C4.07716,6.07714 4.52333,5 5.41424,5 L7.01953,5 L9.83055,2.18899 C9.62146,1.80908 9.67793,1.32204 9.99997,0.999999 C10.3905,0.609475 11.0237,0.609475 11.4142,0.999999 L15.0001,4.58579 Z M7.84796,7 L11.2169,3.63108 L12.3709,4.78506 L9.00002,8.15592 L9.00002,8.17157 L7.82845,7 L7.84796,7 Z"/></svg>',
		chevronDown:
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z"></path></svg>',
		chevronRight:
		'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path fill="currentColor" d="M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z"></path></svg>',
		};

src/webview/src/components/Discussion.vue

+7 −8

Original line number	Diff line number	Diff line
		<script>
		import Note from './Note';
		import CommentForm from './CommentForm';
		import icons from '../assets/icons';
		import ChevronDownIcon from './icons/ChevronDownIcon';
		import ChevronRightIcon from './icons/ChevronRightIcon';

		export default {
		name: 'Discussion',
		@@ -21,6 +22,8 @@ export default {
		components: {
		Note,
		CommentForm,
		ChevronDownIcon,
		ChevronRightIcon,
		},
		computed: {
		initialDiscussion() {
		@@ -36,7 +39,7 @@ export default {
		return this.isRepliesVisible ? 'Collapse replies' : 'Expand replies';
		},
		toggleRepliesIcon() {
		return this.isRepliesVisible ? this.chevronDownSvg : this.chevronRightSvg;
		return this.isRepliesVisible ? ChevronDownIcon : ChevronRightIcon;
		},
		},
		methods: {
		@@ -47,10 +50,6 @@ export default {
		this.isEditing = !this.isEditing;
		},
		},
		created() {
		this.chevronDownSvg = icons.chevronDown;
		this.chevronRightSvg = icons.chevronRight;
		},
		};
		</script>

		@@ -58,7 +57,7 @@ export default {
		<div class="discussion">
		<note :noteable="initialDiscussion" />
		<button v-if="hasReplies" @click="toggleReplies" class="collapse js-collapse">
		<span class="chevron" v-html="toggleRepliesIcon" /> {{ toggleRepliesText }}
		<component :is="toggleRepliesIcon" /> {{ toggleRepliesText }}
		</button>
		<template v-if="isRepliesVisible">
		<note v-for="note in replies" :key="note.id" :noteable="note" />
		@@ -81,7 +80,7 @@ export default {
		margin: 0;
		}

		.chevron svg {
		svg {
		width: 10px;
		height: 10px;
		}