Cannot add image to Grid in 8.12

[christophborndigital]

After upgrading a site from 8.11.1 to 8.12, I can no longer add an image to a Grid editor using the standard "Image" grid control.

Umbraco version

• 8.12.0
• 8.12.1

Reproduction

Specifics

After selecting an image, another infinity editor opens "Edit selected media".
Clicking Submit causes a JS error in umbraco.controllers.js function updateControlValue(selectedImage) on line 18732 in 8.12.1:

Error: "$scope.control.value is null"

Steps to reproduce

• Edit a content item with a Grid editor
• Add an Image control
• Click "Click to insert image"
• Select an image
• Another infinity editor pops up "Edit selected media"
• Click "Select"
• Nothing happens (apart from a console JS error)

Expected result

Image added to the grid

Actual result

Image isn't selected, I can only "Close" the dialog

[Jay-umbr]

Can reproduce, seems to be an issue not only on upgraded projects but also on new ones.

[ChristophClaus]

Can reproduce! Existential error on a new project.

Problems got to do with the focalPoint:
Chrome DevTools: TypeError: Cannot read property 'focalPoint' of null

[nul800sebastiaan]

I've just noticed this as well 😱 We'll look into it!

[nul800sebastiaan]

As a workaround for now, you can update the updateControlValue method in Umbraco\js\umbraco.controllers.js to:

        function updateControlValue(selectedImage) {
            // const doGetThumbnail = $scope.control.value.focalPoint !== selectedImage.focalPoint
            //     || $scope.control.value.image !== selectedImage.image;

            // we could apply selectedImage directly to $scope.control.value,
            // but this allows excluding fields in future if needed
            $scope.control.value = {
                focalPoint: selectedImage.focalPoint,
                coordinates: selectedImage.coordinates,
                id: selectedImage.id,
                udi: selectedImage.udi,
                image: selectedImage.image,
                caption: selectedImage.caption,
                altText: selectedImage.altText
            };


            // if (doGetThumbnail) {
                $scope.thumbnailUrl = getThumbnailUrl();
            //}
        }

This method was added in @nathanwoulfe 's PR https://github.com/umbraco/Umbraco-CMS/pull/9681/files#diff-16bf5e50f31cc4c3ef3f2af6bf0a399b98e5e2e926e793184cffdc9d0f0ecbcdR105

I don't know how this was supposed to work, since $scope.control.value is null to begin with, so it should have errored out.

[nathanwoulfe]

@nul800sebastiaan PR to fix is in #9987 - shouldn't have been attempting to access control values until they'd been set.

[nul800sebastiaan]

That was fast @nathanwoulfe! Thanks! Will have a look tomorrow!

[nul800sebastiaan]

Fixed in #9987 for the upcoming 8.12.2.

[christophborndigital]

Thanks for the prompt fix, looking forward to 8.12.2