diff --git a/__tests__/src/components/OpenSeadragonViewer.test.js b/__tests__/src/components/OpenSeadragonViewer.test.js index 78114e3495c20f90369e08084a17184f0f0163f5..2e8c8347c2fbaf4af8d316d5e0c74eb066ee8b7e 100644 --- a/__tests__/src/components/OpenSeadragonViewer.test.js +++ b/__tests__/src/components/OpenSeadragonViewer.test.js @@ -115,7 +115,13 @@ describe('OpenSeadragonViewer', () => { const zoomTo = jest.fn(); wrapper.instance().viewer = { - viewport: { panTo, zoomTo }, + viewport: { + centerSpringX: { target: { value: 10 } }, + centerSpringY: { target: { value: 10 } }, + zoomSpring: { target: { value: 1 } }, + panTo, + zoomTo, + }, }; wrapper.setProps({ window: { id: 'base', viewer: { x: 0.5, y: 0.5, zoom: 0.1 } } }); diff --git a/src/components/OpenSeadragonViewer.js b/src/components/OpenSeadragonViewer.js index f3db606ef55ef3024f7c15c90d603c3d56c24d10..d0a12b8d09479fbace3aeb4c262586eebccbea5d 100644 --- a/src/components/OpenSeadragonViewer.js +++ b/src/components/OpenSeadragonViewer.js @@ -61,13 +61,15 @@ class OpenSeadragonViewer extends Component { this.fitBounds(0, 0, tileSources[0].width, tileSources[0].height); } }); - } else if (window.viewer && prevProps.window.viewer) { - if (window.viewer.x !== prevProps.window.viewer.x - || window.viewer.y !== prevProps.window.viewer.y) { + } else if (window.viewer) { + const { viewport } = this.viewer; + + if (window.viewer.x !== viewport.centerSpringX.target.value + || window.viewer.y !== viewport.centerSpringY.target.value) { this.viewer.viewport.panTo(window.viewer, false); } - if (window.viewer.zoom !== prevProps.window.viewer.zoom) { + if (window.viewer.zoom !== viewport.zoomSpring.target.value) { this.viewer.viewport.zoomTo(window.viewer.zoom, window.viewer, false); } }