VisualEditor/Diffs

Inside the visual editor, you can now see visual diffs (differences) of changes to the document before you save, alongside the traditional two-column wikitext diff.

This has two purposes. Firstly, editors can see the changes they and others have made without needing to know the intricacies of wikitext. This is particularly helpful for clearly seeing e.g. that a user has deleted a column in a table, as the wikitext diff is quite baffling. Secondly, we can use the technology to more richly and usefully represent the change to the reader, rather than just a basic string matching. For example, we can identify when an edit swaps two paragraphs and represent it as such, rather than edits to delete one paragraph and add another (which may or may not be identical).

This is currently available as a secondary tool for users of the desktop editor from the 1.29.0-wmf-17 branch onwards (released to Wikimedia production from 21 March 2017).

Features

 * Detects paragraph moves + changes
 * Structural table changes shown more clearly

Technology

 * Google Diff, Match and Patch
 * TreeDiffer.js

Current limitations

 * Some edits aren't shown very clearly, as we haven't added custom explanations for all kinds of content. In particular, references, custom extension tags, and templates need better, more sensible explanations.
 * Some behaviour switches that add UI elements such as TOC or edit links aren't shown.
 * No notices for changes to "invisible" page metadata.
 * Not yet available on mobile.
 * Has issues with complex changes to lists and tables.
 * Not available on undo "diff" pages.T78550
 * Not available on historical diff pages. T167508
 * Experimentally enabled via feature flag, or appending  to the query string: example


 * ✅ Diffs are shown for the edits from the moment you started the editor – so if you switch mode to wikitext and back, you will only see changes since you moved back, not since you started editing overall.

Future plans

 * VisualDiffs: Show complex annotation creations and removals in the sidebar (link, language, span)

Phabricator links

 * T143350