New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Backspace can not erase the last one character during Japanese IME conversion (macOS) #9173

Open
Thomas101 opened this Issue Apr 12, 2017 · 12 comments

Comments

Projects
None yet
@Thomas101
  • Electron version: 1.6.2, 1.6.6, not 1.4.16
  • Operating system: macOS 10.12.2 Sierra, macOS 10.12.4

Expected behavior

When inputting Japanese sentences using the Japanese IME (Input Method Editor) to convert alphabets to Japanese (CJK) characters you should be able to delete each character in turn by pressing backspace

Actual behavior

The very last character always needs two backspace presses

How to reproduce

  • Clone my version of electron starter
$ git clone https://github.com/wavebox/electron-quick-start -b japanese_delete_bug
$ npm install
$ npm start
  • Go to System preferences > Language & Region
  • Press the + to add a language and add Japanese (about a whole scroll down for me)
  • When prompted use your current language as the primary language
  • Launch the repository clone of quickstart (above)
  • Using the flag icon in the mac top bar change your current input method to Katakana
  • Click in the input field, type a few characters, then start hitting backspace
  • To delete the last character you have to hit backspace twice

Some other things about this I've found...

  • Remove the webview tag from the page and it works as expected (input field is not within the webview, but does also affect it there)
  • Issue is reproducible in 1.6.2 & 1.6.6 (maybe others inbetween)
  • Issue not apparent in 1.4.16
  • Some gifs of the behaviour in the original issue
@kevinsawicki

This comment has been minimized.

Show comment
Hide comment
@kevinsawicki

kevinsawicki Apr 24, 2017

Contributor

I reported a related issue upstream where when the input is inside the <webview> tag, two backspaces are required to delete the last character, https://bugs.chromium.org/p/chromium/issues/detail?id=714771

Contributor

kevinsawicki commented Apr 24, 2017

I reported a related issue upstream where when the input is inside the <webview> tag, two backspaces are required to delete the last character, https://bugs.chromium.org/p/chromium/issues/detail?id=714771

@kevinsawicki

This comment has been minimized.

Show comment
Hide comment
@kevinsawicki

kevinsawicki May 22, 2017

Contributor

This will be fixed in the next Electron release, 1.7.2

Contributor

kevinsawicki commented May 22, 2017

This will be fixed in the next Electron release, 1.7.2

@Thomas101

This comment has been minimized.

Show comment
Hide comment
@Thomas101

Thomas101 May 24, 2017

Awesome thank you :)

Awesome thank you :)

@kevinsawicki

This comment has been minimized.

Show comment
Hide comment
@kevinsawicki

kevinsawicki Jul 10, 2017

Contributor

Reopening this since the original fix introduced #9709 on 1.7.x.

Will revisit in 1.8.x since we can land further patches from upstream Chrome that have been applied since this original fix.

Contributor

kevinsawicki commented Jul 10, 2017

Reopening this since the original fix introduced #9709 on 1.7.x.

Will revisit in 1.8.x since we can land further patches from upstream Chrome that have been applied since this original fix.

@achimnol

This comment has been minimized.

Show comment
Hide comment
@achimnol

achimnol Jul 17, 2017

This seems to be affecting the current releases of Slack, Microsoft Teams, and some other Electron-based apps. Subscribing this issue with hopes to be fixed soon!

This seems to be affecting the current releases of Slack, Microsoft Teams, and some other Electron-based apps. Subscribing this issue with hopes to be fixed soon!

@gerges

This comment has been minimized.

Show comment
Hide comment
@gerges

gerges Oct 12, 2017

I'm having a hard time understanding the status of this issue. As far as i can tell this is fixed in 1.6.x, broken in 1.7.x, and ideally will be fixed again in 1.8.x? Is that correct?

gerges commented Oct 12, 2017

I'm having a hard time understanding the status of this issue. As far as i can tell this is fixed in 1.6.x, broken in 1.7.x, and ideally will be fixed again in 1.8.x? Is that correct?

@chenerzhang

This comment has been minimized.

Show comment
Hide comment

any update?

@chenerzhang

This comment has been minimized.

Show comment
Hide comment
@chenerzhang

chenerzhang Jan 26, 2018

You can test this way. My trouble is Chinese IME and this can help me solve this problem on mac.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Hello World!</title>
  <style>
    *,
    *::before,
    *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html,
    body {
      width: 100%;
      height: 100%;
    }

    body {
      display: flex;
      flex-direction: column;
    }

    webview {
      flex: 1;
      width: 100%;
    }

    input {
      height: 300px;
    }
  </style>
</head>

<body>
  <textarea rows="10" id="input"></textarea>
  <webview src="https://www.google.com"></webview>
  <script>
    // You can also require other files to run in this process
    require('./renderer.js');
    const { exec, spawn } = require('child_process');

    const $input = document.querySelector('#input');
    let inputTimeStamp = 0;
    let inputNums = 0;
    let delta = 1;
    let backspaceKeydownTimestamp = 0;
    $input.addEventListener('input', (e) => {
      inputTimeStamp = e.timeStamp;
      inputNums += delta;
    });
    $input.addEventListener('keyup', (e) => {
      if (e.key === 'Backspace') {
        let deleteFlag = false;
        // slow delete detect
        if (inputTimeStamp === -1) {
          deleteFlag = true;
          delta = 1;
          inputTimeStamp = 0;
          exexDelete();
        }
        // quick delete detect
        if (!deleteFlag && inputNums === 1 && e.timeStamp - backspaceKeydownTimestamp < 60) {
          inputNums = 0;
          exexDelete();
        }
      }
      inputTimeStamp = -1;
    });
    $input.addEventListener('keydown', (e) => {
      if (e.key === 'Backspace') {
        backspaceKeydownTimestamp = e.timeStamp;
        delta = -1;
      } else {
        delta = 1;
      }
    });
    $input.addEventListener('compositionstart', () => {
      inputTimeStamp = 0;
      inputNums = 0;
      delta = 1;
      backspaceKeydownTimestamp = 0;
    });
    function exexDelete() {
      const ps = spawn('osascript');
      ps.stdin.write(`
      tell application "System Events"
        keystroke ascii character 8
      end tell
      `);
      ps.stdin.end();
    }
  </script>
</body>

</html>

You can test this way. My trouble is Chinese IME and this can help me solve this problem on mac.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Hello World!</title>
  <style>
    *,
    *::before,
    *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html,
    body {
      width: 100%;
      height: 100%;
    }

    body {
      display: flex;
      flex-direction: column;
    }

    webview {
      flex: 1;
      width: 100%;
    }

    input {
      height: 300px;
    }
  </style>
</head>

<body>
  <textarea rows="10" id="input"></textarea>
  <webview src="https://www.google.com"></webview>
  <script>
    // You can also require other files to run in this process
    require('./renderer.js');
    const { exec, spawn } = require('child_process');

    const $input = document.querySelector('#input');
    let inputTimeStamp = 0;
    let inputNums = 0;
    let delta = 1;
    let backspaceKeydownTimestamp = 0;
    $input.addEventListener('input', (e) => {
      inputTimeStamp = e.timeStamp;
      inputNums += delta;
    });
    $input.addEventListener('keyup', (e) => {
      if (e.key === 'Backspace') {
        let deleteFlag = false;
        // slow delete detect
        if (inputTimeStamp === -1) {
          deleteFlag = true;
          delta = 1;
          inputTimeStamp = 0;
          exexDelete();
        }
        // quick delete detect
        if (!deleteFlag && inputNums === 1 && e.timeStamp - backspaceKeydownTimestamp < 60) {
          inputNums = 0;
          exexDelete();
        }
      }
      inputTimeStamp = -1;
    });
    $input.addEventListener('keydown', (e) => {
      if (e.key === 'Backspace') {
        backspaceKeydownTimestamp = e.timeStamp;
        delta = -1;
      } else {
        delta = 1;
      }
    });
    $input.addEventListener('compositionstart', () => {
      inputTimeStamp = 0;
      inputNums = 0;
      delta = 1;
      backspaceKeydownTimestamp = 0;
    });
    function exexDelete() {
      const ps = spawn('osascript');
      ps.stdin.write(`
      tell application "System Events"
        keystroke ascii character 8
      end tell
      `);
      ps.stdin.end();
    }
  </script>
</body>

</html>
@zjfjiayou

This comment has been minimized.

Show comment
Hide comment
@zjfjiayou

zjfjiayou Jan 29, 2018

I have encountered the same problem in this version 1.7.11. The language is Chinese.

I have encountered the same problem in this version 1.7.11. The language is Chinese.

@fateleak

This comment has been minimized.

Show comment
Hide comment
@fateleak

fateleak Feb 13, 2018

same problem on 1.7.10, Chinese

same problem on 1.7.10, Chinese

@kenan2002

This comment has been minimized.

Show comment
Hide comment
@kenan2002

kenan2002 Apr 11, 2018

I'm in trouble with this issue, too.
I see that this issue has been fixed in Electron 2.0 beta which is based on Chromium 61. Is there any plan on an Electron 1.x version based on Chromium 61 or above so that we can fix this issue without any impact of breaking-changed API?

I'm in trouble with this issue, too.
I see that this issue has been fixed in Electron 2.0 beta which is based on Chromium 61. Is there any plan on an Electron 1.x version based on Chromium 61 or above so that we can fix this issue without any impact of breaking-changed API?

@shadeofgod

This comment has been minimized.

Show comment
Hide comment
@shadeofgod

shadeofgod Apr 11, 2018

Yes, we really need this to be fixed, pls make it happen in 1.8.x if possible, plsssssssssss
🙇

Yes, we really need this to be fixed, pls make it happen in 1.8.x if possible, plsssssssssss
🙇

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment