From 63b6920ce412dac59247f988c95127b1f9fdb784 Mon Sep 17 00:00:00 2001
From: Sybren <122987084+drsybren@users.noreply.github.com>
Date: Wed, 1 Mar 2023 22:30:51 +0100
Subject: [PATCH] Allow `<video>` in MarkDown (#22892)

As you can imagine, for the Blender development process it is rather
nice to be able to include videos in issues, pull requests, etc.

This PR allows the `<video>` HTML tag to be used in MarkDown, with the
`src`, `autoplay`, and `controls` attributes.

## Help Needed

To have this fully functional, personally I feel the following things
are still missing, and would appreciate some help from the Gitea team.

### Styling

Some CSS is needed, but I couldn't figure out which of the LESS files
would work. I tried `web_src/less/markup/content.less` and
`web_src/less/_base.less`, but after running `make` the changes weren't
seen in the frontend.

This I would consider a minimal set of CSS rules to be applied:

```css
video {
  max-width: 100%;
  max-height: 100vh;
}
```

### Default Attributes

It would be fantastic if Gitea could add some default attributes to the
`<video>` tag. Basically `controls` should always be there, as there is
no point in disallowing scrolling through videos, looping them, etc.

### Integration with the attachments system

Another thing that could be added, but probably should be done in a
separate PR, is the integration with the attachments system. Dragging in
a video should attach it, then generate the appropriate MarkDown/HTML.
---
 modules/markup/sanitizer.go | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/modules/markup/sanitizer.go b/modules/markup/sanitizer.go
index e59f6c7c8424..600ccbf3c612 100644
--- a/modules/markup/sanitizer.go
+++ b/modules/markup/sanitizer.go
@@ -132,6 +132,8 @@ func createDefaultPolicy() *bluemonday.Policy {
 
 	policy.AllowAttrs(generalSafeAttrs...).OnElements(generalSafeElements...)
 
+	policy.AllowAttrs("src", "autoplay", "controls").OnElements("video")
+
 	policy.AllowAttrs("itemscope", "itemtype").OnElements("div")
 
 	// FIXME: Need to handle longdesc in img but there is no easy way to do it