Link text selection broken
-
I wanted to select part of the text inside a link to copy it elsewhere.
Normally this would be a simple act of holding down Alt and selecting the text as if there was no link.
But of course NodeBB is installing click event handlers everywhere, somewhere along the hierarchy the browser's default event handling is being messed with, and instead the link is followed.
No one ever remembers to check the
buttons
,shiftKey
,altKey
,ctrlKey
,metaKey
properties of the click event.I wish jQuery's
.click()
method only fired for unmodified left-clicks. 99% of the time that's what webdevs want.
-
Hah!
The only place selection isn't broken is in oneboxes, because NodeBB's click handlers aren't installed there.
-
@Zecc said in Link text selection broken:
I wanted to select part of the text inside a link to copy it elsewhere.
Normally this would be a simple act of holding down Alt and selecting the text as if there was no link.
Wait, What?!?!
Filed into implementation test queue for interactions integration. That sounds way useful!
-
@Zecc said in Link text selection broken:
Normally this would be a simple act of holding down Alt and selecting the text as if there was no link.
Linux:
NO_REPRO
.
-
@PJH I'm on linux (i3wm) and text selection works fine, but when I let go of the mouse button firefox downloads the site the link points to. dunno.
-
@bb36e said in Link text selection broken:
@PJH I'm on linux (i3wm) and text selection works fine, but when I let go of the mouse button firefox downloads the site the link points to. dunno.
I'd stay clear of xtube then....
-
@Zecc Huh, TIL. I've been using browser extensions to copy the text of a link via the context menu.
-
@Zecc said in Link text selection broken:
Normally this would be a simple act of holding down Alt and selecting the text as if there was no link.
huh..... TIL.....
unfortunately no repro for me on chrome mumblenumbers on win10. alt select works just fine.
-
@PJH said in Link text selection broken:
Linux: NO_REPRO.
I always remap that to use WinKey ("meta") instead.
WinKey is IMO the key to use for all system-wide shortcuts. Using Alt is stupid.
-
@bb36e said in Link text selection broken:
@PJH I'm on linux (i3wm) and text selection works fine, but when I let go of the mouse button firefox downloads the site the link points to. dunno.
Yes, this is what happens on Firefox.
But not on Chrome for some reason.I might investigate further sometime. But not this year.
-
@Zecc said in Link text selection broken:
I wanted to select part of the text inside a link to copy it elsewhere.
Yes, NodeBB broke that a while ago. The workaround is to use alt+click to select.
Normally this would be a simple act of holding down Alt and selecting the text as if there was no link.
Well fuck.
But of course NodeBB is installing click event handlers everywhere, somewhere along the hierarchy the browser's default event handling is being messed with, and instead the link is followed.
Of course. Web 3.0, people! Re-implement everything, poorly.
FYI: I can repro this with Chrome+W10+Version 55.0.2883.87 m (64-bit). I tried it on the thread title on /unread. Neither click and drag or alt+click and drag highlight the title links.
-
@Lorne-Kates said in Link text selection broken:
FYI: I can repro this with Chrome+W10+Version 55.0.2883.87 m (64-bit). I tried it on the thread title on /unread. Neither click and drag or alt+click and drag highlight the title links.
It works on /recent though.
-
@Yamikuronue said in Link text selection broken:
It works on /recent though.
Yeah
Repro on Chrome latest on macOS. Works on /recent but not on /unread with or without Alt.
-
@loopback0 said in Link text selection broken:
@Yamikuronue said in Link text selection broken:
It works on /recent though.
Yeah
Repro on Chrome latest on macOS. Works on /recent but not on /unread with or without Alt.
HOLY FUCK IT'S INTENTIONAL? https://github.com/NodeBB/NodeBB/blob/45e412ed7c0a876da177a491c1f03f4623349936/public/src/modules/topicSelect.js#L13-L15
WHY
-
-
@ben_lubar said in Link text selection broken:
@loopback0 said in Link text selection broken:
@Yamikuronue said in Link text selection broken:
It works on /recent though.
Yeah
Repro on Chrome latest on macOS. Works on /recent but not on /unread with or without Alt.
HOLY FUCK IT'S INTENTIONAL? https://github.com/NodeBB/NodeBB/blob/45e412ed7c0a876da177a491c1f03f4623349936/public/src/modules/topicSelect.js#L13-L15
WHY
so..... i should issue this as a PR?
-
-
@boomzilla said in Link text selection broken:
@accalia said in Link text selection broken:
so..... i should issue this as a PR?
Yes, please!
as thou commandest:
-
barisusakli has found an issue with my PR.
. https://github.com/NodeBB/NodeBB/pull/5335#issuecomment-270145222
@boomzilla @ben_lubar suggestions?
-
@accalia Fucking web browsers. I hate it when selection goes crazy like that.
-
@boomzilla said in Link text selection broken:
@accalia Fucking web browsers. I hate it when selection goes crazy like that.
well, now we know why that code is there....
now y'all get to figure out how to fix it. :-P
i'm willing to issue the PR, i'm not debugging weird browser selection shit. :-)
-
@accalia I never had that problem with wtfwebapp, but I used real checkboxes there.
-
@ben_lubar said in Link text selection broken:
@accalia I never had that problem with wtfwebapp, but I used real checkboxes there.
PRs accepted
-
Put
$(this).focus()
in the click handler for the fake-checkbox-thingymabob maybe? (Or whatever would be suitable forthis
)Edit: Maybe
if (ev.shiftKey) { $(this).focus(); //Deselect text selectRange($(this).parents('.category-item').attr('data-tid')); lastSelected = select; return false; }
Lines 17-21 of
public/src/modules/topicSelect.js
I think is the bit you need to look at.
-
Oh, if you shift-click the avatar it selects a range of topics. What a totally discoverable feature which is totally worth inconsistently breaking the browsers own behaviour for.
-
@RaceProUK said in Link text selection broken:
Put
$(this).focus()
in the click handler for the fake-checkbox-thingymabob maybe? (Or whatever would be suitable forthis
)Edit: Maybe
if (ev.shiftKey) { $(this).focus(); //Deselect text selectRange($(this).parents('.category-item').attr('data-tid')); lastSelected = select; return false; }
Lines 17-21 of
public/src/modules/topicSelect.js
I think is the bit you need to look at.Wouldn't that also deselect deliberately selected text?
Can selection be disabled while the shift key is down? Something like:
-
@PJH said in Link text selection broken:
Wouldn't that also deselect deliberately selected text?
Yes, but if you're selecting topics, then you're not selecting text.
-
@loopback0 said in Link text selection broken:
Oh, if you shift-click the avatar it selects a range of topics. What a totally discoverable feature which is totally worth inconsistently breaking the browsers own behaviour for.
I'll say it again. "Web 3.0. Re-implement everything, poorly."
-
@RaceProUK said in Link text selection broken:
@PJH said in Link text selection broken:
Wouldn't that also deselect deliberately selected text?
Yes, but if you're selecting topics, then you're not selecting text.
If you click on the page after selecting text, it deselects the text anyway.
-
@ben_lubar said in Link text selection broken:
If you click on the page after selecting text, it deselects the text anyway.
Not if there's a checkbox on the part of the page you're clicking.
Double click a word here and then click a checkbox:
-
@PJH @ben_lubar I think the question we have to ask ourselves is this:
Which broken behaviour is the least annoying to live with?
-
Hmm... maybe instead of
$(this).focus()
, maybeev.preventDefault()
? That way, the browser won't extend the text selection, but neither will it clear it.Assuming my understanding of
ev.preventDefault()
is corrrect.
-
@loopback0 said in Link text selection broken:
Oh, if you shift-click the avatar it selects a range of topics. What a totally discoverable feature which is totally worth inconsistently breaking the browsers own behaviour for.
this this a million times this wtf?!
Don't DO that. Checkboxes don't WORK like that.
That's the UX advice I have to give.
-
@Yamikuronue said in Link text selection broken:
Don't DO that. Checkboxes don't WORK like that.
They do in Gmail
-
@PJH yeah, I went and yelled at @julianlam for that one
-
Anticipating them wanting to keep this nifty "feature": can you make it so that shift-click on a topic checkbox prevents the default select but shift-clicking anywhere else on the page doesn't?
-
@Yamikuronue said in Link text selection broken:
can you make it so that shift-click on a topic checkbox prevents the default select but shift-clicking anywhere else on the page doesn't?
I think that's what @RaceProUK suggested.
-
@loopback0 said in Link text selection broken:
@Yamikuronue said in Link text selection broken:
can you make it so that shift-click on a topic checkbox prevents the default select but shift-clicking anywhere else on the page doesn't?
I think that's what @RaceProUK suggested.
Why don't we stop theorizing and start practicing?
https://jsfiddle.net/L29kc7cx/
In short, no, it doesn't work :(
-
@Julianlam suggested:
is there a corresponding event for selection end? If so, it may be prudent to add in a check to ensure that e.target is a checkbox, and then (and only then, I suppose), should we return false;.
-
@ben_lubar Neither of my suggestions work, it seems.
-
@Yamikuronue said in Link text selection broken:
@Julianlam suggested:
is there a corresponding event for selection end? If so, it may be prudent to add in a check to ensure that e.target is a checkbox, and then (and only then, I suppose), should we return false;.
-
@RaceProUK I couldn't get it to with my limited knowledge :(
-
Oh! Oh oh I did it!
https://jsfiddle.net/5njLws0f/
$('span').on('selectstart', function(e) { e.preventDefault(); });
This seems to prevent you from changing selection if and only if the click that began the select event was on the span. Which means if you click on the span and drag, it doesn't select anything. Furthermore, if you shift-click on the span, it doesn't select anything either. If you click and drag on the text and shift-click more text, it works, but if you click and drag on the text and shift-click the span, it does nothing to your selection.
-
@Yamikuronue Cut it, print it, ship it! ;)
-
@Yamikuronue ...now that I look at it, that's exactly what they had
So it was just a scoping issue? It should only be scoped to the checkbox element, rather than the entire page?
-
-
@Yamikuronue said in Link text selection broken:
Oh! Oh oh I did it!
https://jsfiddle.net/5njLws0f/
$('span').on('selectstart', function(e) { e.preventDefault(); });
$('selector1').on('eventname', 'selector2', func);
You want to put the parent that always stays the same in selector1 and then put the child element that might be added or removed after the
on
call in selector2.
-
@ben_lubar I am 100% not a frontend dev, so I'll take your word for it :)
Push an update to Accalia's pr?
-
@Yamikuronue Yes please
Appreciate the team effort on this one
-
@julianlam I meant @ben_lubar ; I could, but I'm sure I'd introduce more bugs since I have no idea what I'm doing XD
https://jsfiddle.net/L29kc7cx/1/ looks a lot more like what you want than what I came up with