width and height attributes are empty when inserting an image

Updated: Comment #0
The width and height attributes on images should either not be set at all (when their values are empty), or have non-empty values.

Problem/Motivation

Right now, these attributes are always being set, even when they're empty.

This is a problem only when using the CKEditor image caption widget introduced at #2027181: Use a CKEditor Widget to create a stellar UX for captioning and aligning images.

Proposed resolution

CKE widgets have the unique ability to "downcast" themselves when CKEditor is being detached. The image will already have loaded.

All browsers except IE8 and below have the naturalHeight and naturalWidth properties for retrieving the actual image width and height. So we can use that to our advantage, to set the correct width and height right away.

(When using the "regular" image plugin for CKEditor, which is not a widget, we can only set the width and height when the user edits an image, since it does not have this "downcast" functionality. We were already setting width and heigh there, but not the natural width & height. So when you'd have set a margin or padding on images through CSS, that'd be added to the image's actual width; using natural width/height fixes that.)

Remaining tasks

None.

User interface changes

None.

API changes

None.

Related Issues

#2027181: Use a CKEditor Widget to create a stellar UX for captioning and aligning images