From b0724911b22f4d09223046336da04100573485e6 Mon Sep 17 00:00:00 2001
From: Mingze <mxiao@box.com>
Date: Wed, 5 Feb 2020 14:59:59 -0800
Subject: [PATCH] fix(archive): Reset vertical scroll when navigating folders
 (#1172)

* fix(archive): Reset vertical scroll when navigating folders

* fix(archive): Address comments

* fix(archive): Address comments
---
 src/lib/viewers/archive/ArchiveExplorer.js    |  1 +
 .../archive/ArchiveViewer.e2e.test.js         | 31 ++++++++++++++++++-
 test/support/constants.js                     |  1 +
 3 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/src/lib/viewers/archive/ArchiveExplorer.js b/src/lib/viewers/archive/ArchiveExplorer.js
index 5e0bb8a65..898cef60a 100644
--- a/src/lib/viewers/archive/ArchiveExplorer.js
+++ b/src/lib/viewers/archive/ArchiveExplorer.js
@@ -224,6 +224,7 @@ class ArchiveExplorer extends React.Component {
                                     height={height}
                                     rowData={itemList}
                                     rowGetter={this.getRowData(itemList)}
+                                    scrollToIndex={0}
                                     sort={this.handleSort}
                                     sortBy={sortBy}
                                     sortDirection={sortDirection}
diff --git a/test/integration/archive/ArchiveViewer.e2e.test.js b/test/integration/archive/ArchiveViewer.e2e.test.js
index 6e4a84069..4003b0ece 100644
--- a/test/integration/archive/ArchiveViewer.e2e.test.js
+++ b/test/integration/archive/ArchiveViewer.e2e.test.js
@@ -2,13 +2,14 @@
 describe('Archive Viewer', () => {
     const token = Cypress.env('ACCESS_TOKEN');
     const fileId = Cypress.env('FILE_ID_ARCHIVE');
+    const fileIdLarge = Cypress.env('FILE_ID_ARCHIVE_LARGE');
 
     beforeEach(() => {
         cy.visit('/');
-        cy.showPreview(token, fileId);
     });
 
     it('Should render correct item list', () => {
+        cy.showPreview(token, fileId);
         // clicking folder
         cy.getByTitle('Preview SDK Sample Archive').within(() => {
             cy.get('button').click();
@@ -23,6 +24,7 @@ describe('Archive Viewer', () => {
     });
 
     it('Should sort items when column header is clicked', () => {
+        cy.showPreview(token, fileId);
         cy.getByTitle('Preview SDK Sample Archive').within(() => {
             cy.get('button').click();
         });
@@ -39,6 +41,7 @@ describe('Archive Viewer', () => {
     });
 
     it('Should show matched item list based on search query', () => {
+        cy.showPreview(token, fileId);
         cy.getByTitle('Preview SDK Sample Archive').within(() => {
             cy.get('button').click();
         });
@@ -53,4 +56,30 @@ describe('Archive Viewer', () => {
         cy.getByTestId('search-input').type('vido');
         cy.contains('Video (Normal).mp4');
     });
+
+    it('Should reset scroll when navigating folders', () => {
+        cy.showPreview(token, fileIdLarge);
+
+        cy.getByTitle('Collection').within(() => {
+            cy.get('button').click();
+        });
+
+        cy.get('.ReactVirtualized__Table__Grid').then($tables => {
+            const table = $tables[0];
+            table.scrollTo(0, 50);
+
+            const tableTop = table.getBoundingClientRect().top;
+            cy.get('.ReactVirtualized__Table__row').then($rows => {
+                expect($rows[0].getBoundingClientRect().top).not.to.equal(tableTop);
+            });
+
+            cy.getByTitle('Collection Child').within(() => {
+                cy.get('button').click();
+            });
+
+            cy.get('.ReactVirtualized__Table__row').then($rows => {
+                expect($rows[0].getBoundingClientRect().top).to.equal(tableTop);
+            });
+        });
+    });
 });
diff --git a/test/support/constants.js b/test/support/constants.js
index 9e1d41436..f9ab30e88 100644
--- a/test/support/constants.js
+++ b/test/support/constants.js
@@ -2,6 +2,7 @@ Cypress.env({
     // NOTE: The token used is a readonly token accessing public data in a demo enterprise.
     ACCESS_TOKEN: 'S8wjvjOL9GEK5VtXsQNVMOwSrx1g55oC',
     FILE_ID_ARCHIVE: '589625563707',
+    FILE_ID_ARCHIVE_LARGE: '611800378713',
     FILE_ID_BAD: '433514141824',
     FILE_ID_DOC_LARGE: '420985736453',
     FILE_ID_DOC: '415542803939',