1905508 - Feature request: Provide “Copy link” option in context menu of HTML heading elements with ID attributes

Status: ASSIGNED

(Firefox :: Menus, enhancement)

Description

[Šime Vidas]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:129.0) Gecko/20100101 Firefox/129.0

Steps to reproduce:

When a heading element on a web page has an ID attribute

<h2 id="Community">Community</h2>

then it is possible to link to that heading

https://example.com/some-page#Community

It would be useful if Firefox allowed users to copy that link. Imagine if the user right-clicked such a heading, and Firefox provided a “Copy link” or “Copy link to heading” option in the context menu.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::DOM: Core & HTML' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Comment 2

[atjn]

Attachment: Bug 1905508 - Provide "copy link" option in context menu for HTML headings

Comment 3

[atjn]

I have made a prototype for it. I think it works well, would love to get your feedback on it :)

I plan on writing some tests for it soon.

Comment 4

[Šime Vidas]

this.contentWindow.HTMLHeadingElement.isInstance(elem)

In this code, is elem the event target of the click event, right? In that case, it’s possible that the user right-clicks a heading but elem does not refer to that heading. This can happen when the heading contains another element:

<h1 id=Community>
  <span>Community</span>
</h1>

The feature needs to work for such cases too. So there needs to be a check that looks for a heading element among the click event target’s ancestors.

Comment 5

[atjn]

(In reply to Šime Vidas from comment #4)

The feature needs to work for such cases too. So there needs to be a check that looks for a heading element among the click event target’s ancestors.

I agree, which is why it works exactly as you are describing. The check runs on the target of the click event, then recursively on all ancestors of the target.

See the while loop that encloses it:

while (elem) {

And the last command in that loop:

  elem = elem.flattenedTreeParentNode;
}

You can test it by going to https://lea.verou.me/blog/2024/css-conditionals-now/ and seeing that you can still copy a link to each subheading, even though you are right clicking on a link that is enclosed by a header.

Comment 6

[Šime Vidas]

You can test it

Sorry for my ignorance, but how can I test your draft? I only have Firefox Nightly.

Comment 7

[atjn]

Attachment: Menu showcase

Comment 8

[atjn]

(In reply to Šime Vidas from comment #6)

Sorry for my ignorance, but how can I test your draft? I only have Firefox Nightly.

You have to compile Firefox locally with my changes to test it. I just assumed you could do that, but no worries if not. I have attached a video called "Menu showcase" that shows how it works.

Comment 9

[atjn]

I have added some tests now and I believe the feature is ready to land. I am not sure who to tag for review, I hope someone will be assigned to this bug. If the feature is too big to "just land", maybe we could add it behind a preference, and turn it on by default in Nightly to get some user feedback?

One thing I would like to mention is that the feature theoretically could be extended to cover other elements with ID's. For example, the Firefox source docs does not add the ID to the heading, but instead a <section> element that wraps the heading and any content under the heading. In that case, it might be useful to provide a "Copy link to Section" option, and there could be a more generic "Copy link to Element" for things like <div>. But this opens up a million questions, e.g. what if a website author changes the ID on a div, expecting that this is an internal change only, but for some reason many users have copied links to that specific div ID.
I think that limiting this feature to headings is much safer and is easier for both website authors and users to understand. Then we could open a second bug to explore what other link methods would be good/bad to support.

Comment 10

[Mathew Hodson]

(In reply to atjn from comment #9)

I have added some tests now and I believe the feature is ready to land. I am not sure who to tag for review, I hope someone will be assigned to this bug.

I added a reviewers group for you on your patch so that they will see it in their queues.

Comment 11

[BugBot [:suhaib / :marco/ :calixte]]

The following patch is waiting for review from an inactive reviewer:

ID	Title	Author	Reviewer Status
D215730	Bug 1905508 - Provide "copy link" option in context menu for HTML headings	dev	cmkm: Back Sep 7, 2024

:dev, could you please find another reviewer?

For more information, please visit BugBot documentation.

Comment 12

[atjn]

@flod is there someone else that can review this, or should I just ignore the BugBot and wait for @cmkm to review?

Comment 13

[Francesco Lodolo [:flod]]

You need to wait for the designed reviewer.

Comment 14

[Mr. Beedell, Roke Julian Lockhart]

#c0

[e-mail], why restrict it to heading elements? Why not any visible tag with an archor?

Comment 15

[atjn]

:zn7esutb I addressed this in #c9.