From 3f8ee1660a1e3c65e56d1cb813942ed5079f31ce Mon Sep 17 00:00:00 2001
From: Jeremy Press <jpress@box.com>
Date: Thu, 25 Oct 2018 09:28:40 -0700
Subject: [PATCH] Fix: Prevent extra multi image page padding added by preview
 consumers (#854)

---
 src/lib/constants.js                                     | 1 +
 src/lib/viewers/image/MultiImageViewer.js                | 4 ++--
 src/lib/viewers/image/__tests__/MultiImageViewer-test.js | 3 ++-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/lib/constants.js b/src/lib/constants.js
index cad3d5710..adb9f98eb 100644
--- a/src/lib/constants.js
+++ b/src/lib/constants.js
@@ -36,6 +36,7 @@ export const CLASS_BOX_PREVIEW_THEME_DARK = 'bp-theme-dark';
 export const CLASS_ELEM_KEYBOARD_FOCUS = 'bp-has-keyboard-focus';
 export const CLASS_FULLSCREEN = 'bp-is-fullscreen';
 export const CLASS_FULLSCREEN_UNSUPPORTED = 'bp-fullscreen-unsupported';
+export const CLASS_MULTI_IMAGE_PAGE = 'bp-multi-image-page';
 export const CLASS_INVISIBLE = 'bp-is-invisible';
 export const CLASS_IS_TRANSPARENT = 'bp-is-transparent';
 export const CLASS_IS_VISIBLE = 'bp-is-visible';
diff --git a/src/lib/viewers/image/MultiImageViewer.js b/src/lib/viewers/image/MultiImageViewer.js
index f46a66c8d..7a539790b 100644
--- a/src/lib/viewers/image/MultiImageViewer.js
+++ b/src/lib/viewers/image/MultiImageViewer.js
@@ -2,7 +2,7 @@ import ImageBaseViewer from './ImageBaseViewer';
 import PageControls from '../../PageControls';
 import './MultiImage.scss';
 import { ICON_FULLSCREEN_IN, ICON_FULLSCREEN_OUT } from '../../icons/icons';
-import { CLASS_INVISIBLE } from '../../constants';
+import { CLASS_INVISIBLE, CLASS_MULTI_IMAGE_PAGE } from '../../constants';
 import { pageNumberFromScroll } from '../../util';
 
 const PADDING_BUFFER = 100;
@@ -143,7 +143,7 @@ class MultiImageViewer extends ImageBaseViewer {
 
         // Set page number. Page is index + 1.
         this.singleImageEls[index].setAttribute('data-page-number', index + 1);
-        this.singleImageEls[index].classList.add('page');
+        this.singleImageEls[index].classList.add(CLASS_MULTI_IMAGE_PAGE);
 
         this.singleImageEls[index].src = imageUrl;
     }
diff --git a/src/lib/viewers/image/__tests__/MultiImageViewer-test.js b/src/lib/viewers/image/__tests__/MultiImageViewer-test.js
index e7237719e..5cbe8d751 100644
--- a/src/lib/viewers/image/__tests__/MultiImageViewer-test.js
+++ b/src/lib/viewers/image/__tests__/MultiImageViewer-test.js
@@ -2,6 +2,7 @@
 import MultiImageViewer from '../MultiImageViewer';
 import PageControls from '../../../PageControls';
 import fullscreen from '../../../Fullscreen';
+import { CLASS_MULTI_IMAGE_PAGE } from '../../../constants';
 import BaseViewer from '../../BaseViewer';
 import ImageBaseViewer from '../ImageBaseViewer';
 import Browser from '../../../Browser';
@@ -226,7 +227,7 @@ describe('lib/viewers/image/MultiImageViewer', () => {
             multiImage.singleImageEls = [stubs.singleImageEl];
 
             multiImage.setupImageEls('file/100/content/{page}.png', 0);
-            expect(stubs.singleImageEl.classList.add).to.be.calledWith('page');
+            expect(stubs.singleImageEl.classList.add).to.be.calledWith(CLASS_MULTI_IMAGE_PAGE);
         });
     });