ExtJs 6.2 经典不适用于 Firefox 和触摸屏

Question

ExtJs 6.2.0 在屏幕启用触摸时无法在 Firefox 上运行。我发现使用框架的经典版本有问题，我不知道现代版本是否也受到影响。

这正是问题所在：如果屏幕支持触摸，则可以通过手势使用应用程序，但不能通过鼠标使用。鼠标点击不会触发点击事件。

Sencha forum 上提到了这个问题，但非常令人沮丧的是 Sencha 为订阅者修复了这个问题，但没有发布新的 GPL 版本。还有一个代码片段，但我不太清楚如何使用它：

// Undo sencha's logic 
// Needed for top nav buttons to not open links in new tabs/windows when clicked in IE11 EXTJS-13775
// Firefox 52 is getting deteceted now as ALWAYS having pointer events
// chromeOS causing issues too
// unit tests failing
if (Ext.isIE || Ext.isEdge || (Ext.firefoxVersion >= 52) || Ext.os.is.ChromeOS || window.inUnitTest) {
    // sorry windows mobile phones...
    var eventMap = Ext.dom.Element.prototype.eventMap;
    eventMap.click = 'click';
    eventMap.dblclick = 'dblclick';
}

Answer 1

经过一些尝试和错误，并比较 console.log 和代码中的来复枪，我想出了一个修复错误的覆盖。

/**
 * workaround for bug in ExtJs 6.2.0.
 * Resolved in current yet unreleased version
 */
Ext.define('Mb.override.dom.Element', {
    override: 'Ext.dom.Element'
},
function(){
    var additiveEvents = this.prototype.additiveEvents,
        eventMap = this.prototype.eventMap;
    if(Ext.supports.TouchEvents && Ext.firefoxVersion >= 52 && Ext.os.is.Desktop){
        eventMap['touchstart'] = 'mousedown';
        eventMap['touchmove'] = 'mousemove';
        eventMap['touchend'] = 'mouseup';
        eventMap['touchcancel'] = 'mouseup';
        eventMap['click'] = 'click';
        eventMap['dblclick'] = 'dblclick';
        additiveEvents['mousedown'] = 'mousedown';
        additiveEvents['mousemove'] = 'mousemove';
        additiveEvents['mouseup'] = 'mouseup';
        additiveEvents['touchstart'] = 'touchstart';
        additiveEvents['touchmove'] = 'touchmove';
        additiveEvents['touchend'] = 'touchend';
        additiveEvents['touchcancel'] = 'touchcancel';

        additiveEvents['pointerdown'] = 'mousedown';
        additiveEvents['pointermove'] = 'mousemove';
        additiveEvents['pointerup'] = 'mouseup';
        additiveEvents['pointercancel'] = 'mouseup';
    }
})

我没有测试每个事件翻译组合是否有效。鼠标在触摸屏上触发的 click 事件特别需要的行是

eventMap['click'] = 'click';
eventMap['dblclick'] = 'dblclick';

Answer 2

这是一个已知问题。有关详细信息，请参阅我们的网站兼容性说明： https://www.fxsitecompat.com/en-CA/docs/2016/touch-event-support-has-been-re-enabled-on-windows-desktop/

ExtJs 6.2 经典不适用于 Firefox 和触摸屏

ExtJs 6.2 classic does not work with Firefox and a touchscreen

firefox

touch

extjs6

extjs6-classic

extjs6.2