Skip to content

In-editor visual revisions (WP 7.0) #74742

@ellatrix

Description

@ellatrix

This is the first item from #61161, spinning it off here because the main revisions tracking issues is too broad in scope. This issue is specifically targeted at WP 7.0.

Let's make it delightful and really pay attention to the little things.

  • It should be possible to slide through revisions (similar to the old screen), but without leaving the editor. Instead of a code diff, we show a visual diff. The content stays in the same place, the UI around the editor changes in a subtle way. The slider can be placed in the header since most of that space is not useful otherwise for revisions. The update/publish button is replaced with a restore button. The document inspector can show a summary of the changes (it is nice that the sidebar persists so there's no big layout changes in the content). Done in In-editor revisions (initial changes, without diffing) #74771.
  • There should be an option to compare the currently selected revision with the previous one. Done in In-editor revisions: add visual diffing #75049.
    • The block tree must be merged and there needs to be information stored on whether a block was added, removed, modified, or unchanged.
    • Within modified blocks, rich text attributes must be diffed for textual content, we can insert ins/del rich text formatting to visualize the difference.
    • When rich text formatting changed, but no text was changed (e.g. adding a link, bold), we underline the content.
    • For other block attributes changes, there will still be a yellow outline to indicate that the block was modified. Perhaps we can show more information in the sidebar when you select the block, or display a tooltip.
    • The diffing visualization must work in such a way that the colors work for any theme color.
  • Next to the scroll bar, we should show color indicators and sizes of changes at each location. You can click on them to scroll to this location. Done in In-editor revisions: add visual diffing #75049.
  • We need to think about how to display meta that plugin add to revisions. Also test footnotes.
  • Maintain scroll position: when you're scrolled down, it could be nice to try to make sure the visible block stays in view as you slide.
  • Improve performance (don't request all revisions, faster diffing).
  • Add a paginated timeline in the inspector with more detailed information.
  • Remove preview and global styles buttons.

Non essential:

  • Show autosaves using this diff before restoring.
  • Try a graph of additions + deletions as a slider background.
  • The visual/code editor option could remain present and we could still offer seeing the revisions in the code editor. (We currently link to the old revisions screen for a code view.)
  • When you select a block, perhaps we can show the points in the slider where that specific block has changed.
  • For non-textual blocks, it may be interesting to show a before/after slider, but I don't consider this urgent.
Untitled.mov

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Feature] HistoryHistory, undo, redo, revisions, autosave.[Type] IterationScoped iteration of an effort from a tracking issue or overview issue ideally for a major release.

    Type

    No type
    No fields configured for issues without a type.

    Projects

    Status

    📋 Iteration/Tracking Issues

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions