Merge branch 'tweak_viewer_reloading'

viewer/components/viewerloading.ts

@@ -89,12 +89,15 @@ export class ViewerLoading {
         // https://github.com/James-Yu/LaTeX-Workshop/issues/1871
         PDFViewerApplicationOptions.set('spreadModeOnLoad', pack.spreadMode)
 
+        storeScaleRounds()
         const maskArray = makeMasksForAllVisiblePages()
+        const viewerContainerSpacer = createViewerContainerSpacer()
         void PDFViewerApplication.open({ url: `${pdfFilePrefix}${this.lwApp.encodedPdfFilePath}` }).then(() => {
             // reset the document title to the original value to avoid duplication
             document.title = this.lwApp.documentTitle
         })
         const disposable = this.lwApp.lwEventBus.onPageRendered(() => {
+            viewerContainerSpacer.remove()
             if (isAllVisiblePagesRendered()) {
                 disposable.dispose()
                 // Remove the maskt with a transition effect.
@@ -175,6 +178,28 @@ function makeMasksForAllVisiblePages() {
     return maskArray
 }
 
+/**
+ * We must store the values to prevent glitches when refreshing the PDF viewer.
+ */
+function storeScaleRounds() {
+    const page = viewerDom.firstElementChild as HTMLElement
+    const scaleRoundX = page.style.getPropertyValue('--scale-round-x')
+    const scaleRoundY = page.style.getPropertyValue('--scale-round-y')
+    viewerContainer.style.setProperty('--stored-scale-round-x', scaleRoundX)
+    viewerContainer.style.setProperty('--stored-scale-round-y', scaleRoundY)
+}
+
+function createViewerContainerSpacer() {
+    const spacer = document.createElement('div')
+    spacer.id = 'viewerContainerSpacer'
+    spacer.style.top = viewerDom.offsetTop + 'px'
+    spacer.style.left = viewerDom.offsetLeft + 'px'
+    spacer.style.width = viewerDom.clientWidth + 'px'
+    spacer.style.height = viewerDom.clientHeight + 'px'
+    viewerContainer.appendChild(spacer)
+    return spacer
+}
+
 export function isAllVisiblePagesRendered(): boolean {
     const pageViews = PDFViewerApplication.pdfViewer._getVisiblePages()
     debugPrint('pageViews')

viewer/latextoybox.css

@@ -72,6 +72,12 @@ html[dir='rtl'] .findbar {
 /**
  * Remove the masks after the PDF document rendered with a transition animation.
  */
+
+#viewerContainerSpacer {
+    position: absolute;
+    z-index: -1;
+}
+
 .removeMask {
     opacity: 0;
     transition: opacity 0.3s ease-in-out;
@@ -106,6 +112,14 @@ html[dir='rtl'] .findbar {
     mask-image: var(--findbarButton-next-icon);
 }
 
+/**
+ * Tweak for reloading.
+ */
+.pdfViewer .page{
+    --scale-round-x: var(--stored-scale-round-x, 1px);
+    --scale-round-y: var(--stored-scale-round-y, 1px);
+}
+
 .pdfViewer.removePageBorders .page {
     border: none;
     box-shadow: 0px 0px 0px 1px lightgrey;