oobe: add tests for debug overlay

Bug: 1073095
Change-Id: I505c982ee92bf7ef4c58f419989ee64e3a50415c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2260601Reviewed-by: Renato Silva <rrsilva@google.com>
Commit-Queue: Denis Kuznetsov [CET] <antrim@chromium.org>
Cr-Commit-Position: refs/heads/master@{#781788}

chrome/browser/chromeos/login/debug_overlay_browsertest.cc

+// Copyright 2020 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+#include "ash/public/cpp/login_screen_test_api.h"
+#include "base/bind.h"
+#include "base/command_line.h"
+#include "base/strings/strcat.h"
+#include "chrome/browser/chromeos/login/test/device_state_mixin.h"
+#include "chrome/browser/chromeos/login/test/js_checker.h"
+#include "chrome/browser/chromeos/login/test/login_manager_mixin.h"
+#include "chrome/browser/chromeos/login/test/oobe_base_test.h"
+#include "chrome/browser/chromeos/login/test/test_condition_waiter.h"
+#include "chromeos/constants/chromeos_switches.h"
+#include "content/public/test/browser_test.h"
+
+namespace chromeos {
+
+namespace {
+
+constexpr char kDebugButton[] = "invokeDebuggerButton";
+constexpr char kDebugOverlay[] = "debuggerOverlay";
+constexpr char kScreensPanel[] = "DebuggerPanelScreens";
+
+constexpr int kOobeScreensCount = 34;
+constexpr int kLoginScreensCount = 29;
+
+std::string ElementsInPanel(const std::string& panel) {
+  return base::StrCat({"$('", panel, "').children.length"});
+}
+
+}  // namespace
+
+class DebugOverlayTest : public OobeBaseTest {
+ public:
+  DebugOverlayTest() {}
+
+  ~DebugOverlayTest() override = default;
+
+  void SetUpCommandLine(base::CommandLine* command_line) override {
+    command_line->AppendSwitch(::chromeos::switches::kShowOobeDevOverlay);
+    OobeBaseTest::SetUpCommandLine(command_line);
+  }
+};
+
+class DebugOverlayOnLoginTest : public DebugOverlayTest {
+ public:
+  DebugOverlayOnLoginTest() { login_mixin_.AppendRegularUsers(1); }
+
+ private:
+  DeviceStateMixin device_state_{
+      &mixin_host_, DeviceStateMixin::State::OOBE_COMPLETED_CONSUMER_OWNED};
+  LoginManagerMixin login_mixin_{&mixin_host_};
+};
+
+IN_PROC_BROWSER_TEST_F(DebugOverlayTest, HideAndShow) {
+  test::OobeJS().ExpectHidden(kDebugOverlay);
+  test::OobeJS().ExpectVisible(kDebugButton);
+  test::OobeJS().ClickOn(kDebugButton);
+  test::OobeJS().CreateVisibilityWaiter(true, kDebugOverlay)->Wait();
+  test::OobeJS().ExpectVisible(kDebugButton);
+  test::OobeJS().ClickOn(kDebugButton);
+  test::OobeJS().CreateVisibilityWaiter(false, kDebugOverlay)->Wait();
+}
+
+IN_PROC_BROWSER_TEST_F(DebugOverlayTest, ExpectScreenButtonsCount) {
+  test::OobeJS().ExpectHidden(kDebugOverlay);
+  test::OobeJS().ExpectVisible(kDebugButton);
+  test::OobeJS().ClickOn(kDebugButton);
+  test::OobeJS().CreateVisibilityWaiter(true, kDebugOverlay)->Wait();
+  test::OobeJS().ExpectEQ(ElementsInPanel(kScreensPanel), kOobeScreensCount);
+}
+
+IN_PROC_BROWSER_TEST_F(DebugOverlayOnLoginTest, ExpectScreenButtonsCount) {
+  ASSERT_TRUE(ash::LoginScreenTestApi::ClickAddUserButton());
+  WaitForOobeUI();
+  test::OobeJS().ExpectHidden(kDebugOverlay);
+  test::OobeJS().ExpectVisible(kDebugButton);
+  test::OobeJS().ClickOn(kDebugButton);
+  test::OobeJS().CreateVisibilityWaiter(true, kDebugOverlay)->Wait();
+  test::OobeJS().ExpectEQ(ElementsInPanel(kScreensPanel), kLoginScreensCount);
+}
+
+}  // namespace chromeos

chrome/browser/resources/chromeos/login/debug/debug.js

@@ -788,13 +788,14 @@ cr.define('cr.ui.login.debug', function() {
   }
 
   class ToolPanel {
-    constructor(parent, title) {
+    constructor(parent, title, id) {
       this.titleDiv =
           /** @type {!HTMLElement} */ (document.createElement('h2'));
       this.titleDiv.textContent = title;
 
       let panel = /** @type {!HTMLElement} */ (document.createElement('div'));
       panel.className = 'debug-tool-panel';
+      panel.id = id;
 
       parent.appendChild(this.titleDiv);
       parent.appendChild(panel);
@@ -1022,7 +1023,8 @@ cr.define('cr.ui.login.debug', function() {
     }
 
     createLanguagePanel(parent) {
-      let langPanel = new ToolPanel(this.debuggerOverlay_, 'Language');
+      let langPanel = new ToolPanel(
+          this.debuggerOverlay_, 'Language', 'DebuggerPanelLanguage');
       const LANGUAGES = [
         ['English', 'en-US'],
         ['German', 'de'],
@@ -1040,7 +1042,8 @@ cr.define('cr.ui.login.debug', function() {
     }
 
     createToolsPanel(parent) {
-      let panel = new ToolPanel(this.debuggerOverlay_, 'Tools');
+      let panel =
+          new ToolPanel(this.debuggerOverlay_, 'Tools', 'DebuggerPanelTools');
       new DebugButton(
           panel.content, 'Capture screenshot', this.makeScreenshot.bind(this));
       new DebugButton(
@@ -1052,14 +1055,16 @@ cr.define('cr.ui.login.debug', function() {
     }
 
     createScreensPanel(parent) {
-      let panel = new ToolPanel(this.debuggerOverlay_, 'Screens');
+      let panel = new ToolPanel(
+          this.debuggerOverlay_, 'Screens', 'DebuggerPanelScreens');
       // List of screens will be created later, as not all screens
       // might be registered at this point.
       this.screensPanel = panel;
     }
 
     createStatesPanel(parent) {
-      let panel = new ToolPanel(this.debuggerOverlay_, 'Screen States');
+      let panel = new ToolPanel(
+          this.debuggerOverlay_, 'Screen States', 'DebuggerPanelStates');
       // List of states is rebuilt every time to reflect current screen.
       this.statesPanel = panel;
     }
@@ -1221,6 +1226,7 @@ cr.define('cr.ui.login.debug', function() {
         // Create UI Debugger button
         let button =
             /** @type {!HTMLElement} */ (document.createElement('div'));
+        button.id = 'invokeDebuggerButton';
         button.className = 'debugger-button';
         button.textContent = 'Debug';
         button.addEventListener('click', this.toggleDebugUI.bind(this));
@@ -1231,6 +1237,7 @@ cr.define('cr.ui.login.debug', function() {
         // Create base debugger panel.
         let overlay =
             /** @type {!HTMLElement} */ (document.createElement('div'));
+        overlay.id = 'debuggerOverlay';
         overlay.className = 'debugger-overlay';
         overlay.setAttribute('hidden', true);
         this.debuggerOverlay_ = overlay;

chrome/test/BUILD.gn

@@ -2192,6 +2192,7 @@ if (!is_android) {
         "../browser/chromeos/login/challenge_response_auth_keys_loader_browsertest.cc",
         "../browser/chromeos/login/configuration_based_oobe_browsertest.cc",
         "../browser/chromeos/login/crash_restore_browsertest.cc",
+        "../browser/chromeos/login/debug_overlay_browsertest.cc",
         "../browser/chromeos/login/demo_mode/demo_app_launcher_browsertest.cc",
         "../browser/chromeos/login/demo_mode/demo_session_browsertest.cc",
         "../browser/chromeos/login/demo_mode/demo_setup_browsertest.cc",

testing/buildbot/filters/chromeos.msan.browser_tests.oobe_negative.filter

@@ -12,6 +12,8 @@
 -AutoEnrollmentWithStatistics.*
 -BlockingLoginTest.*
 -ChallengeResponseAuthKeysLoaderBrowserTest.*
+-DebugOverlayTest.*
+-DebugOverlayOnLoginTest.*
 -DemoSessionActiveDirectoryDeviceTest.*
 -DemoSessionConsumerDeviceTest.*
 -DemoSessionDemoDeviceModeTest.*

testing/buildbot/filters/chromeos.msan.browser_tests.oobe_positive.filter

@@ -12,6 +12,8 @@ AutoEnrollmentNoStateKeys.*
 AutoEnrollmentWithStatistics.*
 BlockingLoginTest.*
 ChallengeResponseAuthKeysLoaderBrowserTest.*
+DebugOverlayTest.*
+DebugOverlayOnLoginTest.*
 DemoSessionActiveDirectoryDeviceTest.*
 DemoSessionConsumerDeviceTest.*
 DemoSessionDemoDeviceModeTest.*