Skip to content

Commit

Permalink
Merge pull request #866 from finos/fix-pivot-grid
Browse files Browse the repository at this point in the history
Fix scrolling for pivoted hypergrid
  • Loading branch information
texodus authored Jan 13, 2020
2 parents 12083d2 + d804680 commit 55cc274
Show file tree
Hide file tree
Showing 4 changed files with 130 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -92,10 +92,10 @@ export default require("datasaur-local").extend("PerspectiveDataModel", {
return;
}
if (nrows !== this._nrows) {
this._grid.renderer.computeCellsBounds();
this._nrows = nrows;
this._grid.synchronizeScrollingBoundaries();
}
this._dirty = true;
this._nrows = nrows;
},

// Called when clicking on a row group expand
Expand Down
104 changes: 104 additions & 0 deletions packages/perspective-viewer-hypergrid/test/js/superstore.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@

const utils = require("@finos/perspective-test");
const path = require("path");
const {scroll} = require("./utils");

const simple_tests = require("@finos/perspective-viewer/test/js/simple_tests.js");

Expand Down Expand Up @@ -46,6 +47,109 @@ utils.with_server({}, () => {
await page.waitForSelector("perspective-viewer:not([updating])");
});

test.capture("should not scroll vertically when collapsed smaller than viewport", async page => {
const viewer = await page.$("perspective-viewer");
await page.evaluate(element => element.setAttribute("row-pivots", '["Category","State", "City"]'), viewer);
await page.waitForSelector("perspective-viewer:not([updating])");

await page.evaluate(async element => {
element.view.set_depth(0);
await element.notifyResize();
}, viewer);

await scroll(page, 0, 1000);

await page.waitForSelector("perspective-viewer:not([updating])");
});

test.capture("should not scroll horizontally when collapsed smaller than viewport", async page => {
const viewer = await page.$("perspective-viewer");

await page.evaluate(element => element.setAttribute("row-pivots", '["Category", "State", "City"]'), viewer);
await page.waitForSelector("perspective-viewer:not([updating])");

await page.evaluate(element => element.setAttribute("columns", '["Row ID", "Order ID"]'), viewer);
await page.waitForSelector("perspective-viewer:not([updating])");

await page.evaluate(async element => {
element.view.set_depth(0);
await element.notifyResize();
}, viewer);

await scroll(page, 1000, 0);

await page.waitForSelector("perspective-viewer:not([updating])");
});

test.capture("should scroll vertically when expanded from inside viewport to taller than viewport", async page => {
const viewer = await page.$("perspective-viewer");
await page.evaluate(element => element.setAttribute("row-pivots", '["Category","State", "City"]'), viewer);
await page.waitForSelector("perspective-viewer:not([updating])");

await page.evaluate(async element => {
element.view.set_depth(0);
await element.notifyResize();
}, viewer);

await scroll(page, 0, 30); // Hide the scrollbar from the page, as hypergrid sees no off-viewport rows

await page.evaluate(async element => {
element.view.set_depth(3);
await element.notifyResize();
}, viewer);

// Should be able to scroll down
await scroll(page, 0, 1000);

await page.waitForSelector("perspective-viewer:not([updating])");
});

test.capture("should scroll horizontally when expanded from inside viewport to taller than viewport", async page => {
const viewer = await page.$("perspective-viewer");
await page.evaluate(element => element.setAttribute("row-pivots", '["Category","State", "City"]'), viewer);
await page.waitForSelector("perspective-viewer:not([updating])");

await page.evaluate(async element => {
element.view.set_depth(0);
await element.notifyResize();
}, viewer);

await scroll(page, 0, 30); // Hide the scrollbar from the page, as hypergrid sees no off-viewport rows

await page.evaluate(async element => {
element.view.set_depth(3);
await element.notifyResize();
}, viewer);

// Should be able to scroll right
await scroll(page, 500, 0);

await page.waitForSelector("perspective-viewer:not([updating])");
});

test.capture("should scroll horizontally and vertically when expanded from inside viewport to taller than viewport", async page => {
const viewer = await page.$("perspective-viewer");
await page.evaluate(element => element.setAttribute("row-pivots", '["Category","State", "City"]'), viewer);
await page.waitForSelector("perspective-viewer:not([updating])");

await page.evaluate(async element => {
element.view.set_depth(0);
await element.notifyResize();
}, viewer);

await scroll(page, 0, 30); // Hide the scrollbar from the page, as hypergrid sees no off-viewport rows

await page.evaluate(async element => {
element.view.set_depth(3);
await element.notifyResize();
}, viewer);

// Should be able to scroll right
await scroll(page, 500, 1000);

await page.waitForSelector("perspective-viewer:not([updating])");
});

test.capture("handles flush", async page => {
const viewer = await page.$("perspective-viewer");
await page.shadow_click("perspective-viewer", "#config_button");
Expand Down
19 changes: 19 additions & 0 deletions packages/perspective-viewer-hypergrid/test/js/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,25 @@
*
*/

exports.scroll = async (page, x = 0, y = 100) => {
await page.evaluate(
({x, y}) => {
const grid = document
.querySelector("perspective-viewer")
.shadowRoot.querySelector("perspective-hypergrid")
.shadowRoot.querySelector("canvas");
const wheel_event = new WheelEvent("wheel", {
bubbles: true,
cancelable: true,
deltaX: x,
deltaY: y
});
grid.dispatchEvent(wheel_event);
},
{x, y}
);
};

exports.dblclick = async (page, x = 310, y = 300) => {
await page.evaluate(
({x, y}) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,11 @@
"superstore.html/resets viewable area when the logical size expands.": "1bc04ce4ebdbbb8c59d8a04cea43c901",
"superstore.html/resets viewable area when the physical size expands.": "13d3164f406bf6a7d053c21dd506a0d5",
"superstore.html/replaces all rows.": "9cd0751b14f8ba6c857bf9b92f1d366b",
"superstore.html/should not scroll vertically when collapsed smaller than viewport": "85561e31002028b42b342306a644d8ae",
"superstore.html/should not scroll horizontally when collapsed smaller than viewport": "6a78d9493d600f7fe902060b26b0d734",
"superstore.html/should scroll vertically when expanded from inside viewport to taller than viewport": "386fc92a9ef4001e516250c8ba20400e",
"superstore.html/should scroll horizontally when expanded from inside viewport to taller than viewport": "988784a8b71df95ec8e34b9a029a0090",
"superstore.html/should scroll horizontally and vertically when expanded from inside viewport to taller than viewport": "1b88cc0c670a8e1a54cba9245f90938c",
"hypergrid.html/perspective dispatches perspective-click event with correct properties.": "13d3164f406bf6a7d053c21dd506a0d5",
"hypergrid.html/perspective dispatches perspective-click event with one filter.": "b66684328af5084134b0d3ed8d095eaf",
"hypergrid.html/perspective dispatches perspective-click event with filters.": "44186397ec3d65a3390a0dbd80f08c76",
Expand Down

0 comments on commit 55cc274

Please sign in to comment.