The image upcast converter does not consume the src attribute

[Reinmar]

📝 Provide detailed reproduction steps (if any)

The src attribute appears in GHS's htmlAttributes:

The problem is here:

ckeditor5/packages/ckeditor5-image/src/image/utils.js

Lines 56 to 79 in 7b9572a

	export function getImgViewElementMatcher( editor, matchImageType ) {
	if ( editor.plugins.has( 'ImageInlineEditing' ) !== editor.plugins.has( 'ImageBlockEditing' ) ) {
	return { name: 'img' };
	}
	const imageUtils = editor.plugins.get( 'ImageUtils' );
	return element => {
	// Check if view element is an `img`.
	if ( !imageUtils.isInlineImageView( element ) ) {
	return null;
	}
	// The <img> can be standalone, wrapped in <figure>...</figure> (ImageBlock plugin) or
	// wrapped in <figure><a>...</a></figure> (LinkImage plugin).
	const imageType = element.findAncestor( imageUtils.isBlockImageView ) ? 'imageBlock' : 'imageInline';
	if ( imageType !== matchImageType ) {
	return null;
	}
	return { name: true };
	};
	}

The consume pattern returned by the callback does not include src.

The problem is though that we cannot easily just add the src to all patterns as we must still upcast images without src. So, the line

ckeditor5/packages/ckeditor5-image/src/image/utils.js

Line 58 in 7b9572a

return { name: 'img' };

needs to be moved to the inside of this callback because only the callback is able to use a different match and consume patterns (match only name,  consume all).

Additionally, there's also a related issue  #11327 that perhaps might be fixed together with this one.

---

If you'd like to see this fixed sooner, add a 👍 reaction to this post.

[Reinmar]

Additionally, there's also a related issue  #11327 that perhaps might be fixed together with this one.

Upon further analysis of both these scenarios, the low-level matcher and consumable calls should work more or less like this:

match = matcher.match( { name: 'img' } )

if ( !match )
    return;

if ( !consumable.test( { name: 'img' } ) )
    return;

consumable.consume( { name: true } );
createImage();

if ( !consumable.test( { attributes: [ 'src' ] } ) ) {
    setSrc();
    consumable.consume( { attributes: [ 'src' ] } )
}

However, IDK how to implement all these callbacks that we have right now (view patterns, model callbacks, two separate converters for block and image features) to ensure that in all cases the above will happen.