Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Gitea 1.21.4 adds 'user-content-' in markdown file #29196

Closed
makar112233 opened this issue Feb 16, 2024 · 12 comments · Fixed by #29305
Closed

Gitea 1.21.4 adds 'user-content-' in markdown file #29196

makar112233 opened this issue Feb 16, 2024 · 12 comments · Fixed by #29305
Assignees
Labels
Milestone

Comments

@makar112233
Copy link

Description

Hi.
I can't navigate through .md file in my repo, because all links in headers are converting from readme.md#_toc152597800 to readme.md#user-content-_toc152597800 and it breaks navigation through file.
I read, that it was fixed in #11903 but I can reproduce it in my local instance and in public Gitea instance: https://try.gitea.io/wenofib626/user-content/src/branch/main/readme.md

Gitea Version

1.21.4

Can you reproduce the bug on the Gitea demo site?

Yes

Log Gist

No response

Screenshots

No response

Git Version

2.43.0

Operating System

linux

How are you running Gitea?

Self-hosted, systemd

Database

PostgreSQL

@wxiaoguang
Copy link
Contributor

wxiaoguang commented Feb 16, 2024

Regression of Make user-content-* consistent with github #26388 @CaiCandong

Oh sorry, maybe not related .... need figure out why .... (Actually I can find a related PR for "fixing": Fix README TOC links #22577 )

@silverwind
Copy link
Member

Keep in mind user-content- prefix is also a security precaution, because we can't allow user content to override ids on the page. The mechanism should be completely transparent to the user, e.g. hash navigation should work with and without the prefix.

@silverwind
Copy link
Member

@makar112233 what is the exact issue? Does hash navigation not work for you? Keep note it does require having JavaScript enabled to work.

@wxiaoguang
Copy link
Contributor

but I can reproduce it in my local instance and in public Gitea instance: https://try.gitea.io/wenofib626/user-content/src/branch/main/readme.md

@silverwind according to the report, and the demo on try.gitea.io, it doesn't work (neither for me).

@silverwind
Copy link
Member

Ah yes, I can see the issue on try. Maybe something wrong in https://github.com/go-gitea/gitea/blob/main/web_src/js/markup/anchors.js or does the backend set ids that are incompatible with the JS?

@makar112233
Copy link
Author

makar112233 commented Feb 16, 2024

@silverwind
It works fine on neighbor Bitbucket server and it didn’t add “user-content” words into link.
Could you, please, help to fix it in Gitea, if it is possible? I’m not a JS or Go developer and don’t have required knowledge to be a collaborator:-(

@silverwind
Copy link
Member

silverwind commented Feb 19, 2024

Actually no, I still don't understand what the issue is supposed to be. HTML here is

image

The <a> is inserted by the JS and is the "link" icon when hovering the heading. When clicking it, the page scrolls to the heading and this persists when hitting F5 as well because of the JS in initMarkupAnchors.

This behaviour is the same as GitHub, which has HTML like this:

image

So the only reason why those links do not work is that your browser's JS is disabled or broken and I'm pretty sure it wouldn't work on GitHub either on such a browser.

@DanielMatiasCarvalho
Copy link
Contributor

Hello.

Could this issue be assigned to me? I would like to give a try at solving this.

@silverwind
Copy link
Member

silverwind commented Feb 19, 2024

Ah I see now that the problem is about the manual TOC links

[Review](#_toc152597800)
[Staging](#_toc152597802)
[Development](#_toc152597803)
[Testing](#_toc152597828)
[Unit-tests](#_toc152597829)

Renders as

<p dir="auto"><a href="#user-content-_toc152597800" rel="nofollow">Review</a></p>
<p dir="auto"><a href="#user-content-_toc152597802" rel="nofollow">Staging</a></p>
<p dir="auto"><a href="#user-content-_toc152597803" rel="nofollow">Development</a></p>
<p dir="auto"><a href="#user-content-_toc152597828" rel="nofollow">Testing</a></p>
<p dir="auto"><a href="#user-content-_toc152597829" rel="nofollow">Unit-tests</a></p>

So we need to handle the user-content- in user-generated links in JS. Should check how GitHub does it.

@silverwind
Copy link
Member

@DanielMatiasCarvalho give it a try. If we don't hear back, I will fix it in a couple of days.

@makar112233
Copy link
Author

Thank you in advance, guys.

@makar112233
Copy link
Author

@DanielMatiasCarvalho super! Waiting for release)

@lunny lunny added this to the 1.21.8 milestone Feb 26, 2024
silverwind added a commit that referenced this issue Mar 8, 2024
This seeks to fix the bug reported on issue #29196. 

Cause: 
ID's with custom characters (- , _ , etc.), were not linking correctly
in the Markdown file when rendered in the browser because the ID in the
respective destinies would be different than the one in anchor, while
for IDs with only letters, the ID would be the same.

Fix:
It was suggested that to fix this bug, it should more or less like
GitHub does it. While in gitea the anchors would be put in HTML like
this:
```
<p dir="auto"><a href="#user-content-_toc152597800" rel="nofollow">Review</a></p>
<p dir="auto"><a href="#user-content-_toc152597802" rel="nofollow">Staging</a></p>
<p dir="auto"><a href="#user-content-_toc152597803" rel="nofollow">Development</a></p>
<p dir="auto"><a href="#user-content-_toc152597828" rel="nofollow">Testing</a></p>
<p dir="auto"><a href="#user-content-_toc152597829" rel="nofollow">Unit-tests</a></p>

```
In GitHub, the same anchor's href properties would be the same without
"user-content-" trailing behind.

So my code made sure to change those anchors, so it would not include
"user-content-" and then add respective Event Listeners so it would
scroll into the supposed places.

Fixes: #29196

---------

Co-authored-by: silverwind <me@silverwind.io>
GiteaBot pushed a commit to GiteaBot/gitea that referenced this issue Mar 8, 2024
This seeks to fix the bug reported on issue go-gitea#29196. 

Cause: 
ID's with custom characters (- , _ , etc.), were not linking correctly
in the Markdown file when rendered in the browser because the ID in the
respective destinies would be different than the one in anchor, while
for IDs with only letters, the ID would be the same.

Fix:
It was suggested that to fix this bug, it should more or less like
GitHub does it. While in gitea the anchors would be put in HTML like
this:
```
<p dir="auto"><a href="#user-content-_toc152597800" rel="nofollow">Review</a></p>
<p dir="auto"><a href="#user-content-_toc152597802" rel="nofollow">Staging</a></p>
<p dir="auto"><a href="#user-content-_toc152597803" rel="nofollow">Development</a></p>
<p dir="auto"><a href="#user-content-_toc152597828" rel="nofollow">Testing</a></p>
<p dir="auto"><a href="#user-content-_toc152597829" rel="nofollow">Unit-tests</a></p>

```
In GitHub, the same anchor's href properties would be the same without
"user-content-" trailing behind.

So my code made sure to change those anchors, so it would not include
"user-content-" and then add respective Event Listeners so it would
scroll into the supposed places.

Fixes: go-gitea#29196

---------

Co-authored-by: silverwind <me@silverwind.io>
silverwind added a commit that referenced this issue Mar 8, 2024
Backport #29305 by @DanielMatiasCarvalho

This seeks to fix the bug reported on issue #29196. 

Cause: 
ID's with custom characters (- , _ , etc.), were not linking correctly
in the Markdown file when rendered in the browser because the ID in the
respective destinies would be different than the one in anchor, while
for IDs with only letters, the ID would be the same.

Fix:
It was suggested that to fix this bug, it should more or less like
GitHub does it. While in gitea the anchors would be put in HTML like
this:
```
<p dir="auto"><a href="#user-content-_toc152597800" rel="nofollow">Review</a></p>
<p dir="auto"><a href="#user-content-_toc152597802" rel="nofollow">Staging</a></p>
<p dir="auto"><a href="#user-content-_toc152597803" rel="nofollow">Development</a></p>
<p dir="auto"><a href="#user-content-_toc152597828" rel="nofollow">Testing</a></p>
<p dir="auto"><a href="#user-content-_toc152597829" rel="nofollow">Unit-tests</a></p>

```
In GitHub, the same anchor's href properties would be the same without
"user-content-" trailing behind.

So my code made sure to change those anchors, so it would not include
"user-content-" and then add respective Event Listeners so it would
scroll into the supposed places.

Fixes: #29196

Co-authored-by: DC <106393991+DanielMatiasCarvalho@users.noreply.github.com>
Co-authored-by: silverwind <me@silverwind.io>
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Mar 19, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants