Alter HTML doesn't work with <picture> tag

[aleksandrpnshkn]

I have responsive images in my theme:

<picture>
    <source media="(min-width: 992px)" srcset="<?= wp_get_attachment_image_url( $image_lg ) ?>">
    <?= wp_get_attachment_image( $image_sm ) ?>
</picture>

but instead of replacing urls it wraps <img> in another <picture>:

picture
    source
    picture
        source[type="image/webp"]
        img

That is, I have to exclude these images. By the way, examples have a <picture> in input markup, but why doesn't it contain required <img>?

And not quite on the topic. Two little issues with alter HTML mode:

1. It cuts off port from src url (http://localhost:8000/wp-content/... -> http://localhost/wp-content/...), so it doesn't work in my development environment.
2. Doesn't work for relative urls (<img src="/wp-content/...">), just skipping.

Should I create separate issues?

Tested in clean twentytwenty theme. WebP Express v.0.17.4

[woutersteg]

I have the same issue. Is there a solution for this? I've been looking everywhere.

[rosell-dk]

This was fixed in dom-util-for-webp v.0.4.1 back in june 2021: https://github.com/rosell-dk/dom-util-for-webp/issues/24

[rosell-dk]

The problem is still there, when there are newlines inside the picture tag

[rosell-dk]

See: https://github.com/rosell-dk/dom-util-for-webp/issues/34 https://wordpress.org/support/topic/existing-picture-tag-markup-gets-broken/#post-15608933