Electron: Click events not working properly on touch screen devices

[vhopinto86]

• Electron version: 1.6.0
• Operating system: Windows 7, 8 and 10

Hello,

I have a web application that in some scenarios needs to send and receive data to user peripherals through serial port.

For this scenario i created an Electron application that hosts my web application and does the communication between the peripherals and the web app.

Everything works great except on touch screen devices in which the mouse events are not working properly when i tap the screen.

Expected behavior

All click events should work on a touch screen running the web app throught Electron. Everything works using a regular browser.

Actual behavior

When i launch my web application through Electron, a sign in page is shown and the touch screen works properly here.

After signing in, the web app redirects to another page and the touch screen has a strange behavior, the touchstart/touchend events are detected, the click/mousedown/mouseup events are not.

After tapping the screen multiples times, all mouse events start to work again until i navigate to another page. Then the same thing happens again.

How to reproduce

Get the project at https://github.com/electron/electron-quick-start then change the start page to mainWindow.loadURL('https://github.com').

Run the app, go to Sign In page and enter your credentials.

The touch screen stops working after you sign in. If you don't have a touch screen you can use Microsoft Windows Simulator to simulate touch events.

What was tried

After several days searching for a solution, i already tried:

• several touch screen related command line switches like app.commandLine.appendSwitch('touch-events', 'enabled');
• control the navigation between pages of my web application on the Electron side, using mainWindow.loadURL() or creating new instances of BrowserWindow (both options work properly using a mouse)
• disabling node integration

Can someone help me with this?

Thank you

[MarshallOfSound]

@vhopinto86 Do you happen to know if this issue occurs on the latest stable release, 1.4.15?

[vhopinto86]

@MarshallOfSound I don't know, but i will try now.

[vhopinto86]

@MarshallOfSound I just tried and this issue also occurs on the last stable release.

[TimvdEijnden]

We've also have this issue with a webview containing a flash element, also in 1.4.15 & 1.6beta

[KagamiChan]

@TimvdEijnden not sure if your issue is the same as above, but here's a workaround we're using for a webview flash element not responding to touch events:

// Workaround for touch screen
let transformedToMouseEvent = false, isMoved = false
const webContents = remote.getCurrentWebContents()
window.addEventListener('touchend', (e) => {
  transformedToMouseEvent = false
  setTimeout(() => {
    if (!transformedToMouseEvent) {
      console.warn("Blurring focusing element")
      document.activeElement.blur()
      e.target.focus()
      if (!isMoved) {
        const x = Math.round(e.changedTouches[0].clientX),
          y = Math.round(e.changedTouches[0].clientY)
        webContents.sendInputEvent({
          type: 'mouseMove',
          x: x,
          y: y,
        })
        webContents.sendInputEvent({
          type: 'mouseDown',
          x: x,
          y: y,
          button: 'left',
          clickCount: 1,
        })
        webContents.sendInputEvent({
          type: 'mouseUp',
          x: x,
          y: y,
          button: 'left',
          clickCount: 1,
        })
      }
    }
  }, 300)
})
window.addEventListener('touchstart', (e) => {
  isMoved = false
})
window.addEventListener('touchmove', (e) => {
  isMoved = true
})
window.addEventListener('mouseup', (e) => {
  transformedToMouseEvent = true
})

it will "translate" touch events into input ones, and will however cause inifinit loops when using simulated touch

[vhopinto86]

The code that @KagamiChan posted doesn't work in my case.

[teameh]

We're facing the same issue, it's the last blocking issue before we can release the app we've migrated to electron.

In our case, we've got a webview in the main webview. After a sign out users are not able to interact with the login form any more. Inspecting the executed javscript with a timeline shows no activity at all. The touches are being registered, but the event handlers on the form elements are not being called.

[kevinsawicki]

Run the app, go to Sign In page and enter your credentials. The touch screen stops working after you sign in.

I can reproduce this on the Windows Simulator inside a Parallels Window 10 VM. @vhopinto86 are you seeing this issue only in the simulator or on an actual device as well?

[vhopinto86]

