id	summary	reporter	owner	description	type	status	priority	milestone	component	version	resolution	keywords	cc
12854	Changing widget elements inner tag's attributes does not seem to work	Matti Järvinen		"Image src is changed after switching image from widget's own dialog. Data function is called with proper attributes (with changed image src) and new image is shown in the editor WYSIWYG. There is no downcast function since HTML structure doesn't change.

When I switch to source mode changes to contactImage src attribute are lost. It is as if changing widget element's inner tag attributes with setAttribute in widget data does not register as a change.

{{{
    editables: {												
        contentName: {
            selector: '.name'
        },
        contentJobTitle: {
            selector: '.jobTitle'
        }
    },
    ...
    template:
    '<div class=""NID_contact"" vocab=""http://schema.org/"" typeof=""Person"">'+
        '<div class=""contact card row"">'+
            '<div class=""contact-photo col-xs-12 col-sm-3"">'+
                '<img class=""contactImage roundcorners"" property=""image"" alt="""" src=""/img/default.png"" />'+									
            '</div>'+
            '<div class=""contact-details col-xs-12 col-sm-9"">'+									
                '<div class=""contactHeader"">'+																			
                    '<h2 class=""name"" property=""name"">'+
                        'Firstname Surname'+
                    '</h2>'+
                    '<p class=""jobTitle"" property=""jobTitle"">'+
                        'Job Title'+
                    '</p>'+							
                '</div>'+
            '</div>'+
        '</div>'+
    '</div>',
    ...
    data: function() {
    
        // regex for trim
        // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim
        var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
        
        
        var img = this.element.findOne('.contactImage');
        
        if(img != null)
        {
            img.setAttribute('src',this.data[""img""].replace(rtrim,''));
        }        
    }                                     
}}}


To get my widget working I had to define terrible downcast function:

{{{

    downcast: function(element)
    {
        // regex for trim      
        var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
        
        element.children[0].children[0].children[0].attributes.src = this.data[""img""].replace(rtrim,'');
        

        return element;
    
    },


}}}

Is there an easier way to select element's children preferably by class with CKEditor in downcast like ckeditor.dom.element.findOne for ckeditor.htmlparser.element ?"	Bug	closed	Normal		UI : Widgets		invalid