angular-ui / ui-tinymce

AngularUI wrapper for TinyMCE
MIT License
487 stars 370 forks source link

Form gets $dirty by default with debounce = false #315

Open iJungleboy opened 7 years ago

iJungleboy commented 7 years ago

This is a follow up of issue #238 which should have fixed incorrect $dirty reports.

Basically what happens is that a form just loaded will report the field as being dirty, even if it hasn't been touched yet - IF debounce is set to false. When debounce is set to true, the warnings works kind-of correctly, but only after a certain delay - meaning the user must pause before hitting save.

deeg commented 7 years ago

Please post a plunker reproducing the issue so people can look into fixing it.

A PR fixing the issue would be nice if you have found a reproducible bug.

iJungleboy commented 7 years ago

sorry for seeming daft, but I've never made a plunkr. Do you have a good sample using angular-ui-tinymce unto which I could then build upon?

christophbuehler commented 7 years ago

@deeg If debounce is set to 'false', no dirty-check is made before updating the view. Therefore, the editor is considered dirty by default if any of the events ('ExecCommand change NodeChange ObjectResized') are triggered. Take a look at 'debouncedUpdate', which performs a dirty-check. https://github.com/angular-ui/ui-tinymce/blob/master/src/tinymce.js#L95-L102

A tested patch:

// Update model when:
// - a button has been clicked [ExecCommand]
// - the editor content has been modified [change]
// - the node has changed [NodeChange]
// - an object has been resized (table, image) [ObjectResized]
ed.on('ExecCommand change NodeChange ObjectResized', function () {
    if (options.debounce) debouncedUpdate(ed);
    else if (ed.isDirty()) {
        ed.save();
        updateView(ed);
    }
});