@kevinsawicki yes, i'm getting this issue on actual devices as well, a touch screen pc and a tablet.

[Matt3o12]

I also get this issue on a 34 inch touchscreen board after a few minutes (some webpages seem to provoke it) on windows 10. I load external addresses. The mouse and keyboard still work find as well as. I can also use the touchscreen for developer tools. The only way to fix this seems to restart the electron app.

Are there any workarounds for this issue? Or are there any version where it is known to work?

[groundwater]

I have not been able to reproduce this yet on a Windows 10 Surface Pro 4.

I took a quick look at chromium bugs here https://bugs.chromium.org but didn't see anything jump out.

I'll see if we can bring in some more windows expertise here. In the mean time, if anyone can narrow down the cause that would help greatly!

[Matt3o12]

I have found a workaround for this bug:

There seems to be an issue with touch events. Sometimes they seem to get disabled for no apparent reason (maybe there is a bug in the driver or a bug in electron for some drivers). You can observe this behavior by listening to the events (touchend and mousedown). Normally, the touchend event is fired followed by a mousedown event. When this bug occurs, only the touchend event is fired (I have also listened to all other mouse and touchscreen related events -- the touch is not cancelled and no mouse event is fired).

A workaround is to always enabled touch events (the default behavior is automatic). Add this line to your main.js file (Source):

app.commandLine.appendSwitch('touch-events', 'enabled');

Possible values are: automatic (default), enabled (forces touch events), disabled (no touch events -- the same behavior as described by this bug report).

[vhopinto86]

@Matt3o12 Unfortunately, as i said in the first post, that command line switch does not resolve this issue in my case, although it might be the solution for other people.

[brendanadnerb]

I am having a similar issue - app.commandLine.appendSwitch('touch-events', 'enabled'); does not solve it. As @Matt3o12 said, some webpages seem to provoke it, it's hard to say how. Touch events stop working or become very slow to respond. We are building for linux and windows, and it happens on both. I've found that reverting to electron 0.36.11 makes it go away - not sure yet at which version the problem starts.

[mvladic]

I am having the same issue (I tested with Electron 1.4.15 and 1.6.3.)! It works in Chrome perfectly.

[jschlemm]

@I am also having the same issue on the latest electron. The issue disappears when using 0.36.11 as @brendanadnerb suggested. 0.36.12 also works. The issue reappears with 0.37.0

[Gethi]

I am also having the same issue.

app.commandLine.appendSwitch('touch-events', 'enabled');
Doesn't solve it.

I can't downgrade my electron version because of some API methods I'm using.

[asoap]

I am also having a very similar issue. Our problem has been determined to be a touch-event issue. We have to turn on that switch in order for our touch screen to work.

The issue however is that we have a flash game loaded in a webview. If for example you touch the flash game 5 times. You then have to touch outside of the webview 6 times in order for a click event to fire. It's like you have to "undo" the touch event. We've boiled our flash down to a very simple flash file. If a mouse is connected to the machine, this issue doesn't happen.

Also once this 5/6 or 11/12 (however times you tap) is completed our problem goes away. This might be one of the strangest issues I've ever had to deal with.

Edit: I'm using chormium 56.0.2924.87 and electron 1.6.2

[krokofant]

So what should we do from here? Trying to reproduce it in chromium and submit a bug upstream? What more information do we need?

[krokofant]

I've looked at a touch screen that I've deployed an electron application to. It detects touch-events and displays different things in a webview depending on the button clicked.

Now, while looking in the console I pressed buttons on the application that appeared frozen. It took ~15 seconds for the events to register (touch-start and touch-end) and the console showed that the application started changing the webview, yet nothing happened on the screen.

I've tried to work around this before by scheduling a restart of the application and this is one time when I caught the screen in a frozen state. Not sure to blame the touch screen or electron. If anyone knows what logging information would more closely diagnose this please do tell.

[kaktuspalme]

I have exactly the same Problem. It only happens when a website inside a webview does a "HTTP 301 Moved Permanently" redirect.
I set up a build system and compiled electron. The error happens after commit 6aec1e6 -> with the update to chrome49. Before everything works fine.
I didn't have the time yet to look further.

