Fix: Prevent focus loss in IE when navigating thumbnails

box · May 16, 2019 · 685b4b5 · 685b4b5
1 parent b1dacfd
commit 685b4b5
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 0 deletions.
diff --git a/src/lib/ThumbnailsSidebar.js b/src/lib/ThumbnailsSidebar.js
@@ -89,6 +89,10 @@ class ThumbnailsSidebar {
             }
         }
 
+        // IE 11 will focus a div when it's parent has a tabindex, so we focus the anchorEl to avoid
+        // a loss of focus when elements are deleted by the Virtual Scroller.
+        this.anchorEl.focus();
+
         event.preventDefault();
         event.stopImmediatePropagation();
     }

diff --git a/src/lib/__tests__/ThumbnailsSidebar-test.js b/src/lib/__tests__/ThumbnailsSidebar-test.js
@@ -319,6 +319,7 @@ describe('ThumbnailsSidebar', () => {
             stubs.onThumbnailSelect = sandbox.stub();
             stubs.preventDefault = sandbox.stub();
             stubs.stopImmediatePropagation = sandbox.stub();
+            stubs.focus = sandbox.stub();
 
             parentEl = document.createElement('div');
             parentEl.dataset.bpPageNum = '3';
@@ -335,12 +336,14 @@ describe('ThumbnailsSidebar', () => {
             };
 
             thumbnailsSidebar.onThumbnailSelect = stubs.onThumbnailSelect;
+            thumbnailsSidebar.anchorEl.focus = stubs.focus;
         });
 
         it('should call the onThumbnailSelect if target is a thumbnail element', () => {
             thumbnailsSidebar.thumbnailClickHandler(evt);
 
             expect(stubs.onThumbnailSelect).to.be.calledWith(3);
+            expect(stubs.focus).to.be.called;
             expect(stubs.preventDefault).to.be.called;
             expect(stubs.stopImmediatePropagation).to.be.called;
         });
@@ -350,6 +353,7 @@ describe('ThumbnailsSidebar', () => {
             thumbnailsSidebar.thumbnailClickHandler(evt);
 
             expect(stubs.onThumbnailSelect).not.to.be.called;
+            expect(stubs.focus).to.be.called;
             expect(stubs.preventDefault).to.be.called;
             expect(stubs.stopImmediatePropagation).to.be.called;
         });