{"action":"created","issue":{"url":"https://api.github.com/repos/Automattic/wp-calypso/issues/25419","repository_url":"https://api.github.com/repos/Automattic/wp-calypso","labels_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/25419/labels{/name}","comments_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/25419/comments","events_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/25419/events","html_url":"https://github.com/Automattic/wp-calypso/pull/25419","id":331274358,"node_id":"MDExOlB1bGxSZXF1ZXN0MTk0MDQ1OTk0","number":25419,"title":"Framework: Enable babel-polyfill so login form works on older browsers","user":{"login":"jblz","id":1587282,"node_id":"MDQ6VXNlcjE1ODcyODI=","avatar_url":"https://avatars2.githubusercontent.com/u/1587282?v=4","gravatar_id":"","url":"https://api.github.com/users/jblz","html_url":"https://github.com/jblz","followers_url":"https://api.github.com/users/jblz/followers","following_url":"https://api.github.com/users/jblz/following{/other_user}","gists_url":"https://api.github.com/users/jblz/gists{/gist_id}","starred_url":"https://api.github.com/users/jblz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jblz/subscriptions","organizations_url":"https://api.github.com/users/jblz/orgs","repos_url":"https://api.github.com/users/jblz/repos","events_url":"https://api.github.com/users/jblz/events{/privacy}","received_events_url":"https://api.github.com/users/jblz/received_events","type":"User","site_admin":false},"labels":[{"id":285009988,"node_id":"MDU6TGFiZWwyODUwMDk5ODg=","url":"https://api.github.com/repos/Automattic/wp-calypso/labels/Framework","name":"Framework","color":"c5def5","default":false},{"id":580728718,"node_id":"MDU6TGFiZWw1ODA3Mjg3MTg=","url":"https://api.github.com/repos/Automattic/wp-calypso/labels/Login","name":"Login","color":"006b75","default":false},{"id":285010018,"node_id":"MDU6TGFiZWwyODUwMTAwMTg=","url":"https://api.github.com/repos/Automattic/wp-calypso/labels/[Status]%20Needs%20Review","name":"[Status] Needs Review","color":"fbca04","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":16,"created_at":"2018-06-11T17:10:32Z","updated_at":"2018-06-14T17:16:47Z","closed_at":null,"author_association":"MEMBER","pull_request":{"url":"https://api.github.com/repos/Automattic/wp-calypso/pulls/25419","html_url":"https://github.com/Automattic/wp-calypso/pull/25419","diff_url":"https://github.com/Automattic/wp-calypso/pull/25419.diff","patch_url":"https://github.com/Automattic/wp-calypso/pull/25419.patch"},"body":"Fixes #25325\r\n\r\nWithout these polyfills in place, UC Browser Mini (& perhaps other browsers) is not working in Calypso (seemingly) at all.\r\n\r\nReact doesn't pick up client-side to actually make the page interactive, so all the client shows is what's rendered server-side.\r\n\r\nTaking a look at the [JavaScript Environment Requirements](https://reactjs.org/docs/javascript-environment-requirements.html) page:\r\n\r\n> React 16 depends on the collection types Map and Set. If you support older browsers and devices which may not yet provide these natively (e.g. IE < 11) or which have non-compliant implementations (e.g. IE 11), consider including a global polyfill in your bundled application, such as core-js or babel-polyfill.\r\n\r\nThis change does precisely that.\r\n\r\n---\r\n\r\nAt `/log-in`\r\n\r\nBefore:\r\n\r\nForm fields are disabled and never become interactive:\r\n![screen shot 2018-06-11 at 12 31 21 pm](https://user-images.githubusercontent.com/1587282/41245562-553d50cc-6d76-11e8-82a5-de39751bfc16.png)\r\n\r\nAfter:\r\n\r\nForm fields become enabled and functional after calypso boots:\r\n![screen shot 2018-06-11 at 12 52 24 pm](https://user-images.githubusercontent.com/1587282/41245627-836be486-6d76-11e8-8ecc-811bd4548f0f.png)\r\n\r\n---\r\n\r\n## TO TEST\r\n\r\n### Test on all \"supported\" browsers (Chrome, Firefox, Safari, Edge, etc.)\r\n\r\nEverything should \"still work\" ;)\r\n\r\n### Test on older browsers\r\n\r\nMy setup is as follows:\r\n* Android Studio 3.1\r\n* Virtual Device with `Android 4.4 (Google APIs)` (Use `Tools | AVD Manager` to configure one for yourself)\r\n* Run the AVD with the ability to modify your hosts file ([Ref](https://stackoverflow.com/a/47622017))\r\n* Push a hosts file like the following:\r\n\r\n```\r\n127.0.0.1               localhost\r\n192.168.0.111           calypso.dev\r\n1.2.3.4           public-api.wordpress.com wordpress.com\r\n```\r\n\r\n(Where `192.168.0.111` is your local machine's \"real\" IP address on your local network (or some other address the emulator can access where your calypso server is running & `1.2.3.4` is your WordPress.com sandbox)\r\n\r\n* Download the Android UC Browser Mini apk from the [official site](http://www.ucweb.com/ucbrowser/download/).\r\n* [Install](https://developer.android.com/studio/command-line/adb#move) the apk: `adb install ~/Downloads/UCBrowser_V10.9.0.946_android_pf139_\\(Build1805171001\\).apk`\r\n* Run this branch\r\n* In the android emulator:\r\n  * Open `UC Mini`\r\n  * Dismiss the \"splash\" list of features\r\n  * Disable `Speed Mode` (so you can access a local IP address)\r\n    * Tap the 3 horizontal line button (\"hamburger menu\")\r\n    * Tap `Speed Mode`\r\n  * Browse to http://calypso.dev:3000/log-in\r\n\r\n**IMPORTANT NOTE:** In order to actually log in, you'll need to add http://calypso.dev:3000 to the list of allowed origins in the endpoint. Ping me if you need help with this part."},"comment":{"url":"https://api.github.com/repos/Automattic/wp-calypso/issues/comments/397371790","html_url":"https://github.com/Automattic/wp-calypso/pull/25419#issuecomment-397371790","issue_url":"https://api.github.com/repos/Automattic/wp-calypso/issues/25419","id":397371790,"node_id":"MDEyOklzc3VlQ29tbWVudDM5NzM3MTc5MA==","user":{"login":"mattwondra","id":518059,"node_id":"MDQ6VXNlcjUxODA1OQ==","avatar_url":"https://avatars3.githubusercontent.com/u/518059?v=4","gravatar_id":"","url":"https://api.github.com/users/mattwondra","html_url":"https://github.com/mattwondra","followers_url":"https://api.github.com/users/mattwondra/followers","following_url":"https://api.github.com/users/mattwondra/following{/other_user}","gists_url":"https://api.github.com/users/mattwondra/gists{/gist_id}","starred_url":"https://api.github.com/users/mattwondra/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mattwondra/subscriptions","organizations_url":"https://api.github.com/users/mattwondra/orgs","repos_url":"https://api.github.com/users/mattwondra/repos","events_url":"https://api.github.com/users/mattwondra/events{/privacy}","received_events_url":"https://api.github.com/users/mattwondra/received_events","type":"User","site_admin":false},"created_at":"2018-06-14T17:16:47Z","updated_at":"2018-06-14T17:16:47Z","author_association":"CONTRIBUTOR","body":"> Unless Directly is running purely inside an iframe, it _could_ be affected.\r\n\r\nGreat point, thanks. The vast majority of the code does run in an iframe, but there's a small script we're loading in the main execution environment that provides a thin handler into Directly (and loads the iframe).\r\n\r\nI've tested Directly myself without any issue, so I think we're in the clear."}}
{"actor":{"display_login":"mattwondra"}}