[scrnet]

any news ? We are having this issue with latest version!

[chlk1234]

We have the same problem. We created a electron application on Windows 10 with touch screen. If we use the mouse, everything is fine, but the touch doesn't work. We detected the touch event when touch the screen, but did not detect the click event. But using chrome directly work fine. We've almost tried all the electron versions after 1.2.7, and did not solve it .

[bourgondien]

I ran into the same problem with Electron in combination with a touchscreen. After a while (seemingly random) the screen will become unresponsive. Touchend is still detected by the touchscreen, but click en mouseup are not. They are however detected when using the mouse.

A strange thing I found is that the screen does become responsive again when I am in developer tools and:

• select another tab there
• resize the developer pane
• clear the log console

I do not know how this is related, but maybe it does ring a bell for someone. Does the screen re-render at those moments?

[bourgondien]

In addition to my previous comment I found that it seems the (multi-)touchscreen is falsely registering multi-touch events: the event.touches array becomes populated with ghost touch points and touchEnd will not clear the array. This is when using the screen with just one finger.

The number of touch points in the touches array will go up after a while, becoming 7 or more, all the time just using one finger to interact.

I believe this is the reason the click event or the mouse-up never fires.

I am testing with a capacitive multi-touch monitor from IIyama.

Tips on how to disable multi-touch (we don't need it in this case) are appreciated.

[mkonecny]

I believe we had this problem in Windows 10, and we were able to temporarily address it by clearing the Electron cache directory

c:\Users\<username>\AppData\Roaming\<electron-appname>

And deleting all files under

c:\Users\<username>\AppData\Local\Temp

Note that AppData is a hidden directory, so you need to enable seeing hidden files/folders first.

[riebschlager]

I'm having this identical issue. None of the solutions in this thread have worked for me.

Is there a post v1.0 version that still works?

[bente]

I have resorted to checking the event.touches array 20 secs after the last user interaction. It happens that the array then is still not 0 (which it should). If that is the case I do a hide() - show() of the electron application (it is hardly visible) and that seems to solve the problem in my case.

[riebschlager]

Hey @bente, are you performing this hide/show in an event callback? Like touchend?

[bourgondien]

Hi @riebschlager , See attached file. I am saving the number of touches in touchend, and then check them when the user goes Idle (I am using Idle.js for that). When they are not 0 I do a hide()/show() of the current window. Seems to be working.

interaction-monitor-example.txt

[leonayx123]

I'm having this identical issue on win7.
@Matt3o12 posted doesn't work in my case.

electron verison now is 1.7.9. Is there any great God who can help me?

[StevenLiSiwei]

Having the same issue here

[obermillerk]

Hi,
So we're working on an electron app in Windows 10 and we've been getting what I believe is this issue intermittently for months now. We would have to touch a certain number of times on each page before touch events would respond again (usually around 3).

Just recently, we integrated the Mottie Virtual Keyboard library into our app, and this led to the discovery that for some reason each key pressed on the keyboard would consistently add one touch to this number when navigating to the next page. This behavior only shows up in builds, not running from source.

I'm not sure how I could go about debugging this myself, but I at least have something that creates consistent behavior for me, so I've made a clone of electron quick start that will show this behavior so that hopefully the electron devs can debug this.

The repo can be found here.

Reproduction Instructions

git clone https://github.com/obermillerk/electron-touch-issue
cd electron-touch-issue
npm i
./node_modules/.bin/build

Installer will be located in dist folder in the root of the project. Install the application, and run it.

Click the link to navigate to the page with the keyboard plugin. Focus the input, and touch a single key on the virtual keyboard.

Click the link to navigate back to the other page. You will now have to touch once before touches respond.

You can keep typing characters and the number of touches should compound, building up until you restart the app.

Note that I made this able to be opened in a web browser (such as chrome) and this behavior is not exhibited, so I can only assume that this is an electron issue. Either that or it's an issue with the old version of V8 that electron uses.

I tried adding the electron touch events flag via
app.commandLine.appendSwitch('touch-events', 'enabled');
and this did not help in our application.

EDIT: Just tried this in the version of chrome that electron 1.7.6 (the version we are using, and is in my demo) is using and it did not exhibit the behavior, so I'm almost certain that this must be an electron issue.

[dfblackburn]

I am also seeing this issue and am also using the Mottie keyboard.

[StevenLiSiwei]

This one might relevant to windows 10 multi touch gestures on windows 10 after doing days of researching, and there is no way of disabling multi touch gestures on touch monitor on Windows 10 (except on touchpad). I will give a try downgrading to windows 7 (with multi gestures touch disabled) and see how it goes and get back to here.

[obermillerk]

I've just updated my demo. I discovered that touch events are actually fired, but they do not get translated.

I added a button on the initial page that logs click, mousedown, mouseup, touchstart, touchend, touchmove, and touchcancel events. You can tap this button after typing one key on the keyboard and see that touchstart and touchend events are fired with no mouse events, and then tap a second time and see that touchstart and touchend are quickly followed by mousedown, mouseup, and click events.

[dfblackburn]

I was experiencing this on WES7 multi touch, so it is not specific to Win10.

[vhopinto86]

I also had this issue on Windows 7 and 8.

[jbcpollak]

We have this problem on Ubuntu 16.04.

[brendanadnerb]

We have this happening on Linux as well. I've never seen it on Mac (our dev environment). Windows 10 seems to have similar issues, but slightly different (we dev for Windows and Linux).

[brendanadnerb]

again - for me, I think 0.36.11 was the cutoff where after that version we started seeing it, on both Windows and Ubuntu. I'm kinda mystified as to why - I think Chromium didn't even update until a couple more, if I remember.

[obermillerk]

I've developed a workaround similar to and inspired by @KagamiChan's original workaround. I've modified it to assume that all touches will not be translated to clicks, and prevent this from happening if it would, instead relying solely upon creating clicks myself. The advantage of assuming that the clicks won't be created is that there won't be that brief delay on the click so it will feel more responsive.

It uses event.preventDefault() on touchend events to prevent the Chromium engine from converting them to clicks while allowing for touch scrolling to be handled natively. I also added support for multiple touches, as well as double clicks and beyond. Additionally, calling event.preventDefault() from any touchend or touchstart listeners in your code will prevent the false click events from firing as well.

Ideally this code should be run as soon as possible in any page it's in, but it should be okay in most cases if it isn't the first thing that's run.

EDIT: Native scrolling still suffers from the issue, you must still click X times before native scrolling will work. Looking to find a way to fix this now.

EDIT 2: I have updated my code below to fix the scrolling issue now. It should work for both vertical and horizontal scrolling.

// List of active touches.
var activeTouches = {};
// Click counter
var numClicks = 0;
// Timer for reseting click counter, so it may be cleared.
var clickCountTimer = null;
// Reference to the last touch object received at a location;
var lastTouch = null;
// Distance away from initial touch that constitutes cancelation, or disqualifies from doubleclick.
const moveThreshold = 10;

const webContents = require('electron').remote.getCurrentWebContents();

var handlers = {};

// Handler for touchstart events. Tracks active touches.
handlers.touchstart = function(event) {
    // Store touches for later use.
    var touches = Array.from(event.changedTouches);
    touches.forEach((touch) => {
        touch.defaultPrevented = event.defaultPrevented;
        activeTouches[touch.identifier] = touch;
    });
}

// Handler for touchend events. Tells main process to generate mouse events.
handlers.touchend = function(event) {
    // Check if somebody tried to prevent touches from becoming clicks.
    let defaultPrevented = event.defaultPrevented;
    // Prevent touches from being translated to clicks, do it ourselves
    event.preventDefault();
    // Translate corresponding touches to mouse events.
    var touches = Array.from(event.changedTouches);
    touches.forEach((end) => {
        var start = activeTouches[end.identifier];
        // Check if defualt was prevented in touchstart also.
        defaultPrevented = defaultPrevented || start.defaultPrevented;
        delete activeTouches[end.identifier];

        // Don't fire click if the default action was prevented by user
        //   or if the touch was otherwise cancelled (cancel or too much movement)
        if (defaultPrevented !== true && start.cancelled !== true) {
            const x = Math.round(end.clientX),
                y = Math.round(end.clientY);
            // Keep track of the number of clicks within 500ms of eachother closer than the moveThreshold
            // (for double clicks)
            if (numClicks == 0 || dist(lastTouch, end) <= moveThreshold) {
                numClicks++;
            } else { // numClicks > 0 && dist > moveThreshold
                clearTimeout(clickCountTimer);
                numClicks = 1;
            }
            lastTouch = end;
            if (numClicks == 1) {
                clickCountTimer = setTimeout(function() {
                    numClicks = 0;
                    lastTouch = null;
                    clickCountTimer = null;
                }, 500);
            }
            falsifyClick(x, y, numClicks);
        }
    });
}

// Capture touchstart, touchend events first thing when they happens.
document.addEventListener('touchstart', captureHandler, {
    capture: true,
    passive: false
});
document.addEventListener('touchend', captureHandler, {
    capture: true,
    passive: false
});

function captureHandler(event) {
    var stopPropagation = event.stopPropagation;
    var stopImmediatePropagation = event.stopImmediatePropagation;
    // Ensure that our handler is called for touchstart, even if propagation of the event is stopped.
    //   Keeps everything clean.
    event.stopPropagation = function() {
        stopPropagation.apply(event);
        handlers[event.type](event, true);
    }
    event.stopImmediatePropagation = function() {
        stopImmediatePropagation.apply(event);
        handlers[event.type](event, true);
    }
}

// Listen for bubbling touchstart events on the document.
document.addEventListener('touchstart', handlers.touchstart, {
    capture: false,
    passive: false
});

// Listen for bubbling touchend events on the document.
document.addEventListener('touchend', handlers.touchend, {
    capture: false,
    passive: false
});

// Cancel corresponding touches if touch was canceled.
document.addEventListener('touchcancel', function(event) {
    var touches = Array.from(event.changedTouches);
    touches.forEach((touch) => {
        activeTouches[touch.identifier].cancelled = true;
    });
},  {
    capture: true,
    passive: true
});

// Prevent default touchmove actions (scrolling)
document.addEventListener('touchmove', function(event) {event.preventDefault()}, {
    capture: true,
    passive: false
});
// Cancel corresponding touches if touch moved too much.
// Handle scrolling.
document.addEventListener('touchmove', function(event) {
    var touches = Array.from(event.changedTouches);
    touches.forEach((touch) => {
        var start = activeTouches[touch.identifier];
        if (start.scrolling) {
            let target = start.scrollTarget;
            target.scrollTop += start.scrollY - touch.clientY;
            target.scrollLeft += start.scrollX - touch.clientX;
            start.scrollX = touch.clientX;
            start.scrollY = touch.clientY;
            return;
        }
        if (start.cancelled) {
            return;
        }

        if (dist(start, touch) > moveThreshold) {
            start.cancelled = true;
            start.scrolling = true;
            let target = start.scrollTarget = getScrollParent(start.target);
            target.scrollTop += start.clientY - touch.clientY;
            target.scrollLeft += start.clientX - touch.clientX;
            start.scrollX = touch.clientX;
            start.scrollY = touch.clientY;
        }
    });
},  {
    capture: true,
    passive: true
});

function falsifyClick(x, y, numClicks) {
    webContents.sendInputEvent({
        type: 'mouseMove',
        x: x,
        y: y
    });
    webContents.sendInputEvent({
        type: 'mouseDown',
        x: x,
        y: y,
        button: 'left',
        clickCount: numClicks
    });
    webContents.sendInputEvent({
        type: 'mouseUp',
        x: x,
        y: y,
        button: 'left',
        clickCount: numClicks
    });
}

// Calculates the distance between two touches.
function dist(touch1, touch2) {
    return Math.hypot(touch1.clientX - touch2.clientX, touch1.clientY - touch2.clientY);
}

// https://stackoverflow.com/questions/35939886
function getScrollParent(element, includeHidden) {
    var style = getComputedStyle(element);
    var excludeStaticParent = style.position === "absolute";
    var overflowRegex = includeHidden ? /(auto|scroll|hidden)/ : /(auto|scroll)/;

    if (style.position === "fixed") return document.body;
    for (var parent = element; (parent = parent.parentElement);) {
        style = getComputedStyle(parent);
        if (excludeStaticParent && style.position === "static") {
            continue;
        }
        if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX)) return parent;
    }

    return document.body;
}

