Skip to content
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

Unable to click within an input in IE #463

Closed
ehkasper opened this issue May 23, 2016 · 9 comments
Closed

Unable to click within an input in IE #463

ehkasper opened this issue May 23, 2016 · 9 comments

Comments

@ehkasper
Copy link

@ehkasper ehkasper commented May 23, 2016

Thanks for such a hard work!

When there is some text in an input box, users aren't able to click within a text box to make edits, they need to delete from the end. I could reproduce it in IE 9 and 10.

Also, for Win10 - Internet Explorer 11, I cannot focus inputs on the first click, but double-clicking works. Check the gif:

dnd

Im using your simple example with added inputs

@kesne
Copy link
Collaborator

@kesne kesne commented Aug 20, 2016

I don't have a windows computer so this is going to be a challenge to debug :/

@kesne kesne removed the triage label Aug 20, 2016
@ehkasper
Copy link
Author

@ehkasper ehkasper commented Aug 22, 2016

@kesne thanks for your response :) Yeah, I gave it a try but i dont have a windows machine either... it's a very tricky bug, but i dont know whether it's an event error on IE or IE rendering... anyway, im not sure how to debug this properly 😞

@ehkasper
Copy link
Author

@ehkasper ehkasper commented Oct 20, 2016

@kesne hey! would you have any insights of a way to debug it and where to find this bug? Unfortunately, I dont think im skilled enough for doing so, so if you can sort of tell me how to debug and fix this i could give it a try.

@dillius
Copy link

@dillius dillius commented Jul 12, 2017

I believe I am experiencing a similar issue for input boxes which are children of a draggable component. It is necessary to double click to get a cursor in any of these input boxes in IE11 or Edge. Also makes it impossible to click and drag to select text in the input boxes.

@mahlero
Copy link

@mahlero mahlero commented Sep 8, 2017

This is a known bug in IE10, IE11 and Edge and was reported to MS in 2014 but it seems that MS does not want/is not able to fix it: https://connect.microsoft.com/IE/feedback/details/927470/ie-11-input-field-of-type-text-does-not-respond-to-mouse-clicks-when-ancestor-node-has-draggable-true and https://stackoverflow.com/a/27160905

@drewjenkins
Copy link

@drewjenkins drewjenkins commented Dec 4, 2017

I was able to get around this by only connecting the drag source when not hovering the input.

  render() {
    const content = (
      <div>
        <input
           ...restOfProps
           onMouseOver={ () => this.setState({ dragSourceEnabled: false }); }
           onMouseOut={ () => this.setState({ dragSourceEnabled: true }); }
        />
      </div>
    );
   
    return this.state.dragSourceEnabled ? this.props.connectDragSource(content) : content;
  }
@nstrelow
Copy link

@nstrelow nstrelow commented Dec 21, 2017

Are there any other ways of resolving this?
How is the state of this issue?

@ramusus
Copy link

@ramusus ramusus commented Dec 21, 2017

I'm using workaround:

<input ... onMouseDown={ (e) => e.target.focus(); }/>

tested in IE11

@stale
Copy link

@stale stale bot commented Jul 6, 2019

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the wontfix label Jul 6, 2019
@stale stale bot closed this Jul 13, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
7 participants