From c7128c4c3e597724ff0ecf736b00877ea02de202 Mon Sep 17 00:00:00 2001 From: Pekka Hyvönen Date: Tue, 23 May 2017 16:51:54 +0300 Subject: Fix missing drag image on FF, Safari (#9409) When CSS transform has been applied, the drag image is missing (safari), or gets offset (FF). Fixed by using custom drag image without transform, and checking for transforms on parent DOM tree. Does NOT fix #9408 When there are frozen columns used, the image needs should not look weird because of the frozen column transitions. The multiselection column is now not shown it is frozen. Fixes #9261 --- .../tests/components/grid/GridDragAndDrop.java | 24 +++++++++++++++++++++- .../main/java/com/vaadin/tests/dnd/DragImage.java | 18 +++++++++++++++- 2 files changed, 40 insertions(+), 2 deletions(-) (limited to 'uitest/src') diff --git a/uitest/src/main/java/com/vaadin/tests/components/grid/GridDragAndDrop.java b/uitest/src/main/java/com/vaadin/tests/components/grid/GridDragAndDrop.java index fedae64e7d..7ccb808618 100644 --- a/uitest/src/main/java/com/vaadin/tests/components/grid/GridDragAndDrop.java +++ b/uitest/src/main/java/com/vaadin/tests/components/grid/GridDragAndDrop.java @@ -33,6 +33,7 @@ import com.vaadin.shared.ui.grid.DropMode; import com.vaadin.tests.components.AbstractTestUIWithLog; import com.vaadin.tests.util.Person; import com.vaadin.tests.util.TestDataGenerator; +import com.vaadin.ui.CheckBox; import com.vaadin.ui.Grid; import com.vaadin.ui.HorizontalLayout; import com.vaadin.ui.Layout; @@ -60,6 +61,7 @@ public class GridDragAndDrop extends AbstractTestUIWithLog { // Layout the two grids Layout grids = new HorizontalLayout(); + grids.addComponents(left, right); grids.setWidth("100%"); @@ -80,10 +82,30 @@ public class GridDragAndDrop extends AbstractTestUIWithLog { dropLocationSelect.addValueChangeListener( event -> dropTarget.setDropMode(event.getValue())); + CheckBox transitionCheckBox = new CheckBox("Transition layout", false); + transitionCheckBox.addValueChangeListener(event -> { + if (event.getValue()) { + grids.addStyleName("transitioned"); + } else { + grids.removeStyleName("transitioned"); + } + }); + + RadioButtonGroup frozenColumnSelect = new RadioButtonGroup<>( + "Frozen columns", Arrays.asList(new Integer[] { -1, 0, 1 })); + frozenColumnSelect.setValue(left.getFrozenColumnCount()); + frozenColumnSelect.addValueChangeListener(event -> { + left.setFrozenColumnCount(event.getValue()); + right.setFrozenColumnCount(event.getValue()); + }); + Layout controls = new HorizontalLayout(selectionModeSelect, - dropLocationSelect); + dropLocationSelect, transitionCheckBox, frozenColumnSelect); addComponents(controls, grids); + + getPage().getStyles() + .add(".transitioned { transform: translate(-30px, 30px);}"); } private Grid createGridAndFillWithData(int numberOfItems) { diff --git a/uitest/src/main/java/com/vaadin/tests/dnd/DragImage.java b/uitest/src/main/java/com/vaadin/tests/dnd/DragImage.java index fcac0b1743..624461a536 100644 --- a/uitest/src/main/java/com/vaadin/tests/dnd/DragImage.java +++ b/uitest/src/main/java/com/vaadin/tests/dnd/DragImage.java @@ -10,6 +10,7 @@ import com.vaadin.server.ThemeResource; import com.vaadin.server.VaadinRequest; import com.vaadin.tests.components.AbstractTestUIWithLog; import com.vaadin.tests.components.uitest.TestSampler; +import com.vaadin.ui.CheckBox; import com.vaadin.ui.HorizontalLayout; import com.vaadin.ui.Label; import com.vaadin.ui.VerticalLayout; @@ -63,7 +64,22 @@ public class DragImage extends AbstractTestUIWithLog { new DragSourceExtension(gridRowLikeLabel); styles.add(css); - addComponent(new VerticalLayout(layout1, layout2, gridRowLikeLabel)); + VerticalLayout layout = new VerticalLayout(); + CheckBox transitionCheckBox = new CheckBox("Transition layout", false); + transitionCheckBox.addValueChangeListener(event -> { + if (event.getValue()) { + layout.addStyleName("transitioned"); + } else { + layout.removeStyleName("transitioned"); + } + }); + + layout.addComponents(transitionCheckBox, layout1, layout2, + gridRowLikeLabel); + addComponent(layout); + layout.addStyleName("transitioned"); + getPage().getStyles() + .add(".transitioned {transform: translateX(50px);}"); } } -- cgit v1.2.3