[ghost]

Hello, having same touch screen issues on Windows 7 and Electron 1.8.3

Touch events just stop working if I start to click a lot on screen, on my touch device. No events are logging in console. Sometimes by randomly clicking a lot it unfreezes and starts working, but still buggy.

[mkazlauskas]

This issue is pretty serious for some users. We had to migrate to nw.js because of it.

[ghost]

Is there any temporary fix for this issue? I've tried all above mentioned code, it doesn't work. I'm trying to figre out how to disable touch events, and make them as mouse events at Electron or Windows 7 level.

[obermillerk]

@davismiculis The issue you're describing seems like a different issue, perhaps even just your hardware being unable to handle so many touches and getting way bogged down trying to catch up? Do the events ever log after is unfreezes or do they just get swallowed? Also, when you say no events are logged, are you logging touch events or just click/mouse events? A key characteristic of this bug seems to be that touch events appear, but they are not translated to mouse events for some reason, so if you're only looking for mouse events try seeing if the touch events are still working.

We also had a separate, seemingly unrelated issue where clicking too early before a page fully loads would prevent any touch events from registering, which seems like it is possibly similar to what you're describing. This issue could be solved by unfocusing the window and refocusing it, after which touch events would work, however this is not desirable behavior and we never had any sort of automatic work around for this but it seemed to mostly go away as far as I can tell.

