diff --git a/src/dragdrop/core.ts b/src/dragdrop/core.ts index 7aeb1a0239..d5df9b75cd 100644 --- a/src/dragdrop/core.ts +++ b/src/dragdrop/core.ts @@ -113,9 +113,12 @@ export abstract class DragDropCore implements IDragDropEngine { protected doBanDropHere = (): void => { }; protected findDropTargetNodeFromPoint(clientX: number, clientY: number): HTMLElement { - this.domAdapter.draggedElementShortcut.hidden = true; + const displayProp = this.domAdapter.draggedElementShortcut.style.display; + //this.domAdapter.draggedElementShortcut.hidden = true; + this.domAdapter.draggedElementShortcut.style.display = "none"; let dragOverNode = document.elementFromPoint(clientX, clientY); - this.domAdapter.draggedElementShortcut.hidden = false; + // this.domAdapter.draggedElementShortcut.hidden = false; + this.domAdapter.draggedElementShortcut.style.display = displayProp || "block"; if (!dragOverNode) return null; diff --git a/testCafe/questions/ranking.js b/testCafe/questions/ranking.js index 3020843604..6a2af6775d 100644 --- a/testCafe/questions/ranking.js +++ b/testCafe/questions/ranking.js @@ -281,4 +281,32 @@ frameworks.forEach((framework) => { "one" ]); }); + + test("ranking: work with flexbox layout", async (t) => { + const addFlexboxLayout = ClientFunction(() => { + const stylesheet = document.styleSheets[0]; + stylesheet.addRule(".sv-ranking.sv-ranking.sv-ranking.sv-ranking.sv-ranking", "display:flex;flex-direction: column", 0); + }); + const removeFlexboxLayout = ClientFunction(() => { + const stylesheet = document.styleSheets[0]; + stylesheet.removeRule(0); + }); + + await addFlexboxLayout(); + + await t.dragToElement(PriceItem, BatteryItem); + + let data = await getData(); + await t.expect(data["smartphone-features"]).eql([ + "Price", + "Battery life", + "Screen size", + "Storage space", + "Camera quality", + "Durability", + "Processor power", + ]); + + await removeFlexboxLayout(); + }); });