PDA

View Full Version : MS Edge support - ComboBox



priand
29 Mar 2017, 5:43 AM
We face multiple issues with MS Edge browser (using GXT4.0.2 / GWT2.8).
Is this browser supported? Do we need to set some specific properties in our gwt.xml file?
(we currently have <set-property name="gxt.user.agent" value="ie10, ie11, edge, gecko1_9, safari5, chrome" />).
One of our problems is that with SimpleComboBox mouse click does not trigger selection of the clicked item.
What makes things worse is that we are not able to debug with this browser, because source maps are not found.
On chrome, it works fine, selection is done in ComboBoxCell.eventPreview.

axelman
3 Jul 2017, 7:00 AM
Hello,
We are experiencing the same kind of issue, when mouse click does not select entries from the ComboBox, and mouse click event is not being triggered. On the other hand, it is possible to select entry from the ComboBox by using keyboard.
Issue is reproducible on IE 10, IE 11 and MS Edge.
We are on latest versions of GXT (4.0.2) and GWT (2.8.1).

In release notes for GXT 4.0.2 it is said that bug with similar behavior has been fixed:
https://docs.sencha.com/gxt/4.x/guides/announcements/release_notes.html


[EXTGWT-4935] - ComboBox is unable to select items with mouse or keyboard navigation on MSEdge or IE11 Touch

So it means that the issue on GXT side existed, but was not fixed well.

IcgNickK
13 Sep 2018, 8:34 PM
Any updates/workarounds for this issue?

We are experiencing this same issue with GXT 4.0.3 and GWT 2.8.2 in MS Edge.
Clicking combobox items with the mouse fails to select the item.

Forum_Adm
14 Sep 2018, 7:35 AM
Hello to all- I'll send this over to support and see if we can get this figured out. Thank you al for your patience.

IcgNickK
14 Sep 2018, 7:38 AM
I have implemented the following code change in ComboBoxCell.java as a workaround for now:


protected boolean onListContainerEventPreview(NativePreviewEvent previewEvent) {
Element target = previewEvent.getNativeEvent().getEventTarget().cast();


// pointer event MOUSEDOWN conflicts with scrolling (this traps all events, but we want KeyNav to go through)
if (PointerEventsSupport.impl.isSupported() && previewEvent.getTypeInt() != KeyNav.getKeyEvent()) {
// CODE CHANGE BEGINs HERE
// previewTapGestureRecognizer.handle(previewEvent.getNativeEvent();
// return true;
NativeEvent event = previewEvent.getNativeEvent();
String eventType = event.getType();
if (eventType.equals(BrowserEvents.TOUCHSTART) || eventType.equals(PointerEvents.POINTERDOWN.getEventName())) {
return previewTapGestureRecognizer.handleStart(event);
} else if (eventType.equals(BrowserEvents.TOUCHMOVE) || eventType.equals(PointerEvents.POINTERMOVE.getEventName())) {
return previewTapGestureRecognizer.handleMove(event);
} else if (eventType.equals(BrowserEvents.TOUCHEND) || eventType.equals(PointerEvents.POINTERUP.getEventName())) {
return previewTapGestureRecognizer.handleEnd(event);
} else if (eventType.equals(BrowserEvents.TOUCHCANCEL) || eventType.equals(PointerEvents.POINTERCANCEL.getEventName())) {
return previewTapGestureRecognizer.handleCancel(event);
} else if (eventType.equals(PointerEvents.POINTERENTER.getEventName()) || eventType.equals(PointerEvents.POINTERLEAVE.getEventName()) || eventType.equals(PointerEvents.POINTEROVER.getEventName())) {
event.preventDefault();
event.stopPropagation();
}
// END CODE CHANGE
}


switch (previewEvent.getTypeInt()) {
case Event.ONSCROLL:
case Event.ONMOUSEWHEEL:
collapseIf(previewEvent);
break;
case Event.ONMOUSEDOWN:
if (listContainer.getElement().isOrHasChild(target)) {
if (pagingToolBar == null || (!pagingToolBar.getElement().isOrHasChild(target))) {
onViewClick(lastParent, previewEvent.getNativeEvent(), true, false);
previewEvent.getNativeEvent().preventDefault();
}
} else {
collapseIf(previewEvent);
}
break;
case Event.ONTOUCHSTART:
case Event.ONTOUCHMOVE:
case Event.ONTOUCHEND:
case Event.ONTOUCHCANCEL:
previewTapGestureRecognizer.handle(previewEvent.getNativeEvent());
break;
}


NativeEvent nativeEvent = previewEvent.getNativeEvent();


if (previewEvent.getTypeInt() == KeyNav.getKeyEvent() && isListContainerExpanded()) {
if (nativeEvent.getKeyCode() == KeyCodes.KEY_ENTER) {
if (pagingToolBar != null && pagingToolBar.getElement().isOrHasChild(target)) {
return true;
}
nativeEvent.stopPropagation();
nativeEvent.preventDefault();


if (GXT.isIE()) {
ignoreNextEnter = true;
}


onViewClick(lastParent, nativeEvent, false, true);
}
}


return true;
}