Also, as some people seem to suggest higher up in the thread that certain developer tools actions can fix touch issues, and I seem to recall that I've gotten different behavior from electron based on whether or not dev tools is open in the past, I would suggest attempting to replicate the issue without dev tools open and see if it's still persistent.

[cdubois]

@mkazlauskas Agreed this is serious, inconsistent, and very inconvenient. The code posted to this thread by @obermillerk did resolve this issue for us. It is a thorough piece of work; if we did such a workaround ourselves it would not have covered nearly as many cases.

For us, the touch events were often failing for multiple seconds/minutes after any page loads on Windows. It feels like an eternity. Once the page recovers from whatever, touch events begin to work again. As ours was a Vue app, the full page reloads did not occur very often.

The patch from @obermillerk did the trick, at least until it is resolved in Electron proper.

[ghost]

@obermillerk this doesnt seem to be hardware issue, because opening IE or Chrome browser and trying to get the touch lag, I cant reproduce it. It only bugs out in an Electron app, everything else outside app works fine all the time.

I will try your blur/focus fix and report here. Your 200 line fix also didn't work for me.

[ghost]

@obermillerk focus/blur didnt work for me, here's what I tried
minimize:

mainWindow.blurWebView()
mainWindow.blur()
mainWindow.hide()
mainWindow.minimize()

after some time, maximize:

mainWindow.focusOnWebView()
mainWindow.focus()
mainWindow.show()
mainWindow.maximize()

[obermillerk]

@davismiculis unfortunate... I never tried doing it programmatically, I would just alt tab, but I assume the effects would be the same. I would ask again to try replicating with dev tools closed if you aren't already, and whether you're able to see touch events, but if my fix didn't work then likely you aren't getting touch events either, in which case you probably have a different issue. There were several other posts I found when investigating this that referenced an electron command line switch that you can enable that force enables touch capabilities, it didn't help me but maybe that will help you seeing that your issue seems different. Otherwise, I have no suggestions for you other than to look at other electron touch related issues or create your own, sorry.

[ghost]

@obermillerk nope, touch events arent logging, and alt+tabbing didnt help, I also tried this:

app.commandLine.appendSwitch('touch-events', 'enabled')
app.commandLine.appendSwitch('--enable-touch-events')

but didnt help either. Also note that touch freezes after rapidly changing and reloading pages, through website navigation bar. And touch also doesnt work in whole app, not just the webview where navigation occurs.

Also something else I tried, adding these parameters (there are more, just these are more relevant) to BrowserWindow:

acceptFirstMouse: true,
webPreferences: {
    plugins: true,
    webSecurity: false,
    blinkFeatures: 'TouchEventFeatureDetection,TouchpadAndWheelScrollLatching,UnifiedTouchAdjustment,Touch'
},
nodeIntegration: 'iframe'

[obermillerk]

Unfortunately anything more is beyond my knowledge, but this seems to be a totally different issue so I would suggest going to other threads or perhaps making your own, somebody else may be able to help you more than I can.

[ghost]

Most simple code to reproduce, create empty electron app with this code:

let electron = require('electron')

let mainWindow

electron.app.on('ready', function () {
    mainWindow = new electron.BrowserWindow()
    mainWindow.loadURL('https://www.businessinsider.com')
})

electron.app.on('window-all-closed', function () {
    if (process.platform !== 'darwin') {
        electron.app.quit()
    }
}

And then using touch screen rapidly tap on BusinessInsider header navbar buttons, until touch becomes unresponsive, clicking nav items using mouse and cursor still works.

It does seem to happen only in Electron, because when opening nw.js (Node Webkit) or desktop Chrome browser or any other browser and trying same thing, it doesn't behave like in Electron, it doesn't freeze.

[ghost]

Hi, is there any progress on this, is the bug aknowledged and/or recreated on other platforms, devices, anyone tried?

[ghost]

Hi, just wondering if anyone is fixing it?

[ghost]

Here is a video of Electron touch screen issue - https://media.giphy.com/media/SFKMgsJt7JSpqxR3FY/giphy.mp4

Also noticed that two finger gestures, like pinch-to-zoom unfreezes touch issue - https://media.giphy.com/media/nEQjDuteIxISqd38FB/giphy.mp4

We a re also offering bounty to whoever can fix this issue!

[akashnimare]

Can you folks reproduce this issue using the muon which is a forked version of electron -
https://github.com/brave/muon-quick

[ghost]

@akashnimare Trying at the moment. Do I just do this?

  "devDependencies": {
    "electron-prebuilt": "brave/electron-prebuilt",
    "electron-builder": "brave/electron-builder",
    "electron-packager": "brave/electron-packager"
  }

[akashnimare]

Okay, so @davismiculis just confirm that there is no touch issues when using the muon. So I think the bug lies in the Chromium and it should be automatically fixed once electron folks update the same (muon uses the latest chromium).
FYI, @sofianguy, @kevinsawicki.

[ghost]

Yes, using what I mentioned in previous comment, we now built our app using Brave fork of Electron and it doesnt have these touch issues. (There are other touch issues, a lot harder to reproduce) (Latest brave/muon with Chromium 6X doesnt have any touch issues at all)

[ckerr]

Can anyone confirm whether or not they're still seeing this issue in the Electron 2.0.x betas?

[akashnimare]

@ckerr I think @davismiculis used that version only (Electron 2.0.x).

[ghost]

@ckerr I tested it on Electron 1.7.x, 1.8.x and 2.0 beta 7, touch froze on all these versions.

[feichao]

I have the same issue...

<body>
  <div class="webview-container">
    <webview class="webview" preload="./preload.js" nodeintegration src="src/webviews/welcome/index.html"></webview>
    <webview class="webview" preload="./preload.js" nodeintegration src="src/webviews/launcher/index.html"></webview>
    <webview class="webview" preload="./preload.js" nodeintegration src="src/webviews/hotspot/index.html"></webview>
  </div>
</body>

The touchstart/touchmove/touchend event fired in the three webviews not fired in the parent body, but the click/mousedown/mouseup/mousemove event fired both the webviews and the parent body.

And my APP Version is "...Chrome/61.0.3163.100 Electron/2.0.1 Safari/537.36...", I have tried Electron/1.3 and Electron/1.4 and Electron/2.0.2, completely annihilated...

Finally, I use the ipc communication with preload and nodeintegration to solve my problem. Maybe you can try it... @vhopinto86

[mdanics]

Any updates on this? Facing this issue in Electron 2.0.2

[markonyango]

What device are you using?

[mdanics]

@markonyango happens on dell xps when using touch screen mode

[clintLandrum]

@feichao Could you provide some more info/code examples on how you solved this?

[feichao]

Sorry, I misunderstand the question. Actually, mine is more like #6563. But I have tested this question on my device, everything is OK. My electron version is 5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Electron/2.0.2 Safari/537.36.

[mijdavis2]

Similar issue. First touch on many buttons don't trigger the click. Here's the weird kicker, a double click will trigger the click twice.

For example, I have a button where it's click event triggers the save dialogue API: single-click => nothing; double click => two save dialogues pop up. This is on a Windows 10 tablet. Another kicker, it worked fine on an old Windows 8 tablet.

[zibra]

Same issue here. Is there any update?

[checkin247]

same issue with electron 2.0.8

[krokofant]

Not sure if this is already mentioned but I used pm2 to watch over the electron process and just restart it every two or four hours. It's not pretty but it works. Might abort someone's work though. On our project he issue occurred sporadically.

[checkin247]

had the same error with an app built with electron-forge on electron 2.0.8 running on W10
running the package with electron . worked fine
running app.exe the error occured after a few seconds
missing in depth knowledge I made a new build with electron-build using NSIS (instead electron-forge and windows.squirrel) what solved the problem with the click events using touch input device.
Hope this helps someone

[gliss]

I'm having similar issues where the touch would stop working on W10 machines. It happens randomly and with no common reasons. I can remotely connect to the device and click on buttons and it all works fine. To fix it I have to close the app and restart it. The other weird thing is is that even windows doesn't respond to touch ie swiping in from the side to switch between app.

Im a bit lost on where to go from here.

[2c2c]

To those of you with this issue: If you hold right click, does your left click events then register? In my case it does, and I'd like to confirm I'm experiencing the same issue described in this thread.

Thanks

[kaktuspalme]

I still have the error in v3.0.0-beta.10.
The only difference to previous versions is that I get a segmentation fault most of the time (no problems when using mouse instead of touch). If needed I could build a sample project and a short instruction on how to trigger.

[kaktuspalme]

I found a workaround which works nice for me in linux. Found the tool touchegg, you can find it on github. It eats all the touch inputs and you can define in a config file what should happen with those touch inputs.

I configured, that a tap with a single finger is the same as click and also configured that dragging with a single finger is the same as scrolling.

It has some drawbacks though. For example I have in one window a little x to close it, as it's not touch you have to point very precise to click it. But that's easy to solve, just made the area a little bigger and no problems at all.

But still, I hope the problem can be fixed in electron in the future. But for the moment I can live with it using touchegg.

Edit: I know this workaround is only useful if you have control over the devices but I wanted to share anyway, maybe someone has the same usecase as me.

[andrewjbxandrew]

Is there any update to this issue? I have our Electron app running full screen on W10 with Elo touchscreens. If you don't touch the screen for a while (4 or 5 hours) then the app stops registering touch. (you can see the touch is working with 'halo' effect and hear a motherboard beep however) I can also sort of drag the touch and highlight text elements on the Electron screen, but touch doesn't work. Rebooting the app solved the problem right away. If I remote into the machine during the 'frozen' state, I can still use the mouse to navigate around the app. Need to figure out how to fix this! Anyone have any more ideas?

[checkin247]

@andrewjbxandrew
I resolved it as stated here.
I believe the issue is related to the tool you use for building your application.

[carlokid]

I have the exact same issue as explained by @bourgondien here. The codefix from @obermillerk actually did the trick. Thank you very much! But seems it need additional handling for scrollbars.

Hope that electron team would apply fix soon.

[ronaknewtonsit]

@carlokid I have posted the solution here. Can you please try it?

[carlokid]

@carlokid I have posted the solution here. Can you please try it?

@ronaknewtonsit It is not the same issue as I'm not using a webview. The issue is explained thoroughly here

[carlokid]

This issue is from 2 years ago but still no fix :(