Cannot block animated images on websites (GIFs, but also Webp)

[I-I-IT]

Prerequisites

• I verified that this is not a filter list issue. Report any issues with filter lists or broken website functionality in the uAssets issue tracker.
• This is NOT a YouTube, Facebook or Twitch report. These sites MUST be reported by clicking their respective links.
• This is not a support issue or a question. For support, questions, or help, visit /r/uBlockOrigin.
• I performed a cursory search of the issue tracker to avoid opening a duplicate issue.
• The issue is not present after disabling uBO in the browser.
• I checked the documentation to understand that the issue I am reporting is not normal behavior.

I tried to reproduce the issue when...

• uBO is the only extension.
• uBO uses default lists and settings.
• using a new, unmodified browser profile.

Description

I mantain a list to block spam on news websites essentially. Recently, those (Nytimes and Axios among others) started adding animated images on their homepages.

Typycally, you could write a cosmetic rule like

example.com##a>img[src*=".gif"]:matches-path(/)

and a network rule like

||example.com/*.gif

This however, doesn't work on websites that do not add a file extension to their image

A specific URL where the issue occurs.

https://www.wsj.com/
https://web.archive.org/web/20260319175405/https://www.wsj.com/

Steps to Reproduce

1. Visit the link above or go to this archived version so you do see the animated image
2. Scroll a bit and you will see an animated image of a beer being served.
3. Open your browser network logger and see the request for .webp of this image, larger than other

Expected behavior

We should get a way to block images by file-type.
(Ideally, even being able to filter by image size. This would fix the issue were a website will use .webp for everything but some images are animated and others aren't)

Troubleshooting information

For future reference:
Image link

[gorhill]

Can block:

||web.archive.org^$image,header=content-type:image/gif

[I-I-IT]

Can block:

||web.archive.org^$image,header=content-type:image/gif

Thanks very much, I had missed that for some reason. Is this possible to do the same with content-filtering?

[gorhill]

What do you mean by "content-filtering"?

[I-I-IT]

What do you mean by "content-filtering"?

I meant cosmetic filtering sorry.

[gorhill]

Not possible, the content-type header of an image is not directly available from HTMLImageElement.