diff --git a/src/components/grid_overlay/grid_overlay.ts b/src/components/grid_overlay/grid_overlay.ts index 7336544947..877d838cea 100644 --- a/src/components/grid_overlay/grid_overlay.ts +++ b/src/components/grid_overlay/grid_overlay.ts @@ -248,12 +248,14 @@ export class GridOverlay extends Component { } onCellClicked(zoomedMouseEvent: ZoomedMouseEvent) { - const openedPopover = this.cellPopovers.persistentCellPopover; - const [col, row] = this.getCartesianCoordinates(zoomedMouseEvent); const clickedIcon = this.getInteractiveIconAtEvent(zoomedMouseEvent); - if (clickedIcon) { + if (clickedIcon?.onClick) { this.env.model.selection.getBackToDefault(); + clickedIcon.onClick(clickedIcon.position, this.env); + return; } + + const [col, row] = this.getCartesianCoordinates(zoomedMouseEvent); this.props.onCellClicked( col, row, @@ -264,10 +266,7 @@ export class GridOverlay extends Component { zoomedMouseEvent ); - if (clickedIcon?.onClick) { - clickedIcon.onClick(clickedIcon.position, this.env); - } - + const openedPopover = this.cellPopovers.persistentCellPopover; if ( zoomedMouseEvent.ev.target === this.gridOverlay.el && this.cellPopovers.isOpen && diff --git a/src/registries/interactive_icon_on_cell_registry.ts b/src/registries/interactive_icon_on_cell_registry.ts index 5c6f410b8b..3b31d0ee9b 100644 --- a/src/registries/interactive_icon_on_cell_registry.ts +++ b/src/registries/interactive_icon_on_cell_registry.ts @@ -20,6 +20,8 @@ iconsOnCellRegistry.add("filter_icon", (getters, position) => { margin: GRID_ICON_MARGIN, position, onClick: (position, env) => { + const { col, row } = position; + env.model.selection.selectCell(col, row); const cellPopovers = env.getStore(CellPopoverStore); const activePopover = cellPopovers.persistentCellPopover; if ( diff --git a/tests/grid/grid_overlay_component.test.ts b/tests/grid/grid_overlay_component.test.ts index e3a256964e..c39b6fa687 100644 --- a/tests/grid/grid_overlay_component.test.ts +++ b/tests/grid/grid_overlay_component.test.ts @@ -10,6 +10,7 @@ import { import { Model } from "@odoo/o-spreadsheet-engine/model"; import { SpreadsheetChildEnv } from "@odoo/o-spreadsheet-engine/types/spreadsheet_env"; import { CellComposerStore } from "../../src/components/composer/composer/cell_composer_store"; +import { GridOverlay } from "../../src/components/grid_overlay/grid_overlay"; import { ColResizer, RowResizer } from "../../src/components/headers_overlay/headers_overlay"; import { lettersToNumber, toXC, toZone } from "../../src/helpers/index"; import { @@ -35,7 +36,13 @@ import { triggerMouseEvent, } from "../test_helpers/dom_helper"; import { getEvaluatedCell, getSelectionAnchorCellXc } from "../test_helpers/getters_helpers"; -import { mountSpreadsheet, nextTick, target, typeInComposerGrid } from "../test_helpers/helpers"; +import { + mountComponent, + mountSpreadsheet, + nextTick, + target, + typeInComposerGrid, +} from "../test_helpers/helpers"; let fixture: HTMLElement; let model: Model; @@ -1338,3 +1345,32 @@ describe("Can select de-select headers", () => { expect(model.getters.getActiveRows()).toEqual(new Set([0, 1, 3, 4])); }); }); + +test("GridOverlay: clicking an icon should NOT trigger props onCellClicked", async () => { + const onCellClicked = jest.fn(); + const iconOnClick = jest.fn(); + const { parent } = await mountComponent(GridOverlay, { + props: { + onCellClicked, + onGridMoved: () => {}, + gridOverlayDimensions: "1000x800", + getGridSize: () => ({ width: 1000, height: 800 }), + + // Required only to satisfy TS + onCellDoubleClicked: () => {}, + onCellRightClicked: () => {}, + onGridResized: () => {}, + }, + }); + + const comp: any = parent; + comp.getInteractiveIconAtEvent = () => ({ + position: { col: 1, row: 1 }, + onClick: iconOnClick, + }); + + // Fake click event + comp.onCellClicked({ ev: new MouseEvent("click") }); + expect(iconOnClick).toHaveBeenCalled(); + expect(onCellClicked).not.toHaveBeenCalled(); +});