Fix recently introduce bug affecting elements

[rhystmills]

Background

Developers and users have noticed some unusual behaviour in elements (in Composer) recently:

• Attempting to switch the position of two elements of the same type did not appear to update their text fields, so the elements didn't appear to switch.
• Certain changes to text fields in image elements appeared garbled/disordered in preview after save and close
• Saving and closing then reopening list formats with an image element in them caused placeholders not to appear, and certain changes weren't being saved

Through testing we identified that version 9.6.1 (the most recent release of prosemirror-elements) introduced the change. The biggest and most relevant change in this release was https://github.com/guardian/prosemirror-elements/pulls?q=is%3Apr+sort%3Aupdated-desc+is%3Aclosed

That change was reverted in Composer and the issues seem to be resolved there now: https://github.com/guardian/flexible-content/pull/4803

What does this PR change

This PR is intended to solve the bugs reported above.

The bug was caused by a subtle change in our logic during the refactor in the selection PR.

Previously, we would check for a 'diff' between the previous state of the node represented by a text view, and its updated state, as follows:

if (diffStart === null) {
      return this.maybeRerenderDecorations();
    }

I had changed this check to:

    if (diffStart && diffEnd) {

However, a diff could often start at position 0 relative to the innerEditorView represented by the text field, e.g. if the entire text field had changed, as part of wider changes to an entire element, or with a change only affecting the initial character.

Changing this check to if (diffStart !== null && diffEnd) seems to have resolved the issues mentioned above when testing locally.

Tests

I've updated the existing tests to add some more clarity about when a node is passed in versus when a new selection is passed in.

I've also added some new tests that look at the internal state of the inner editor, to cover the case that occurred in a bug. Without this PR's fix, the following test fails.

should update its internal doc when a node with different content is passed in, with different content starting at the first position of the inner editor

Let me know if what's happening in these tests is unclear, I'm happy to pair.

How to test

1. Run prosemirror-elements locally and run the tests.
2. Release prosemirror-elements locally via yarn yalc and use in flexible-content locally with yalc add @guardian/prosemirror-elements then npm i in the composer directory.
3. Do the aformentioned bugs occur? (They shouldn't)
4. Creating a note by creating a text selection with your mouse, then hitting F10 - does the selection move to the end of the note so that subsequent characters are added after the note? (It should)

[davidfurey]

Good spot! Might be nice to also check diffEnd is not null? Who knows, maybe at some point negative positions will be valid, and diffEnd could be zero but still greater than diffStart.

[rhystmills]

Done, !== null does seem like what we really want to check for there.

[Georges-GNM]

Tested locally and all the desired behaviour seemed to be working 🥳