From d3d19a60e2bddb1b5a7e4dd3f5f219698b4e71f2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9mi=20Rahir=20=28rar=29?= Date: Fri, 14 Apr 2023 06:15:03 +0000 Subject: [PATCH] [FIX] tests: fix indeterministic ui sheet MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The new test on z-indexes introduced in 8c89731d is testing a feature that only activated every 200 ms (see function `useCellHovered` in `grid_overlay.ts`). We have to use fake timers to ensure the right amount of time has passed. closes odoo/o-spreadsheet#2350 Signed-off-by: Lucas Lefèvre (lul) --- tests/components/spreadsheet.test.ts | 135 ++++++++++++++------------- 1 file changed, 71 insertions(+), 64 deletions(-) diff --git a/tests/components/spreadsheet.test.ts b/tests/components/spreadsheet.test.ts index daff3d4de5..17a6c86408 100644 --- a/tests/components/spreadsheet.test.ts +++ b/tests/components/spreadsheet.test.ts @@ -16,6 +16,7 @@ import { import { clickCell, getElComputedStyle, + hoverCell, rightClickCell, simulateClick, triggerMouseEvent, @@ -210,6 +211,76 @@ describe("Spreadsheet", () => { await nextTick(); expect(notifyUser).toHaveBeenCalledTimes(2); }); + + test("Z-indexes of the various spreadsheet components", async () => { + jest.useFakeTimers(); + ({ model } = await mountSpreadsheet()); + const getZIndex = (selector: string) => Number(getElComputedStyle(selector, "zIndex")) || 0; + mockChart(); + + const gridZIndex = getZIndex(".o-grid"); + const vScrollbarZIndex = getZIndex(".o-scrollbar.vertical"); + const hScrollbarZIndex = getZIndex(".o-scrollbar.horizontal"); + const scrollbarCornerZIndex = getZIndex(".o-scrollbar.corner"); + + triggerMouseEvent(".o-dropdown", "click"); + await nextTick(); + const dropDownZIndex = getZIndex(".o-dropdown-content"); + + await rightClickCell(model, "A1"); + const contextMenuZIndex = getZIndex(".o-popover"); + + await typeInComposerGrid("=A1:B2"); + const gridComposerZIndex = getZIndex("div.o-grid-composer"); + + await typeInComposerTopBar("=SUM(A1,A2)"); + const topBarComposerZIndex = getZIndex(".o-topbar-toolbar .o-composer-container"); + + const highlighZIndex = getZIndex(".o-highlight"); + + triggerMouseEvent(".o-tool.o-dropdown.o-with-color", "click"); + await nextTick(); + const colorPickerZIndex = getZIndex("div.o-color-picker"); + + createChart(model, {}, "thisIsAnId"); + model.dispatch("SELECT_FIGURE", { id: "thisIsAnId" }); + await nextTick(); + const figureZIndex = getZIndex(".o-figure-wrapper"); + const figureAnchorZIndex = getZIndex(".o-fig-anchor"); + + setCellContent(model, "A1", "=SUM()"); + await nextTick(); + await hoverCell(model, "A1", 400); + const gridPopoverZIndex = getZIndex(".o-popover"); + + expect(gridZIndex).toBeLessThan(highlighZIndex); + expect(highlighZIndex).toBeLessThan(figureZIndex); + expect(figureZIndex).toBeLessThan(vScrollbarZIndex); + expect(vScrollbarZIndex).toEqual(hScrollbarZIndex); + expect(hScrollbarZIndex).toEqual(scrollbarCornerZIndex); + expect(scrollbarCornerZIndex).toBeLessThan(gridPopoverZIndex); + expect(gridPopoverZIndex).toBeLessThan(gridComposerZIndex); + expect(gridComposerZIndex).toBeLessThan(dropDownZIndex); + expect(dropDownZIndex).toBeLessThan(colorPickerZIndex); + expect(colorPickerZIndex).toBeLessThan(topBarComposerZIndex); + expect(topBarComposerZIndex).toBeLessThan(contextMenuZIndex); + expect(contextMenuZIndex).toBeLessThan(figureAnchorZIndex); + + jest.useRealTimers(); + }); + + test("Keydown is ineffective in dashboard mode", async () => { + ({ parent, fixture } = await mountSpreadsheet()); + const spreadsheetKeyDown = jest.spyOn(parent, "onKeydown"); + const spreadsheetDiv = fixture.querySelector(".o-spreadsheet")!; + spreadsheetDiv.dispatchEvent(new KeyboardEvent("keydown", { key: "H", ctrlKey: true })); + expect(spreadsheetKeyDown).toHaveBeenCalled(); + jest.clearAllMocks(); + parent.model.updateMode("dashboard"); + await nextTick(); + spreadsheetDiv.dispatchEvent(new KeyboardEvent("keydown", { key: "H", ctrlKey: true })); + expect(spreadsheetKeyDown).not.toHaveBeenCalled(); + }); }); describe("Composer interactions", () => { @@ -468,68 +539,4 @@ describe("Composer / selectionInput interactions", () => { expect(model.getters.getSelectedZones()).toEqual([toZone("A1")]); expect(model.getters.getActiveMainViewport()).toMatchObject(scrolledViewport); }); - - test("Z-indexes of the various spreadsheet components", async () => { - const getZIndex = (selector: string) => Number(getElComputedStyle(selector, "zIndex")) || 0; - mockChart(); - - const gridZIndex = getZIndex(".o-grid"); - const vScrollbarZIndex = getZIndex(".o-scrollbar.vertical"); - const hScrollbarZIndex = getZIndex(".o-scrollbar.horizontal"); - const scrollbarCornerZIndex = getZIndex(".o-scrollbar.corner"); - - triggerMouseEvent(".o-dropdown", "click"); - await nextTick(); - const dropDownZIndex = getZIndex(".o-dropdown-content"); - - await rightClickCell(model, "A1"); - const contextMenuZIndex = getZIndex(".o-popover"); - - await typeInComposerGrid("=A1:B2"); - const gridComposerZIndex = getZIndex("div.o-grid-composer"); - - await typeInComposerTopBar("=SUM(A1,A2)"); - const topBarComposerZIndex = getZIndex(".o-topbar-toolbar .o-composer-container"); - - const highlighZIndex = getZIndex(".o-highlight"); - - triggerMouseEvent(".o-tool.o-dropdown.o-with-color", "click"); - await nextTick(); - const colorPickerZIndex = getZIndex("div.o-color-picker"); - - createChart(model, {}, "thisIsAnId"); - model.dispatch("SELECT_FIGURE", { id: "thisIsAnId" }); - await nextTick(); - const figureZIndex = getZIndex(".o-figure-wrapper"); - const figureAnchorZIndex = getZIndex(".o-fig-anchor"); - - setCellContent(model, "A1", "=SUM()"); - await clickCell(model, "A1"); - const gridPopoverZIndex = getZIndex(".o-popover"); - - expect(gridZIndex).toBeLessThan(highlighZIndex); - expect(highlighZIndex).toBeLessThan(figureZIndex); - expect(figureZIndex).toBeLessThan(vScrollbarZIndex); - expect(vScrollbarZIndex).toEqual(hScrollbarZIndex); - expect(hScrollbarZIndex).toEqual(scrollbarCornerZIndex); - expect(scrollbarCornerZIndex).toBeLessThan(gridPopoverZIndex); - expect(gridPopoverZIndex).toBeLessThan(gridComposerZIndex); - expect(gridComposerZIndex).toBeLessThan(dropDownZIndex); - expect(dropDownZIndex).toBeLessThan(colorPickerZIndex); - expect(colorPickerZIndex).toBeLessThan(topBarComposerZIndex); - expect(topBarComposerZIndex).toBeLessThan(contextMenuZIndex); - expect(contextMenuZIndex).toBeLessThan(figureAnchorZIndex); - }); - - test("Keydown is ineffective in dashboard mode", async () => { - const spreadsheetKeyDown = jest.spyOn(parent, "onKeydown"); - const spreadsheetDiv = fixture.querySelector(".o-spreadsheet")!; - spreadsheetDiv.dispatchEvent(new KeyboardEvent("keydown", { key: "H", ctrlKey: true })); - expect(spreadsheetKeyDown).toHaveBeenCalled(); - jest.clearAllMocks(); - parent.model.updateMode("dashboard"); - await nextTick(); - spreadsheetDiv.dispatchEvent(new KeyboardEvent("keydown", { key: "H", ctrlKey: true })); - expect(spreadsheetKeyDown).not.toHaveBeenCalled(); - }); });