How to see text selected in pdf files with pdf.js?

pdf_js_textLayer_selection

Sometimes, text that can be selected in pdf files (text overlay) does't match exactly the text as it is shown in the canvas layer. As a result, if one wants to select some text (for copy-pasting, for example) it is difficult to say if one has selected the right characters.
Here I show one way to see the text selected using pdf.js, the pdf reader that is used, for example, in Firefox.
1) Find the path to your profile directory: In Firefox, press Tab to see the menu bar, go to Help > Troubleshooting information. Click "Open Directory" next to "Profile directory".
2) Create a folder named "chrome" in your profile folder and a userContent.css file inside.
3) Write this in the userContent.css file that you created, and save it:

@-moz-document regexp('.*\.(p|P)(d|D)(f|F)') {

    .textLayer ::selection {
        color: white;
    }
}

4) Go back to Firefox, go to about:config, look for toolkit.legacyUserProfileCustomizations.stylesheets, and change it to true.
5) Restart your browser.

That's it! Now the text selected should show white in pdf.js. You can choose another color by changing the color line in the userContent.css file above.

Sources:
https://www.reddit.com/r/firefox/comments/77rh0l/how_do_i_customize_the_appearance_of_pdfjs_using/
https://superuser.com/questions/318912/how-can-i-override-the-css-of-a-site-in-firefox-with-usercontent-css
http://kb.mozillazine.org/UserContent.css
https://www.ghacks.net/2019/05/24/firefox-69-userchrome-css-and-usercontent-css-disabled-by-default/
https://userstyles.org/styles/147206/firefox-pdf-viewer-pdf-js-edge-style