Improve Frontend Security Posture

This issue should list down all the possible areas where we can make improvement to strengthen our Frontend Security.

Mitigating Cross-site Scripting (XSS)

Update Sanitizer

1. Swap sanitize-html for dompurify (more robust) - !31928 (merged), gitlab-ui!1636 (merged)

Avoid v-html

Since we know, v-html is bad

1. Add v-safe-html directive which sanitizes html by default - gitlab-ui!1413 (merged)
2. Add ESLint rules to prevent using v-html - #232488 (closed)
3. Audit and remove existing v-html usages - &4273 (closed)

Prevent URL injection

1. Add safe-link directive to prevent url injection - Documentation, gitlab-ui!1457 (merged)
2. GlLink component should prevent JS execution by default - gitlab-ui!1472 (merged)
3. GlButton component should prevent JS execution by default - gitlab-ui#1379 (closed)

Development guidelines

1. Frontend Security Best Practices - https://docs.gitlab.com/ee/development/secure_coding_guidelines.html#xss-guidelines

Evaluate

• https://gitlab.com/gitlab-org/gitlab/-/issues/220171 (v-safe-link should fix this ideally, but need to audit)
• https://gitlab.com/gitlab-org/gitlab/-/issues/208419 (v-safe-html should fix it, but audit and evaluate)

Defense in depth

Improve Content Security Policy

• Get rid of unsafe-inline
• Replace self by precise sub-directories - https://gitlab.com/gitlab-com/gl-security/appsec/appsec-reviews/-/issues/44
• https://gitlab.com/gitlab-com/gl-infra/infrastructure/-/issues/9723

Trusted Types

• Implement Trusted types - Vue doesn't support TT yet

Others

• Add SameSite cookies
• Subresource Integrity