AccessKit Disable GIFs: Pause ALL the GIFs!

[marcustyphoon]

Description

This applies AccessKit Disable GIFs to basically everything.

Consists of #1727 (see its description for technical details) plus an expanded list of element selectors and a few miscellaneous tweaks for functionality on newly enabled elements. One may simply consider this PR the canonical version of these changes; it's of course the meaningfully testable one.

Known elements that are not paused:

• Tumblrmart rainbow checkmark/lunar badge modal images (technical: can't position the label effectively; intentional: moon is invisible when paused)
• rainbow checkmark/lunar badge hover modals
• gifs in the post editor/post editor gif selector (intentional: you probably want to see what your post looks like)
• gifs in lightboxes (intentional)
• Tumblr TV modal images (intentional but somewhat technical: tumblr's layout relies onsizes="100vw", which doesn't affect content-replaced images)

Supersedes #1682, #1706, and #1708.

---

Yes, as you may have guessed, this is pretty close in functionality to simply writing:

pageModifications.register(`img:not(${keyToCss('poster')})`, processGifs);
pageModifications.register('[style*="background-image:"]', processBackgroundGifs);

Like https://github.com/marcustyphoon/XKit-Rewritten/blob/77a3d6734c33373e9c0fafb37c677fcf963febcf/src/features/mute.js#L84-L94, it would be far fewer lines of code to use a blacklist than a whitelist. That would result in the feature potentially being active on a missed or just-released piece of site UI, however. For both of these features, that's probably fine in most cases, but it has some possibility to lead to user confusion on a deeper level than the feature not working until we test and approve it.

(That is: you can mute your own e.g. reblogged posts, making it appear as though a new non-blacklisted timeline is missing elements; sufficiently complex css can make paused gifs not have visible labels or hover-to-play functionality, making it appear as though a new non-blacklisted animated element is not animated. The likelihood of this happening is so small, but the moment it happens and I have to read a post in which a user blames Staff for the "site being broken" due to this I will throw my laptop into the ocean. So, you know, swings and roundabouts.)

Testing steps

Find an unpaused GIF in the Tumblr interface. Do it, I dare you.

No, but actually:

• Confirm that each type of animated element listed in the source code is paused and receives a size-appropriate and visible label, and becomes unpaused and labelless when hovered.

[marcustyphoon]

https://www.tumblr.com/dashboard/tumblr_tv cards apparently change their background image each time you navigate within them; React changes only the background-image style property, so our paused images go out of sync with the on-hover images/sometimes we don't pause an image because it wasn't originally animated.

• fix this (or just don't process the Tumblr TV page)