branflake2267
18 Sep 2018, 9:02 PM
It's not clear to me yet what the reported issue is. Would you have a test case? Or could you provide the steps to reproduce it in one of the examples?


I have implemented the following code change in ComboBoxCell.java as a workaround for now:


protected boolean onListContainerEventPreview(NativePreviewEvent previewEvent) {
Element target = previewEvent.getNativeEvent().getEventTarget().cast();


// pointer event MOUSEDOWN conflicts with scrolling (this traps all events, but we want KeyNav to go through)
if (PointerEventsSupport.impl.isSupported() && previewEvent.getTypeInt() != KeyNav.getKeyEvent()) {
// CODE CHANGE BEGINs HERE
// previewTapGestureRecognizer.handle(previewEvent.getNativeEvent();
// return true;
NativeEvent event = previewEvent.getNativeEvent();
String eventType = event.getType();
if (eventType.equals(BrowserEvents.TOUCHSTART) || eventType.equals(PointerEvents.POINTERDOWN.getEventName())) {
return previewTapGestureRecognizer.handleStart(event);
} else if (eventType.equals(BrowserEvents.TOUCHMOVE) || eventType.equals(PointerEvents.POINTERMOVE.getEventName())) {
return previewTapGestureRecognizer.handleMove(event);
} else if (eventType.equals(BrowserEvents.TOUCHEND) || eventType.equals(PointerEvents.POINTERUP.getEventName())) {
return previewTapGestureRecognizer.handleEnd(event);
} else if (eventType.equals(BrowserEvents.TOUCHCANCEL) || eventType.equals(PointerEvents.POINTERCANCEL.getEventName())) {
return previewTapGestureRecognizer.handleCancel(event);
} else if (eventType.equals(PointerEvents.POINTERENTER.getEventName()) || eventType.equals(PointerEvents.POINTERLEAVE.getEventName()) || eventType.equals(PointerEvents.POINTEROVER.getEventName())) {
event.preventDefault();
event.stopPropagation();
}
// END CODE CHANGE
}


switch (previewEvent.getTypeInt()) {
case Event.ONSCROLL:
case Event.ONMOUSEWHEEL:
collapseIf(previewEvent);
break;
case Event.ONMOUSEDOWN:
if (listContainer.getElement().isOrHasChild(target)) {
if (pagingToolBar == null || (!pagingToolBar.getElement().isOrHasChild(target))) {
onViewClick(lastParent, previewEvent.getNativeEvent(), true, false);
previewEvent.getNativeEvent().preventDefault();
}
} else {
collapseIf(previewEvent);
}
break;
case Event.ONTOUCHSTART:
case Event.ONTOUCHMOVE:
case Event.ONTOUCHEND:
case Event.ONTOUCHCANCEL:
previewTapGestureRecognizer.handle(previewEvent.getNativeEvent());
break;
}


NativeEvent nativeEvent = previewEvent.getNativeEvent();


if (previewEvent.getTypeInt() == KeyNav.getKeyEvent() && isListContainerExpanded()) {
if (nativeEvent.getKeyCode() == KeyCodes.KEY_ENTER) {
if (pagingToolBar != null && pagingToolBar.getElement().isOrHasChild(target)) {
return true;
}
nativeEvent.stopPropagation();
nativeEvent.preventDefault();


if (GXT.isIE()) {
ignoreNextEnter = true;
}


onViewClick(lastParent, nativeEvent, false, true);
}
}


return true;
}