In WebViewer version 8.9+ you can have two documents loaded side-by-side in the UI.

To toggle this feature on/off you can use the feature toggle:

WebViewer({
  path: '/lib',
  fullAPI: true,
}, viewerElement).then(instance => {
  const { UI } = instance;
  UI.enableFeatures([UI.Feature.MultiViewerMode]);
  UI.disableFeatures([UI.Feature.MultiViewerMode]);
});

By default, if fullAPI is enabled in the WebViewer constructor, MultiViewerMode will come with the 'Start Comparison' button, which when clicked, will highlight all the text differences on the document using annotations.
It will also enable a panel that will list the differences allowing you to search through them. You can also click the items in the panel to be scrolled to the highlighted change on both sides.

To disable the comparison functionality, you can pass disableMultiViewerComparison to the WebViewer constructor.

WebViewer({
  disableMultiViewerComparison: true,
  path: '/lib',
}, viewerElement);

In MultiViewerMode you can access the APIs on the second DocumentViewer through the getDocumentViewers() API.
To ensure the second DocumentViewer has been intialized before you call it, you can wrap your code in the MULTI_VIEWER_READY event

WebViewer({...}, viewerElement).then(function(instance) {
  const { UI, Core } = instance;
  UI.addEventListener(UI.Events.MULTI_VIEWER_READY, () => {
    Core.getDocumentViewers()[0].loadDocument('pdf_vers1.pdf'); // Load 'pdf_vers1.pdf' on first DocumentViewer
    Core.getDocumentViewers()[1].loadDocument('pdf_vers2.pdf'); // Load 'pdf_vers2.pdf' on second DocumentViewer
  })
  UI.enableFeatures([UI.Feature.MultiViewerMode]);
});

There are also some additional APIs to control the scroll and zoom syncing.

• enableMultiViewerSync()
• disableMultiViewerSync()
• isMultiViewerSyncing()

By default, the save document button is disabled. You can enable this button to allow users to download the document from either side.

WebViewer({...}, viewerElement).then(function(instance) {
  const { UI } = instance;
  UI.enableElements(["multiViewerSaveDocumentButton"]);
});