Autobinding: how to detect when source changed?

How do you handle autobinding in a text editor? How can I detect when the source has changed?


I released a rich text editor plugin (yes, yet another one in the marketplace. But mine is unique, I swear!).

Autobinding works when the source of the content doesn’t change. For example, if you have a page of type article and you feed that article’s body to the editor it will load the content properly.

On the other hand, if I place it on a popup and I change the data source constantly, editor misbehaves. Data won’t load or it will load multiple times or it will overwrite data. A mess.

I was so desperate that I even tried silly things like this:

// the editor is initialized

let content = properties.autobinding;
instance.data.editor.setContent(content);

But you can imagine the result:

1 Like

My understanding is that Bubble will tell you if the element is using autobinding, what is the autobind value and what is the name of the binded field, but it’s omitting any info about the thing on which the element is bound :smiley: .
You need some help from the user: add a field of type “anything with field” and ask the user to set it to the “parent element’s thing”. If the user is kind and you get the thing, you can store the id (thing.get('_id')) and compare it every time to know if the autobinding source changed.
If you miss this piece of data you can gracefully degrade to a default behaviour of your choice (for example: if autobind value is different from input value update the autobind).