TL;DR;

If you want to select text on a webpage that won’t let you, add the following filter to uBlockOrigin, replacing decathlon.* with the URL that it needs to affect and replace dialog with element type you need to select text on.

decathlon.*##dialog:style(user-select:text !important;)

Background

My wife was looking for a bike on Decathlon, found one she liked and asked me what I though of it. I looked through its features and it said that there is only one pannier rack compatible: “500 ONESECONDCLIP PANNIER RACK (ref: 8364376)”. Fine, I thought I’ll just copy and paste that to search, but I couldn’t!

There was no way to select the text in Firefox on Android. Maybe it was some strange Firefox quirk so I tried Chrome which also didn’t work. Then tried Firefox on my laptop and again, no dice.

This had to be fixed. I initially thought it’d be Javascript so switched that off, but no it still didn’t work. Not sure what other avenues and rabbit holes I went down after that but eventually I found that it was because the CSS was setting a property called user-select.

Using the developer tools in Firefox, I was able to see that this was being set on an element called dialog. I use an ad blocker called uBlockOrigin. This has the very powerful feature of being able to modify CSS on pages. With that, I was able to create the following rule to always allow the text to be selected: decathlon.*##dialog:style(user-select:text !important;). This works, and I’ve added it to my annoyances filter.

This works, but it leaves the followng questions:

• Why is this even a CSS feature? Why does Firefox implement it? I don’t see any benefit as a user in not being able to select text. Maybe its useful for some applications like in a spreadsheet or a web based game but I haven’t found out why after some basic searching. I like to think that there must be a good reason.
• Why does Decathlon block the selection of text? This prevents a user searching for something based off the text. Maybe on a previous version this affected the dialog panel. Mayb it breaks the panel in some browsers. I don’t know why they would do this. It doesn’t stop bots from copying text as it all looks the same to a machine, it just annoys your users.