Update network error screen |
||||||||||||||||||||
Issue descriptionThe network error screen we show to users in various scenarios including disconnect during OOBE should be updated to match our new visual language. We need to preserve all functionality that it currently offers. Namely: - Select a network - Visit network sign-in page - Adjust proxy settings - Browse as guest Current screen can be seen at https://screenshot.googleplex.com/wXxSPebbyXU.png Assigning to elizabeth for now for VisD spec.
,
Feb 6 2017
I get a 404 on the screenshot too.
,
Feb 6 2017
That's what I get for trying to upload an image via plane Wi-Fi, I'll attach directly here once I'm on the ground :)
,
Mar 3 2017
,
Mar 3 2017
,
Mar 16 2017
,
Mar 24 2017
Looks good Elizabeth! The one thing we're missing is the drop down for selecting a different network, could you add that as well? I'd ask our writer about shortening strings, not sure where we can cut them down.
,
Mar 24 2017
We have moved away from a network select dropdown in the Settings and OOBE UI. The dropdown had lots of problems and it is not something we would like to maintain. Since this is OOBE UI we should direct users to the network select page instead. (We can provide a link to that).
,
Mar 24 2017
SGTM, Elizabeth could you add that link to the mock/spec?
,
Mar 24 2017
In the mock, we have "network's sign in page" and "proxy settings" links. Just want to know where to put the link (same location as the previous design?)and should it be named "Network select page" or "select a new network"?
,
Apr 4 2017
Re #8, #10: The same error screen is used during creating new user flow (which is not OOBE), when no "network selection dialog" is available. We likely need to integrate network selection to the new error screen. It can be a hidden part of the Error screen (like both Welcome dialog and Network selection dialogs are parts of the same "OOBE network screen"), but we still need design for it. Re #12: "network's sign in page" and "proxy settings" are different from "network selection", otherwise we would not have them as links in the old UI. Why do we need link, when we can use button for it? What does "Next" button mean?
,
Apr 4 2017
Thanks Alexander. Elizabeth - are there changes to the design of the OOBE network screen for the version that will appear here that you would make, or should the design be identical? Let's make it "Select a new network". It should be a link or button in the same place that the dropdown is today. Elizabeth, up to you whether link or button. We should remove the "Next" button, it doesn't have an action here.
,
Apr 4 2017
There's a version of this dialog that appears when you've disabled Settings > Manage other users > "Show usernames and photos on the sign-in screen" (that is, disable user pods), then restart with wireless turned off (see screenshot). Besides different text, it also has the "sign in as an existing user" link. Is that version of the dialog getting covered by this update?
,
Apr 5 2017
Yes, we should cover that as well. Greg and Alexander, do we have a way to know all the different possible permutations of this dialog?
,
Apr 6 2017
Looking into its source https://cs.chromium.org/chromium/src/chrome/browser/resources/chromeos/login/screen_error_message.html I can only say that it has specific parts for captive portal, kiosk, update rollback (Chrome is unable to revert to the previously installed version. Please try again to Powerwash your device.), proxy, "Local State" error, supervised users and enrollment failures.
,
Apr 6 2017
This may not be exhaustive, as there may be paths into it I missed, but here's what I came up with.... In screen_error_message.html, the page is identified as id="error-message" https://cs.chromium.org/chromium/src/chrome/browser/resources/chromeos/login/screen_error_message.html?q=id%3D"error-message" which is also found in kScreenNames enumeration https://cs.chromium.org/chromium/src/chrome/browser/chromeos/login/oobe_screen.cc?q=%5C"error-message%5C" which maps to SCREEN_ERROR_MESSAGE in OobeScreen enumeration https://cs.chromium.org/chromium/src/chrome/browser/chromeos/login/oobe_screen.h?type=cs&q=SCREEN_ERROR_MESSAGE As best I can tell, all uses of SCREEN_ERROR_MESSAGE lead to the ErrorScreen class: https://cs.chromium.org/chromium/src/chrome/browser/chromeos/login/screens/error_screen.h?type=cs&q=ErrorScreen&l=27 Here you can see the interface through which various components of the error screen are manipulated. With a few exceptions, all access to ErrorScreen seem to go through WizardController::GetErrorScreen(): https://cs.chromium.org/chromium/src/chrome/browser/chromeos/login/wizard_controller.cc?type=cs&q=WizardController::GetErrorScreen()&l=352 It would take awhile longer to chase down all the uses of that function. The aforementioned exceptions not using WizardController are listed below. In each case, you can see how ErrorScreen is used to set up the particular behavior of the Network Error page. SigninScreenHandler::SetupAndShowOfflineMessage(): https://cs.chromium.org/chromium/src/chrome/browser/ui/webui/chromeos/login/signin_screen_handler.cc?type=cs&q=error_screen_&l=888 EnrollmentScreenHandler::SetupAndShowOfflineMessage(): https://cs.chromium.org/chromium/src/chrome/browser/ui/webui/chromeos/login/enrollment_screen_handler.cc?type=cs&q=error_screen_&l=460 AppLaunchSplashScreenHandler::ShowNetworkConfigureUI(): https://cs.chromium.org/chromium/src/chrome/browser/ui/webui/chromeos/login/app_launch_splash_screen_handler.cc?type=cs&q=error_screen_&l=132 More hunting is needed to enumerate all uses of the page, but maybe with ErrorScreen and these examples, you can at least determine all the ways the page can be arranged.
,
Apr 6 2017
Here is the spec and the assets
,
Apr 20 2017
Okay, looking at the different arrangements, it doesn't appear there's a case where we'd have more content than can fit between the title and the image. Let's continue to use all of the existing strings for this, with the exception of "Select a new network" which becomes a link to network select page instead of a drop-down. These strings should be styled per Elizabeth's mock above. Assigning to rkc@ to pick an eng owner.
,
Apr 26 2017
,
Aug 15 2017
Note: When updating the UI, for the network selection UI we should use Polymer elements from ui/webui/resources/cr_elements/chromeos/network/ and eliminate the dependency on network_dropdown.cc/network_menu.cc (which should be deprecated). Ideally we should just direct users to the oobe network selection screen rather than duplicating the UI.
,
Aug 16 2017
,
Aug 16 2017
,
Aug 16 2017
,
Aug 16 2017
,
Mar 5 2018
What's the current target for this, 67? 68?
,
Mar 5 2018
I think this mostly got done with the exception of the illustration - Alexander was there more outstanding work?
,
Mar 6 2018
There are still references to 'ui.DropDown' and 'network-list' in the code, but that may be to support the old UI and will be cleaned up with issue 728805?
,
Mar 27 2018
Any update on this?
,
Mar 27 2018
We don't use the "classic-style" error screen, but we do not have alternative for network dropdown right now. We do not have design for "Network's sign-in page" which is mentioned in the mocks above, so current MD-version is still using network dropdown. The MD-version was implemented within the issue 755674 . As described above, we should probably make it P3.
,
Mar 28 2018
This is going to block removal of a lot of difficult to maintain code. zalcorn@, can we get some UX cycles for a page that looks more like the OOBE network select page?
,
Mar 28 2018
Steven, how urgent is that removal? I will work with Jenn's team to prioritize.
,
Mar 28 2018
I very much want to deprecate the networking code that supports this UI in 68. I can do it with the existing code, but it's going to be extra work, whereas the UI we use in the OOBE flow is consistent with Settings and should just drop in.
,
Apr 9 2018
,
May 22 2018
zalcorn@ - I am planning to address this for 69. This is blocking issue 728806 which is blocking Mash. If we don't have an explicit UX design I will just replace: Please connect to the internet to sign in to your Chromebook: Select a network: [Deprecated Dropdown] With the same network select UI from OOBE.
,
May 23 2018
stevenjb@ will that replacement continue to support the various error messages in #17 and #18?
,
May 23 2018
I will make sure we do not loose any of those details, but thanks for pointing that out.
,
May 23 2018
Cool, in that case the replacement sgtm.
,
May 25 2018
,
May 25 2018
,
May 25 2018
,
May 25 2018
Hey Steven, that looks good to me. Elizabeth, any changes you'd like to see? If not, I'll shoot this to UI review for a quick approval.
,
Jun 1 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/872ba2c13a6d4046847234d1a49e4a53167e8c09 commit 872ba2c13a6d4046847234d1a49e4a53167e8c09 Author: Steven Bennetts <stevenjb@chromium.org> Date: Fri Jun 01 21:40:19 2018 Oobe/login: Move cr-network-select handling code to a separate element This will allow us to use the same styling and handlers in the login error screen (screen_error_message.html). Bug: 689198 Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation Change-Id: I68a2e85cfeebb374b455cee42fc7947349f76af7 Reviewed-on: https://chromium-review.googlesource.com/1073668 Commit-Queue: Steven Bennetts <stevenjb@chromium.org> Reviewed-by: Alexander Alekseev <alemate@chromium.org> Cr-Commit-Position: refs/heads/master@{#563808} [modify] https://crrev.com/872ba2c13a6d4046847234d1a49e4a53167e8c09/chrome/browser/resources/chromeos/login/custom_elements_oobe.html [modify] https://crrev.com/872ba2c13a6d4046847234d1a49e4a53167e8c09/chrome/browser/resources/chromeos/login/custom_elements_oobe.js [add] https://crrev.com/872ba2c13a6d4046847234d1a49e4a53167e8c09/chrome/browser/resources/chromeos/login/network_select_login.html [add] https://crrev.com/872ba2c13a6d4046847234d1a49e4a53167e8c09/chrome/browser/resources/chromeos/login/network_select_login.js [modify] https://crrev.com/872ba2c13a6d4046847234d1a49e4a53167e8c09/chrome/browser/resources/chromeos/login/oobe_welcome.html [modify] https://crrev.com/872ba2c13a6d4046847234d1a49e4a53167e8c09/chrome/browser/resources/chromeos/login/oobe_welcome.js
,
Jun 1 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/18c1610ff296b58f70b41b3332d1d5a93b311c85 commit 18c1610ff296b58f70b41b3332d1d5a93b311c85 Author: Steven Bennetts <stevenjb@chromium.org> Date: Fri Jun 01 23:43:43 2018 Use network-select-login in screen_error_message Bug: 689198 Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation Change-Id: If0879df11a8bb8e3920c4e1d513997953e51da8e Reviewed-on: https://chromium-review.googlesource.com/1073750 Commit-Queue: Steven Bennetts <stevenjb@chromium.org> Reviewed-by: Alexander Alekseev <alemate@chromium.org> Cr-Commit-Position: refs/heads/master@{#563865} [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/custom_elements_login.html [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/custom_elements_login.js [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/network_select_login.html [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/network_select_login.js [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/oobe_welcome.html [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/oobe_welcome.js [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/screen_error_message.css [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/screen_error_message.html [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/resources/chromeos/login/screen_error_message.js [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/browser/ui/webui/chromeos/login/error_screen_handler.cc [modify] https://crrev.com/18c1610ff296b58f70b41b3332d1d5a93b311c85/chrome/test/data/chromeos/oobe_webui_browsertest.js
,
Jun 11 2018
,
Jun 14 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d commit 532f32af88dfffe2b849eaeb641a45dc6f9f5c8d Author: Steven Bennetts <stevenjb@chromium.org> Date: Thu Jun 14 04:12:13 2018 OOBE: Eliminate non MD network select UI This CL also fixes a bug where selecting a connected network in an error screen during login would continue instead of opening the configuration UI (e.g. to set a proxy). For dead code removal from device_local_account_browsertest.cc: Bug: 689198 Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation Change-Id: I91250b264c2f42e40ab647aaef364154eb367413 TBR: pmarko@chromium.org Reviewed-on: https://chromium-review.googlesource.com/1083672 Commit-Queue: Steven Bennetts <stevenjb@chromium.org> Reviewed-by: Alexander Alekseev <alemate@chromium.org> Cr-Commit-Position: refs/heads/master@{#567129} [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/chromeos/login/screens/network_screen.cc [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/chromeos/login/wizard_controller_browsertest.cc [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/chromeos/policy/device_local_account_browsertest.cc [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/resources/chromeos/login/network_select_login.js [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/resources/chromeos/login/oobe.js [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/resources/chromeos/login/oobe_screen_network.css [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/resources/chromeos/login/oobe_screen_network.html [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/resources/chromeos/login/oobe_screen_network.js [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/browser/resources/chromeos/login/screen_error_message.html [modify] https://crrev.com/532f32af88dfffe2b849eaeb641a45dc6f9f5c8d/chrome/test/data/chromeos/oobe_webui_browsertest.js
,
Jun 18 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/43da8c877ece944d2bcf957c78e30f6bf803a337 commit 43da8c877ece944d2bcf957c78e30f6bf803a337 Author: Steven Bennetts <stevenjb@chromium.org> Date: Mon Jun 18 22:41:49 2018 Elim network_menu and network_dropdown This CL removes the unused network_dropdown.js and related C++ support classes including network_menu.cc. It also includes some related cleanup. Bug: 689198 , 728806 Cq-Include-Trybots: luci.chromium.try:closure_compilation Change-Id: Ieb1e97ce4c4308874f8c977f4d6290a0d91bf15d Reviewed-on: https://chromium-review.googlesource.com/1083173 Commit-Queue: Steven Bennetts <stevenjb@chromium.org> Reviewed-by: Alexander Alekseev <alemate@chromium.org> Reviewed-by: Toni Barzic <tbarzic@chromium.org> Cr-Commit-Position: refs/heads/master@{#568205} [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/app/chromeos_strings.grdp [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/chromeos/BUILD.gn [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/chromeos/login/screens/error_screen.cc [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/chromeos/login/screens/error_screen.h [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/chromeos/status/DEPS [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/chromeos/status/network_menu.cc [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/chromeos/status/network_menu.h [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/resources/chromeos/keyboard/keyboard_utils.js [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/resources/chromeos/login/login_non_lock_shared.html [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/resources/chromeos/login/login_non_lock_shared.js [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/resources/chromeos/login/network_dropdown.css [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/resources/chromeos/login/network_dropdown.js [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/BUILD.gn [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/DEPS [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/error_screen_handler.cc [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/error_screen_handler.h [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/ui/webui/chromeos/login/network_dropdown.cc [delete] https://crrev.com/d23f70bf0c8fb72521a5609a6df193ca377054d5/chrome/browser/ui/webui/chromeos/login/network_dropdown.h [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/network_dropdown_handler.cc [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/network_dropdown_handler.h [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/network_screen_handler.cc [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/oobe_ui.cc [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/chrome/browser/ui/webui/chromeos/login/oobe_ui.h [modify] https://crrev.com/43da8c877ece944d2bcf957c78e30f6bf803a337/ui/login/display_manager.js |
||||||||||||||||||||
►
Sign in to add a comment |
||||||||||||||||||||
Comment 1 by steve...@chromium.org
, Feb 6 2017