Store doesn't seem to be updating

[jamesgorrie]

When visiting the example page, if we edit the content, then run SirTrevor.getInstance().store.retrieve(); in the console, the data array has not updated.

Running the latest Chrome.

I wonder if perhaps Chrome has updated something around mutation - but either way, it has rendered the editor unusable.

Happy to help if I can - I was trying, but it's quite hard to debug.

[raffij]

Does this work?

SirTrevor.getInstance().onFormSubmit();
SirTrevor.getInstance().store.retrieve();

[jamesgorrie]

Ah yes - so, am I write in assuming then that form.onSubmit the data is saved?
And ST prevents the forms default action?

And if we prevent the action, the event doesn't bubble, and the data is not saved?

[raffij]

You are correct.

At present the editor behaves like a textarea replacement so relies on the form submission to store the current state of the editor.

[jamesgorrie]

Is there an event then that we can hook onto to know when the data has been saved?

[raffij]

When you call onFormSubmit() the blocks will be parsed and the data saved to the store. The function returns the number of errors that were generated and puts the toString representation in the textarea.

https://github.com/madebymany/sir-trevor-js/blob/master/src/editor.js#L240-L256

The function above is the one that would normally be called when the form is submitted as can be seen here: https://github.com/madebymany/sir-trevor-js/blob/master/src/form-events.js#L19

[jamesgorrie]

Okay.
I suppose we just make sure that we attach our submit listener after ST's to ensure that has been fired (as we're guaranteed order).

[jamesgorrie]

Looking at that - this means that we have to add the event listener before initialising ST?
As if we preventDefault() the event doesn't reach ST.

[raffij]

You shouldn't need to as something like this would work.

const el = document.querySelector('.sir-trevor');
const form = el.parentNode;

const editor = new SirTrevor.Editor({ el: el });

form.addEventListener('submit', function (e) {
  e.preventDefault();
  console.log(editor.store.toString(true));
});