Incorrect link to reference in autocomplete

[Serena20003]

p5.js version

1.9.4

What is your operating system?

Mac OS

Web browser and version

Chrome 126.0.6478.127

Actual Behavior

When typing out p5.js functions and keywords, the autocomplete list (id="cm-complete-0") shows potential matches. The arrow links to the general reference page.
For example, the p5.js background function code:
<a href="https://p5js.org/reference/#/p5/background" role="link" onclick="event.stopPropagation()" target="_blank"><span class="hint-hidden">open background reference</span><span aria-hidden="true">➔</span></a>
I think the problem comes from the additional #/ in the href: https://p5js.org/reference/#/p5/background

Expected Behavior

When the arrow is clicked, it should open a new tab with the reference page of the specific function/keyword.
For example, the p5.js background function reference page: https://p5js.org/reference/p5/background/

Steps to reproduce

Steps:

1. Type any letter into the web editor.
2. Click on any of the black arrows on a yellow background from the list of autocomplete suggestions.
3. Check the page landed on. It should show the general reference page.

[welcome]

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

[Serena20003]

The link seems to be constructed in p5.js-web-editor/client/modules/IDE/components/show-hint.js line 286

[Souvik-Cyclic]

I would like to work on this, assign this to me.

[Serena20003]

Hi Souvik-Cylic,

Thank you for volunteering! I don't have permission to assign this issue, we will have to wait for someone else to review this issue I think. Sorry!

[Serena20003]

This problem also appears in the console when the function name is undefined and has a suggestion:

Although beyond the scope of web editors, this issue persists in referenced links in references too:

This will really confuse users of the web editor and the references page and add an extra step for them... Maybe there's a way to change all of these issues at one place? And I am not sure if getting rid of the /# will cause any side effects... Please advise!

[raclim]

Hi @Serena20003, thanks so much for raising this!

I believe the reason why these links are constructed this way is because this was the format used for the previous p5.js site (i.e https://archive.p5js.org/reference/#/p5/background), which we recently updated and archived. The URLs are no longer formatted this way in the new website, so I think removing the /# would be fine!

Updating the URLs in the console will probably need to be done through the p5.js library, which handles the FES. However, please feel free to go ahead with creating a fix for the autocomplete one!

[Serena20003]

Got it, thank you for the explanation! I just fixed the autocomplete link, please review, thank you!