Page MenuHomePhabricator

make vector-menu-heading-label not selectable
Open, MediumPublic

Description

It contains the text "Toggle the table of contents" and if you copy the title of the page you may accidentally also copy this text.

Steps to replicate the issue (include links if applicable):

  • Go to an article on Wikipedia, for example open the article Wikipedia
  • Select the title Wikipedia but extend the selection area to include this image
  • Do a copy action to save that in clipboard
  • Now Paste the clipboard in a text area

What happens?:
Wrong clipboard is saved because it would be : "Toggle the table of contents Wikipedia"

That is, the first segment (i.e., "Toggle the table of contents ") makes the clipboard wrong.

What should have happened instead?:
We should make the ToC unselectable. This way, only the title of the article is selected in clipboard.

Software version :
Vector 2022 in Wikipedia

Other information :
One possible solution could be applying this style:

.vector-page-titlebar-toc {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

I have tested this style in my css page and it works well.

Event Timeline

Jdlrobson triaged this task as Medium priority.Jun 29 2023, 5:08 PM
Jdlrobson moved this task from Incoming to Current Fiscal Year on the Web-Team-Backlog board.
Jdlrobson added a project: patch-welcome.
Jdlrobson subscribed.

Presumably the toggle needs to apply user-select CSS https://developer.mozilla.org/en-US/docs/Web/CSS/user-select
Thanks for report and patch welcome!

This could probably be applied to all icon only buttons.

It seems that no one resolved this bug.
Another same problem is with the expression "translate links from en to fa" newly appears. The total selection would be
"Toggle the table of contents
Wikipedia
en
fa"
To solve this problem we should first convert "input element" to "anchor element" for "en" and "fa" and then apply the these styles to make them unselectable.

.vector-page-titlebar-toc .translator-equ-wrapper{
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

I appreciate to resolve this bug faster. Thanks,

Hooman_Mallahzadeh raised the priority of this task from Medium to High.Apr 13 2024, 4:17 PM