Fix: Prevent extra multi image page padding added by preview consumers (

#854)
box · Oct 25, 2018 · 3f8ee16 · 3f8ee16
1 parent 4d61afa
commit 3f8ee16
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git 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
@@ -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
@@ -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);
         });
     });