Skip to content

Commit 3006636

Browse files
wxiaoguangwxiaoguang
committed
fix
1 parent 41b4ef8 commit 3006636

File tree

10 files changed

+214
-45
lines changed

10 files changed

+214
-45
lines changed

‎modules/markup/html.go‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -442,7 +442,10 @@ func createLink(href, content, class string) *html.Node {
442442
a := &html.Node{
443443
Type: html.ElementNode,
444444
Data: atom.A.String(),
445-
Attr: []html.Attribute{{Key: "href", Val: href}},
445+
Attr: []html.Attribute{
446+
{Key: "href", Val: href},
447+
{Key: "data-markdown-generated-content"},
448+
},
446449
}
447450

448451
if class != "" {

‎modules/markup/sanitizer_default.go‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,7 @@ func (st *Sanitizer) createDefaultPolicy() *bluemonday.Policy {
107107
"start", "summary", "tabindex", "target",
108108
"title", "type", "usemap", "valign", "value",
109109
"vspace", "width", "itemprop",
110+
"data-markdown-generated-content",
110111
}
111112

112113
generalSafeElements := []string{

‎templates/repo/diff/comments.tmpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@
4949
{{end}}
5050
{{end}}
5151
{{template "repo/issue/view_content/add_reaction" dict "ActionURL" (printf "%s/comments/%d/reactions" $.root.RepoLink .ID)}}
52-
{{template "repo/issue/view_content/context_menu" dict "ctxData" $.root "item" . "delete" true "issue" false "diff" true "IsCommentPoster" (and $.root.IsSigned (eq $.root.SignedUserID .PosterID))}}
52+
{{template "repo/issue/view_content/context_menu" dict "item" . "delete" true "issue" false "diff" true "IsCommentPoster" (and $.root.IsSigned (eq $.root.SignedUserID .PosterID))}}
5353
</div>
5454
</div>
5555
<div class="ui attached segment comment-body">

‎templates/repo/issue/view_content.tmpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
{{if not $.Repository.IsArchived}}
4949
{{template "repo/issue/view_content/add_reaction" dict "ActionURL" (printf "%s/issues/%d/reactions" $.RepoLink .Issue.Index)}}
5050
{{end}}
51-
{{template "repo/issue/view_content/context_menu" dict "ctxData" $ "item" .Issue "delete" false "issue" true "diff" false "IsCommentPoster" $.IsIssuePoster}}
51+
{{template "repo/issue/view_content/context_menu" dict "item" .Issue "delete" false "issue" true "diff" false "IsCommentPoster" $.IsIssuePoster}}
5252
</div>
5353
</div>
5454
<div class="ui attached segment comment-body" role="article">

‎templates/repo/issue/view_content/comments.tmpl‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
{{if not $.Repository.IsArchived}}
5656
{{template "repo/issue/view_content/add_reaction" dict "ActionURL" (printf "%s/comments/%d/reactions" $.RepoLink .ID)}}
5757
{{end}}
58-
{{template "repo/issue/view_content/context_menu" dict "ctxData" $ "item" . "delete" true "issue" true "diff" false "IsCommentPoster" (and $.IsSigned (eq $.SignedUserID .PosterID))}}
58+
{{template "repo/issue/view_content/context_menu" dict "item" . "delete" true "issue" true "diff" false "IsCommentPoster" (and $.IsSigned (eq $.SignedUserID .PosterID))}}
5959
</div>
6060
</div>
6161
<div class="ui attached segment comment-body" role="article">
@@ -430,7 +430,7 @@
430430
{{template "repo/issue/view_content/show_role" dict "ShowRole" .ShowRole}}
431431
{{if not $.Repository.IsArchived}}
432432
{{template "repo/issue/view_content/add_reaction" dict "ActionURL" (printf "%s/comments/%d/reactions" $.RepoLink .ID)}}
433-
{{template "repo/issue/view_content/context_menu" dict "ctxData" $ "item" . "delete" false "issue" true "diff" false "IsCommentPoster" (and $.IsSigned (eq $.SignedUserID .PosterID))}}
433+
{{template "repo/issue/view_content/context_menu" dict "item" . "delete" false "issue" true "diff" false "IsCommentPoster" (and $.IsSigned (eq $.SignedUserID .PosterID))}}
434434
{{end}}
435435
</div>
436436
</div>

‎templates/repo/issue/view_content/context_menu.tmpl‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,29 +5,29 @@
55
<div class="menu">
66
{{$referenceUrl := ""}}
77
{{if .issue}}
8-
{{$referenceUrl = printf "%s#%s" .ctxData.Issue.Link .item.HashTag}}
8+
{{$referenceUrl = printf "%s#%s" ctx.RootData.Issue.Link .item.HashTag}}
99
{{else}}
10-
{{$referenceUrl = printf "%s/files#%s" .ctxData.Issue.Link .item.HashTag}}
10+
{{$referenceUrl = printf "%s/files#%s" ctx.RootData.Issue.Link .item.HashTag}}
1111
{{end}}
1212
<div class="item context js-aria-clickable" data-clipboard-text-type="url" data-clipboard-text="{{$referenceUrl}}">{{ctx.Locale.Tr "repo.issues.context.copy_link"}}</div>
13-
{{if .ctxData.IsSigned}}
13+
{{if ctx.RootData.IsSigned}}
1414
{{$needDivider := false}}
15-
{{if not .ctxData.Repository.IsArchived}}
15+
{{if not ctx.RootData.Repository.IsArchived}}
1616
{{$needDivider = true}}
1717
<div class="item context js-aria-clickable quote-reply {{if .diff}}quote-reply-diff{{end}}" data-target="{{.item.HashTag}}-raw">{{ctx.Locale.Tr "repo.issues.context.quote_reply"}}</div>
1818
{{if not ctx.Consts.RepoUnitTypeIssues.UnitGlobalDisabled}}
1919
<div class="item context js-aria-clickable reference-issue" data-target="{{.item.HashTag}}-raw" data-modal="#reference-issue-modal" data-poster="{{.item.Poster.GetDisplayName}}" data-poster-username="{{.item.Poster.Name}}" data-reference="{{$referenceUrl}}">{{ctx.Locale.Tr "repo.issues.context.reference_issue"}}</div>
2020
{{end}}
21-
{{if or .ctxData.Permission.IsAdmin .IsCommentPoster .ctxData.HasIssuesOrPullsWritePermission}}
21+
{{if or ctx.RootData.Permission.IsAdmin .IsCommentPoster ctx.RootData.HasIssuesOrPullsWritePermission}}
2222
<div class="divider"></div>
2323
<div class="item context js-aria-clickable edit-content">{{ctx.Locale.Tr "repo.issues.context.edit"}}</div>
2424
{{if .delete}}
25-
<div class="item context js-aria-clickable delete-comment" data-comment-id={{.item.HashTag}} data-url="{{.ctxData.RepoLink}}/comments/{{.item.ID}}/delete" data-locale="{{ctx.Locale.Tr "repo.issues.delete_comment_confirm"}}">{{ctx.Locale.Tr "repo.issues.context.delete"}}</div>
25+
<div class="item context js-aria-clickable delete-comment" data-comment-id={{.item.HashTag}} data-url="{{ctx.RootData.RepoLink}}/comments/{{.item.ID}}/delete" data-locale="{{ctx.Locale.Tr "repo.issues.delete_comment_confirm"}}">{{ctx.Locale.Tr "repo.issues.context.delete"}}</div>
2626
{{end}}
2727
{{end}}
2828
{{end}}
29-
{{$canUserBlock := call .ctxData.CanBlockUser .ctxData.SignedUser .item.Poster}}
30-
{{$canOrgBlock := and .ctxData.Repository.Owner.IsOrganization (call .ctxData.CanBlockUser .ctxData.Repository.Owner .item.Poster)}}
29+
{{$canUserBlock := call ctx.RootData.CanBlockUser ctx.RootData.SignedUser .item.Poster}}
30+
{{$canOrgBlock := and ctx.RootData.Repository.Owner.IsOrganization (call ctx.RootData.CanBlockUser ctx.RootData.Repository.Owner .item.Poster)}}
3131
{{if or $canOrgBlock $canUserBlock}}
3232
{{if $needDivider}}
3333
<div class="divider"></div>
@@ -36,7 +36,7 @@
3636
<div class="item context js-aria-clickable show-modal" data-modal="#block-user-modal" data-modal-modal-blockee="{{.item.Poster.Name}}" data-modal-modal-blockee-name="{{.item.Poster.GetDisplayName}}" data-modal-modal-form.action="{{AppSubUrl}}/user/settings/blocked_users">{{ctx.Locale.Tr "user.block.block.user"}}</div>
3737
{{end}}
3838
{{if $canOrgBlock}}
39-
<div class="item context js-aria-clickable show-modal" data-modal="#block-user-modal" data-modal-modal-blockee="{{.item.Poster.Name}}" data-modal-modal-blockee-name="{{.item.Poster.GetDisplayName}}" data-modal-modal-form.action="{{.ctxData.Repository.Owner.OrganisationLink}}/settings/blocked_users">{{ctx.Locale.Tr "user.block.block.org"}}</div>
39+
<div class="item context js-aria-clickable show-modal" data-modal="#block-user-modal" data-modal-modal-blockee="{{.item.Poster.Name}}" data-modal-modal-blockee-name="{{.item.Poster.GetDisplayName}}" data-modal-modal-form.action="{{ctx.RootData.Repository.Owner.OrganisationLink}}/settings/blocked_users">{{ctx.Locale.Tr "user.block.block.org"}}</div>
4040
{{end}}
4141
{{end}}
4242
{{end}}

‎templates/repo/issue/view_content/conversation.tmpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@
8383
{{template "repo/issue/view_content/show_role" dict "ShowRole" .ShowRole}}
8484
{{if not $.Repository.IsArchived}}
8585
{{template "repo/issue/view_content/add_reaction" dict "ActionURL" (printf "%s/comments/%d/reactions" $.RepoLink .ID)}}
86-
{{template "repo/issue/view_content/context_menu" dict "ctxData" $ "item" . "delete" true "issue" true "diff" true "IsCommentPoster" (and $.IsSigned (eq $.SignedUserID .PosterID))}}
86+
{{template "repo/issue/view_content/context_menu" dict "item" . "delete" true "issue" true "diff" true "IsCommentPoster" (and $.IsSigned (eq $.SignedUserID .PosterID))}}
8787
{{end}}
8888
</div>
8989
</div>

‎web_src/js/features/repo-issue-edit.ts‎

Lines changed: 52 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import $ from 'jquery';
21
import {handleReply} from './repo-issue.ts';
32
import {getComboMarkdownEditor, initComboMarkdownEditor, ComboMarkdownEditor} from './comp/ComboMarkdownEditor.ts';
43
import {POST} from '../modules/fetch.ts';
@@ -7,11 +6,14 @@ import {hideElem, showElem} from '../utils/dom.ts';
76
import {attachRefIssueContextPopup} from './contextpopup.ts';
87
import {initCommentContent, initMarkupContent} from '../markup/content.ts';
98
import {triggerUploadStateChanged} from './comp/EditorUpload.ts';
9+
import {convertHtmlToMarkdown} from '../markup/html2markdown.ts';
1010

11-
async function onEditContent(event) {
12-
event.preventDefault();
11+
async function tryOnEditContent(e) {
12+
const clickTarget = e.target.closest('.edit-content');
13+
if (!clickTarget) return;
1314

14-
const segment = this.closest('.header').nextElementSibling;
15+
e.preventDefault();
16+
const segment = clickTarget.closest('.header').nextElementSibling;
1517
const editContentZone = segment.querySelector('.edit-content-zone');
1618
const renderContent = segment.querySelector('.render-content');
1719
const rawContent = segment.querySelector('.raw-content');
@@ -100,33 +102,53 @@ async function onEditContent(event) {
100102
triggerUploadStateChanged(comboMarkdownEditor.container);
101103
}
102104

103-
export function initRepoIssueCommentEdit() {
104-
// Edit issue or comment content
105-
$(document).on('click', '.edit-content', onEditContent);
105+
function extractSelectedMarkdown(container: HTMLElement) {
106+
const selection = window.getSelection();
107+
if (!selection.rangeCount) return '';
108+
const range = selection.getRangeAt(0);
109+
if (!container.contains(range.commonAncestorContainer)) return '';
106110

107-
// Quote reply
108-
$(document).on('click', '.quote-reply', async function (event) {
109-
event.preventDefault();
110-
const target = this.getAttribute('data-target');
111-
const quote = document.querySelector(`#${target}`).textContent.replace(/\n/g, '\n> ');
112-
const content = `> ${quote}\n\n`;
111+
// todo: if commonAncestorContainer parent has "[data-markdown-original-content]" attribute, use the parent's markdown content
112+
// otherwise, use the selected HTML content and respect all "[data-markdown-original-content]/[data-markdown-generated-content]" attributes
113+
const contents = selection.getRangeAt(0).cloneContents();
114+
const el = document.createElement('div');
115+
el.append(contents);
116+
return convertHtmlToMarkdown(el);
117+
}
113118

114-
let editor;
115-
if (this.classList.contains('quote-reply-diff')) {
116-
const replyBtn = this.closest('.comment-code-cloud').querySelector('button.comment-form-reply');
117-
editor = await handleReply(replyBtn);
118-
} else {
119-
// for normal issue/comment page
120-
editor = getComboMarkdownEditor($('#comment-form .combo-markdown-editor'));
121-
}
122-
if (editor) {
123-
if (editor.value()) {
124-
editor.value(`${editor.value()}\n\n${content}`);
125-
} else {
126-
editor.value(content);
127-
}
128-
editor.focus();
129-
editor.moveCursorToEnd();
130-
}
119+
async function tryOnQuoteReply(e) {
120+
const clickTarget = (e.target as HTMLElement).closest('.quote-reply');
121+
if (!clickTarget) return;
122+
123+
e.preventDefault();
124+
const contentToQuoteId = clickTarget.getAttribute('data-target');
125+
const targetRawToQuote = document.querySelector<HTMLElement>(`#${contentToQuoteId}.raw-content`);
126+
const targetMarkupToQuote = targetRawToQuote.parentElement.querySelector<HTMLElement>('.render-content.markup');
127+
let contentToQuote = extractSelectedMarkdown(targetMarkupToQuote);
128+
if (!contentToQuote) contentToQuote = targetRawToQuote.textContent;
129+
const quotedContent = `${contentToQuote.replace(/^/mg, '> ')}\n`;
130+
131+
let editor;
132+
if (clickTarget.classList.contains('quote-reply-diff')) {
133+
const replyBtn = clickTarget.closest('.comment-code-cloud').querySelector('button.comment-form-reply');
134+
editor = await handleReply(replyBtn);
135+
} else {
136+
// for normal issue/comment page
137+
editor = getComboMarkdownEditor(document.querySelector('#comment-form .combo-markdown-editor'));
138+
}
139+
140+
if (editor.value()) {
141+
editor.value(`${editor.value()}\n\n${quotedContent}`);
142+
} else {
143+
editor.value(quotedContent);
144+
}
145+
editor.focus();
146+
editor.moveCursorToEnd();
147+
}
148+
149+
export function initRepoIssueCommentEdit() {
150+
document.addEventListener('click', (e) => {
151+
tryOnEditContent(e); // Edit issue or comment content
152+
tryOnQuoteReply(e); // Quote reply to the comment editor
131153
});
132154
}

‎web_src/js/markup/html2markdown.test.ts‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import {convertHtmlToMarkdown} from './html2markdown.ts';
2+
import {createElementFromHTML} from '../utils/dom.ts';
3+
4+
const h = createElementFromHTML;
5+
6+
test('convertHtmlToMarkdown', () => {
7+
expect(convertHtmlToMarkdown(h(`<h1>h</h1>`))).toBe('# h');
8+
expect(convertHtmlToMarkdown(h(`<strong>txt</strong>`))).toBe('**txt**');
9+
expect(convertHtmlToMarkdown(h(`<em>txt</em>`))).toBe('_txt_');
10+
expect(convertHtmlToMarkdown(h(`<del>txt</del>`))).toBe('~~txt~~');
11+
12+
expect(convertHtmlToMarkdown(h(`<a href="link">txt</a>`))).toBe('[txt](link)');
13+
expect(convertHtmlToMarkdown(h(`<a href="https://link">https://link</a>`))).toBe('https://link');
14+
15+
expect(convertHtmlToMarkdown(h(`<img src="link">`))).toBe('![](link)');
16+
expect(convertHtmlToMarkdown(h(`<img src="link" alt="name">`))).toBe('![name](link)');
17+
expect(convertHtmlToMarkdown(h(`<img src="link" width="1" height="1">`))).toBe('<img alt="" width="1" height="1" src="link">');
18+
19+
expect(convertHtmlToMarkdown(h(`<p>txt</p>`))).toBe('txt\n\n');
20+
expect(convertHtmlToMarkdown(h(`<blockquote>a\nb</blockquote>`))).toBe('> a\n> b\n');
21+
22+
expect(convertHtmlToMarkdown(h(`<ol><li>a<ul><li>b</li></ul></li></ol>`))).toBe('1. a\n * b\n\n');
23+
expect(convertHtmlToMarkdown(h(`<ol><li><input checked>a</li></ol>`))).toBe('1. [x] a\n');
24+
});

‎web_src/js/markup/html2markdown.ts‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
import {htmlEscape} from 'escape-goat';
2+
3+
type Processors = {
4+
[tagName: string]: (el: HTMLElement) => string | HTMLElement | void;
5+
}
6+
7+
type ProcessorContext = {
8+
elementIsFirst: boolean;
9+
elementIsLast: boolean;
10+
listNestingLevel: number;
11+
}
12+
13+
function prepareProcessors(ctx:ProcessorContext): Processors {
14+
const processors = {
15+
H1(el) {
16+
const level = parseInt(el.tagName.slice(1));
17+
el.textContent = `${'#'.repeat(level)} ${el.textContent.trim()}`;
18+
},
19+
STRONG(el) {
20+
return `**${el.textContent}**`;
21+
},
22+
EM(el) {
23+
return `_${el.textContent}_`;
24+
},
25+
DEL(el) {
26+
return `~~${el.textContent}~~`;
27+
},
28+
29+
A(el) {
30+
const text = el.textContent || 'link';
31+
const href = el.getAttribute('href');
32+
if (/^https?:/.test(text) && text === href) {
33+
return text;
34+
}
35+
return href ? `[${text}](${href})` : text;
36+
},
37+
IMG(el) {
38+
const alt = el.getAttribute('alt') || 'image';
39+
const src = el.getAttribute('src');
40+
const widthAttr = el.hasAttribute('width') ? ` width="${htmlEscape(el.getAttribute('width') || '')}"` : '';
41+
const heightAttr = el.hasAttribute('height') ? ` height="${htmlEscape(el.getAttribute('height') || '')}"` : '';
42+
if (widthAttr || heightAttr) {
43+
return `<img alt="${htmlEscape(alt)}"${widthAttr}${heightAttr} src="${htmlEscape(src)}">`;
44+
}
45+
return `![${alt}](${src})`;
46+
},
47+
48+
P(el) {
49+
el.textContent = `${el.textContent}\n`;
50+
},
51+
BLOCKQUOTE(el) {
52+
el.textContent = `${el.textContent.replace(/^/mg, '> ')}\n`;
53+
},
54+
55+
OL(el) {
56+
const preNewLine = ctx.listNestingLevel ? '\n' : '';
57+
el.textContent = `${preNewLine}${el.textContent}\n`;
58+
},
59+
LI(el) {
60+
const parent = el.parentNode;
61+
const bullet = parent.tagName === 'OL' ? `1. ` : '* ';
62+
const nestingIdentLevel = Math.max(0, ctx.listNestingLevel - 1);
63+
el.textContent = `${' '.repeat(nestingIdentLevel * 4)}${bullet}${el.textContent}${ctx.elementIsLast ? '' : '\n'}`;
64+
return el;
65+
},
66+
INPUT(el) {
67+
return el.checked ? '[x] ' : '[ ] ';
68+
},
69+
70+
CODE(el) {
71+
const text = el.textContent;
72+
if (el.parentNode && el.parentNode.tagName === 'PRE') {
73+
el.textContent = `\`\`\`\n${text}\n\`\`\`\n`;
74+
return el;
75+
}
76+
if (text.includes('`')) {
77+
return `\`\` ${text} \`\``;
78+
}
79+
return `\`${text}\``;
80+
},
81+
};
82+
processors['UL'] = processors.OL;
83+
for (let level = 2; level <= 6; level++) {
84+
processors[`H${level}`] = processors.H1;
85+
}
86+
return processors;
87+
}
88+
89+
function processElement(ctx :ProcessorContext, processors: Processors, el: HTMLElement) {
90+
if (el.hasAttribute('data-markdown-generated-content')) return el.textContent;
91+
if (el.tagName === 'A' && el.children.length === 1 && el.children[0].tagName === 'IMG') {
92+
return processElement(ctx, processors, el.children[0] as HTMLElement);
93+
}
94+
95+
const isListContainer = el.tagName === 'OL' || el.tagName === 'UL';
96+
if (isListContainer) ctx.listNestingLevel++;
97+
for (let i = 0; i < el.children.length; i++) {
98+
ctx.elementIsFirst = i === 0;
99+
ctx.elementIsLast = i === el.children.length - 1;
100+
processElement(ctx, processors, el.children[i] as HTMLElement);
101+
}
102+
if (isListContainer) ctx.listNestingLevel--;
103+
104+
if (processors[el.tagName]) {
105+
const ret = processors[el.tagName](el);
106+
if (ret && ret !== el) {
107+
el.replaceWith(typeof ret === 'string' ? document.createTextNode(ret) : ret);
108+
}
109+
}
110+
}
111+
112+
export function convertHtmlToMarkdown(el: HTMLElement): string {
113+
const div = document.createElement('div');
114+
div.append(el);
115+
const ctx = {} as ProcessorContext;
116+
ctx.listNestingLevel = 0;
117+
processElement(ctx, prepareProcessors(ctx), el);
118+
return div.textContent;
119+
}

0 commit comments

Comments
 (0)