class="noSelect" impairs copying

[raulvasquez]

I have a site I frequent that is using class="noSelect" so I cannot copy text out of their articles. Should this undo that? Or am I better off trying to disable that with something like ublock origin?

[jswanner]

@raulvasquez, is this site publicly accessible for me to investigate? If so, what's the URL?

An HTML tag having class="noSelect" has no effect on its own. HTML elements with that class can be selected in CSS in order to have style modifications applied to it, they can also be selected in JavaScript in order to be manipulated that way.

It's the site's JavaScript that would need to be inspected to see what it's doing with HTML elements that have that noSelect class. If the JavaScript is doing something like:

element.addEventListener("copy", function(e) {
  e.preventDefault();
  return false;
});

Then yes, this extension will circumvent that kind of copy blocking.

[raulvasquez]

@jswanner the site is private.

To clarify, I am able to copy the text if I delete that class. It does not appear the website is doing anything to prohibit actually being able to copy text other than removing the ability to select what you want with my mouse or CTRL-A.

There is not much too it:

<div id="article" class="noSelect">

[jswanner]

Oh, I see. They are using CSS's user-select property to prevent you from selecting the text. That's why removing the class allows you to select the text.

This extension doesn't modify any CSS properties, and so wouldn't address that kind of browsing experience interference.

If you care to confirm the user-select theory. Assuming you are removing the class from the "Elements" pane of Chrome's Developer Tools, if you highlight the <div id="article"> element then look over in the "Styles" pane, you should be able to see what they are doing with that .noSelect class. It should look something like:

[jswanner]

ublock origin isn't really going to be able to help you here.

Chrome used to support user stylesheets that you could have used for this purpose. Instead, you might want to try something like: https://chrome.google.com/webstore/detail/user-css/okpjlejfhacmgjkmknjhadmkdbcldfcb?hl=en