U4-4532 - Unable to insert Image in TinyMCE when Image property 'umbracoFile' is changed from type 'Upload' to the new 'Image Cropper'

Created by Jackie Nagel 26 Mar 2014, 15:16:55 Updated by Sebastiaan Janssen 31 Mar 2014, 09:41:51

The error returned is

TypeError: Object #<Object> has no method 'split'
    at Object.getMediaPropertyValue (http://starterkit.local/umbraco/js/umbraco.services.js:3087:41)
    at Object.getImagePropertyValue (http://starterkit.local/umbraco/js/umbraco.services.js:3126:25)
    at Object.getImagePropertyValue (http://starterkit.local/umbraco/js/umbraco.services.js:2424:32)
    at Object.dialogService.mediaPicker.callback (http://starterkit.local/umbraco/js/umbraco.services.js:5038:64)
    at Object.scope.submit (http://starterkit.local/umbraco/js/umbraco.services.js:1344:37)
    at http://starterkit.local/umbraco/lib/angular/1.1.5/angular.min.js:74:98
    at http://starterkit.local/umbraco/lib/angular/1.1.5/angular-mobile.js:270:9
    at Object.e.$eval (http://starterkit.local/umbraco/lib/angular/1.1.5/angular.min.js:92:272)
    at Object.e.$apply (http://starterkit.local/umbraco/lib/angular/1.1.5/angular.min.js:92:379)
    at HTMLButtonElement.<anonymous> (http://starterkit.local/umbraco/lib/angular/1.1.5/angular-mobile.js:269:13) 

The error is only existant when the propertytype is changed - if you change it back to Upload, then it works just fine.


Mads Krohn 26 Mar 2014, 15:33:36

It makes perfect sense that this doesn't work ootb, as the data returned from the property is different than what tinymce expects. However, I do foresee that this will be a very common scenario for people who want to use the Image Cropper with images in media. A fix for this should definitely make the 7.1 RTM imho.

Asbjørn Riis-Knudsen 26 Mar 2014, 16:24:44

Good catch! This definitely needs to be fixed for RTM - otherwise the imagecropper is useless.

Chriztian Steinmeier 26 Mar 2014, 16:44:40

I wouldn't say it's useless (to us, anyway) - we only enable images in RTE if the client can provide really good reasons to. But it should of course "just work" - it's unexpected and confusing that it doesn't, right now.

Asbjørn Riis-Knudsen 26 Mar 2014, 16:52:31

Here is a pull request to fix this issue: https://github.com/umbraco/Umbraco-CMS/pull/335

Per Ploug 27 Mar 2014, 09:46:54

We already have an API in place to make this work the same for upload and croppers, so it should have worked - the pull request submitted is not a viable fix since this is just hardcodes a check. - committed a fix for this

Mads Krohn 27 Mar 2014, 09:49:07

#h5yr ! :)

Asbjørn Riis-Knudsen 27 Mar 2014, 10:10:54

Thanks - and yes, that is much nicer (and simpler fix). Wasn't aware of that API...

Asbjørn Riis-Knudsen 27 Mar 2014, 21:50:01

I'm still unable to insert an ImageCropper image in the RTE, even with this change (I have verified that the changes are used in the browser).

Per Ploug 28 Mar 2014, 09:04:08

okey, need some details on what you do so I can replicate

Asbjørn Riis-Knudsen 28 Mar 2014, 09:12:38

Nothing special, I think. I replaced the Upload field with an ImageCropper on the Image media type, uploaded an image and tried to insert it in the RTE. I can click the image and get the detail screen to edit the alt text, but when I click Insert from that screen, nothing happens. I get the exact same JS error as metioned above in the console. I tried setting a breakpoint on the line you changed in the fix - it wasn't hit at all...

Per Ploug 28 Mar 2014, 09:38:30

Nevermind, found the issue :) committing now

Asbjørn Riis-Knudsen 28 Mar 2014, 15:34:12

Yes, that solved the problem. I can now insert the image with no issues. Thanks :)

Priority: Major

Type: Bug

State: Fixed

Assignee: Per Ploug

Difficulty: Normal


Backwards Compatible: True

Fix Submitted:

Affected versions: 7.1.0

Due in version: 7.1.0


Story Points: