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

Can't enter more than one character in Edge browser #79

Merged
merged 6 commits into from
Dec 1, 2016

Conversation

joelove
Copy link
Contributor

@joelove joelove commented Dec 1, 2016

This is a fix for this issue: #75

In the end, I had to go with user agent sniffing even though it's a really ugly solution and will cause a breakage when Microsoft finally get their **** together. Anything else was causing unexpected behaviour in other browsers. But it will solve the problem for 99% of users for now.

I did attempt to use feature detection, but it turns out detecting built-in browser events is a really complicated process and I really didn't want to introduce Modernizr just for this.

I also wasn't able to write unit tests for this because I couldn't find a way to make React DOM spoof the user agent and I couldn't find any documentation on how to manually configure PhantomJS on the fly in this test suite configuration.

Tested in:

  • Mac OS X (El Capitan)
    • Chrome
    • Firefox
    • Safari
  • Windows 10
    • Edge
    • Chrome
  • Android (5.1.1)
    • Android browser
    • Chrome
  • iOS (10.0.2)
    • Safari
    • Chrome

@joelove joelove changed the title WIP: Can't enter more than one character in Edge browser Can't enter more than one character in Edge browser Dec 1, 2016
@iamdustan
Copy link
Collaborator

Let’s try it out! Thanks!

@iamdustan iamdustan merged commit fa0b07e into insin:master Dec 1, 2016
@KittyGiraudel
Copy link

This PR broke the build when run on the server. navigator is not defined. :(

@avindra
Copy link
Contributor

avindra commented Dec 12, 2016

@hugogiraudel : You can add a hack to mock navigator on the server side to get around this. For Koa, it would be:

global.navigator = { userAgent : ctx.request.headers['user-agent'] };

Put that in the route handler that does your SSR (probably your * handler)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants