Add WebView for WebUI-based tab strip

This is gated by both the buildflag |enable_webui_tab_strip| and a new kWebUITabStrip feature flag. The change adds toggle button and new-tab button next to the toolbar as well. This is still rough (has no animation, shows scroll bars), but checking this in should make it easier to iterate on. There are also placeholder icons and hard-coded colors in use for now. Bug: chromium:989131 Change-Id: I5bc2a20e85c8b98ca882d536f2f7937233304de1 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1742934 Commit-Queue: Peter Boström <pbos@chromium.org> Reviewed-by: Elly Fong-Jones <ellyjones@chromium.org> Reviewed-by: Collin Baker <collinbaker@chromium.org> Reviewed-by: Tommy Li <tommycli@chromium.org> Cr-Commit-Position: refs/heads/master@{#686207}
chromium · Aug 12, 2019 · 92add81 · 92add81
1 parent 75ffaa8
commit 92add81
Show file tree

Hide file tree

Showing 17 changed files with 209 additions and 5 deletions.
diff --git a/chrome/browser/about_flags.cc b/chrome/browser/about_flags.cc
@@ -1487,6 +1487,11 @@ const FeatureEntry kFeatureEntries[] = {
     {"top-chrome-touch-ui", flag_descriptions::kTopChromeTouchUiName,
      flag_descriptions::kTopChromeTouchUiDescription, kOsDesktop,
      MULTI_VALUE_TYPE(kTopChromeTouchUiChoices)},
+#if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+    {"webui-tab-strip", flag_descriptions::kWebUITabStripName,
+     flag_descriptions::kWebUITabStripDescription, kOsDesktop,
+     FEATURE_VALUE_TYPE(features::kWebUITabStrip)},
+#endif  // BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
 #if !defined(OS_ANDROID)
     {"new-tab-loading-animation", flag_descriptions::kNewTabLoadingAnimation,
      flag_descriptions::kNewTabLoadingAnimationDescription, kOsDesktop,

diff --git a/chrome/browser/flag-metadata.json b/chrome/browser/flag-metadata.json
@@ -3220,6 +3220,11 @@
     "owners": [ "davidbienvenu" ],
     "expiry_milestone": 81
   },
+  {
+    "name": "webui-tab-strip",
+    "owners": [ "johntlee", "pbos" ],
+    "expiry_milestone": 82
+  },
   {
     "name": "webxr",
     "owners": [ "//third_party/blink/renderer/modules/xr/OWNERS", "xr-dev@chromium.org" ],

diff --git a/chrome/browser/flag_descriptions.cc b/chrome/browser/flag_descriptions.cc
@@ -2110,6 +2110,10 @@ const char kWebrtcStunOriginDescription[] =
     "When enabled, Stun messages generated by WebRTC will contain the Origin "
     "header.";
 
+const char kWebUITabStripName[] = "WebUI tab strip";
+const char kWebUITabStripDescription[] =
+    "When enabled makes use of a WebUI-based tab strip.";
+
 const char kWebvrName[] = "WebVR";
 const char kWebvrDescription[] =
     "Enables access to experimental Virtual Reality functionality via the "

diff --git a/chrome/browser/flag_descriptions.h b/chrome/browser/flag_descriptions.h
@@ -1248,6 +1248,9 @@ extern const char kWebrtcSrtpAesGcmDescription[];
 extern const char kWebrtcStunOriginName[];
 extern const char kWebrtcStunOriginDescription[];
 
+extern const char kWebUITabStripName[];
+extern const char kWebUITabStripDescription[];
+
 extern const char kWebvrName[];
 extern const char kWebvrDescription[];
 

diff --git a/chrome/browser/ui/BUILD.gn b/chrome/browser/ui/BUILD.gn
@@ -3907,6 +3907,8 @@ jumbo_split_static_library("ui") {
     deps += [ "//chrome/browser/resources:tab_strip_resources" ]
 
     sources += [
+      "views/frame/webui_tab_strip_container_view.cc",
+      "views/frame/webui_tab_strip_container_view.h",
       "webui/tab_strip/tab_strip_ui.cc",
       "webui/tab_strip/tab_strip_ui.h",
     ]

diff --git a/chrome/browser/ui/ui_features.cc b/chrome/browser/ui/ui_features.cc
@@ -59,6 +59,12 @@ const base::Feature kTabHoverCardImages{"TabHoverCardImages",
 const base::Feature kTabOutlinesInLowContrastThemes{
     "TabOutlinesInLowContrastThemes", base::FEATURE_DISABLED_BY_DEFAULT};
 
+#if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+// Enables a web-based toolbar. See https://crbug.com/989131
+const base::Feature kWebUITabStrip{"WebUITabStrip",
+                                   base::FEATURE_DISABLED_BY_DEFAULT};
+#endif  // BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+
 #if defined(OS_LINUX) && !defined(OS_CHROMEOS)
 constexpr base::Feature kEnableDbusAndX11StatusIcons{
     "EnableDbusAndX11StatusIcons", base::FEATURE_ENABLED_BY_DEFAULT};

diff --git a/chrome/browser/ui/ui_features.h b/chrome/browser/ui/ui_features.h
@@ -10,6 +10,7 @@
 
 #include "base/feature_list.h"
 #include "build/build_config.h"
+#include "chrome/common/buildflags.h"
 
 namespace features {
 
@@ -39,6 +40,10 @@ extern const base::Feature kTabHoverCardImages;
 
 extern const base::Feature kTabOutlinesInLowContrastThemes;
 
+#if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+extern const base::Feature kWebUITabStrip;
+#endif  // BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+
 #if defined(OS_LINUX) && !defined(OS_CHROMEOS)
 extern const base::Feature kEnableDbusAndX11StatusIcons;
 #endif

diff --git a/chrome/browser/ui/view_ids.h b/chrome/browser/ui/view_ids.h
@@ -100,6 +100,10 @@ enum ViewID {
 
   // Plus button on location bar.
   VIEW_ID_ACTION_BOX_BUTTON,
+
+  // IDs for the WebUI-based tab strip. See https://crbug.com/989131.
+  VIEW_ID_WEBUI_TAB_STRIP_TOGGLE_BUTTON,
+  VIEW_ID_WEBUI_TAB_STRIP_NEW_TAB_BUTTON,
 };
 
 #endif  // CHROME_BROWSER_UI_VIEW_IDS_H_
diff --git a/chrome/browser/ui/views/frame/browser_view.cc b/chrome/browser/ui/views/frame/browser_view.cc
@@ -214,6 +214,10 @@
 #include "chrome/browser/ui/views/sync/one_click_signin_dialog_view.h"
 #endif
 
+#if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+#include "chrome/browser/ui/views/frame/webui_tab_strip_container_view.h"
+#endif  // BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+
 using base::TimeDelta;
 using base::UserMetricsAction;
 using content::NativeWebKeyboardEvent;
@@ -2623,11 +2627,24 @@ void BrowserView::InitViews() {
   immersive_mode_controller_->Init(this);
   immersive_mode_controller_->AddObserver(this);
 
+  views::View* webui_tab_strip_view = nullptr;
+  views::View* webui_tab_strip_caption_buttons = nullptr;
+#if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+  if (base::FeatureList::IsEnabled(features::kWebUITabStrip)) {
+    WebUITabStripContainerView* const webui_tab_strip = AddChildView(
+        std::make_unique<WebUITabStripContainerView>(browser_.get()));
+
+    webui_tab_strip_caption_buttons =
+        AddChildView(webui_tab_strip->CreateControlButtons());
+    webui_tab_strip_view = webui_tab_strip;
+  }
+#endif  // BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+
   auto browser_view_layout = std::make_unique<BrowserViewLayout>(
       std::make_unique<BrowserViewLayoutDelegateImpl>(this), browser(), this,
-      top_container_, tab_strip_region_view_, tabstrip_, toolbar_,
-      infobar_container_, contents_container_,
-      immersive_mode_controller_.get());
+      top_container_, tab_strip_region_view_, tabstrip_, webui_tab_strip_view,
+      webui_tab_strip_caption_buttons, toolbar_, infobar_container_,
+      contents_container_, immersive_mode_controller_.get());
   SetLayoutManager(std::move(browser_view_layout));
 
   EnsureFocusOrder();

diff --git a/chrome/browser/ui/views/frame/browser_view_layout.cc b/chrome/browser/ui/views/frame/browser_view_layout.cc
@@ -132,6 +132,8 @@ BrowserViewLayout::BrowserViewLayout(
     views::View* top_container,
     views::View* tab_strip_region_view,
     TabStrip* tab_strip,
+    views::View* webui_tab_strip,
+    views::View* webui_tab_strip_caption_buttons,
     views::View* toolbar,
     InfoBarContainerView* infobar_container,
     views::View* contents_container,
@@ -141,6 +143,8 @@ BrowserViewLayout::BrowserViewLayout(
       browser_view_(browser_view),
       top_container_(top_container),
       tab_strip_region_view_(tab_strip_region_view),
+      webui_tab_strip_(webui_tab_strip),
+      webui_tab_strip_caption_buttons_(webui_tab_strip_caption_buttons),
       toolbar_(toolbar),
       infobar_container_(infobar_container),
       contents_container_(contents_container),
@@ -330,6 +334,7 @@ void BrowserViewLayout::Layout(views::View* browser_view) {
                                     browser_view_->GetMirroredX() +
                                     delegate_->GetThemeBackgroundXInset());
   }
+  top = LayoutWebUITabStrip(top);
   top = LayoutToolbar(top);
 
   top = LayoutBookmarkAndInfoBars(top, browser_view->y());
@@ -400,11 +405,28 @@ int BrowserViewLayout::LayoutTabStripRegion(int top) {
          GetLayoutConstant(TABSTRIP_TOOLBAR_OVERLAP);
 }
 
+int BrowserViewLayout::LayoutWebUITabStrip(int top) {
+  if (!webui_tab_strip_ || !webui_tab_strip_->GetVisible())
+    return top;
+  webui_tab_strip_->SetBounds(vertical_layout_rect_.x(), top,
+                              vertical_layout_rect_.width(), 240);
+  return webui_tab_strip_->bounds().bottom();
+}
+
 int BrowserViewLayout::LayoutToolbar(int top) {
   int browser_view_width = vertical_layout_rect_.width();
   bool toolbar_visible = delegate_->IsToolbarVisible();
   int height = toolbar_visible ? toolbar_->GetPreferredSize().height() : 0;
   toolbar_->SetVisible(toolbar_visible);
+  if (webui_tab_strip_caption_buttons_) {
+    webui_tab_strip_caption_buttons_->SetVisible(toolbar_visible);
+    const int preferred_webui_tab_strip_caption_buttons_width =
+        webui_tab_strip_caption_buttons_->GetPreferredSize().width();
+    browser_view_width -= preferred_webui_tab_strip_caption_buttons_width;
+    webui_tab_strip_caption_buttons_->SetBounds(
+        vertical_layout_rect_.x() + browser_view_width, top,
+        preferred_webui_tab_strip_caption_buttons_width, height);
+  }
   toolbar_->SetBounds(vertical_layout_rect_.x(), top, browser_view_width,
                       height);
   return toolbar_->bounds().bottom();

diff --git a/chrome/browser/ui/views/frame/browser_view_layout.h b/chrome/browser/ui/views/frame/browser_view_layout.h
@@ -45,6 +45,8 @@ class BrowserViewLayout : public views::LayoutManager {
                     views::View* top_container,
                     views::View* tab_strip_region_view,
                     TabStrip* tab_strip,
+                    views::View* webui_tab_strip,
+                    views::View* webui_tab_strip_caption_buttons,
                     views::View* toolbar,
                     InfoBarContainerView* infobar_container,
                     views::View* contents_container,
@@ -97,6 +99,7 @@ class BrowserViewLayout : public views::LayoutManager {
   // Layout the following controls, starting at |top|, returns the coordinate
   // of the bottom of the control, for laying out the next control.
   int LayoutTabStripRegion(int top);
+  int LayoutWebUITabStrip(int top);
   int LayoutToolbar(int top);
   int LayoutBookmarkAndInfoBars(int top, int browser_view_y);
   int LayoutBookmarkBar(int top);
@@ -134,6 +137,8 @@ class BrowserViewLayout : public views::LayoutManager {
   // testing much easier.
   views::View* const top_container_;
   views::View* const tab_strip_region_view_;
+  views::View* const webui_tab_strip_;
+  views::View* const webui_tab_strip_caption_buttons_;
   views::View* const toolbar_;
   InfoBarContainerView* const infobar_container_;
   views::View* const contents_container_;

diff --git a/chrome/browser/ui/views/frame/browser_view_layout_unittest.cc b/chrome/browser/ui/views/frame/browser_view_layout_unittest.cc
@@ -170,8 +170,8 @@ class BrowserViewLayoutTest : public BrowserWithTestWindowTest {
     layout_ = std::make_unique<BrowserViewLayout>(
         std::unique_ptr<BrowserViewLayoutDelegate>(delegate_), browser(),
         nullptr,  // BrowserView.
-        top_container_, tab_strip_region_view, tab_strip_, toolbar_,
-        infobar_container_, contents_container_,
+        top_container_, tab_strip_region_view, tab_strip_, nullptr, nullptr,
+        toolbar_, infobar_container_, contents_container_,
         immersive_mode_controller_.get());
   }
 

diff --git a/chrome/browser/ui/views/frame/webui_tab_strip_container_view.cc b/chrome/browser/ui/views/frame/webui_tab_strip_container_view.cc
@@ -0,0 +1,84 @@
+// Copyright 2019 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 "chrome/browser/ui/views/frame/webui_tab_strip_container_view.h"
+
+#include "base/logging.h"
+#include "chrome/app/chrome_command_ids.h"
+#include "chrome/app/vector_icons/vector_icons.h"
+#include "chrome/browser/extensions/chrome_extension_web_contents_observer.h"
+#include "chrome/browser/profiles/profile.h"
+#include "chrome/browser/task_manager/web_contents_tags.h"
+#include "chrome/browser/ui/browser.h"
+#include "chrome/browser/ui/browser_commands.h"
+#include "chrome/browser/ui/layout_constants.h"
+#include "chrome/browser/ui/view_ids.h"
+#include "chrome/browser/ui/views/toolbar/toolbar_button.h"
+#include "chrome/common/webui_url_constants.h"
+#include "ui/gfx/color_palette.h"
+#include "ui/gfx/paint_vector_icon.h"
+#include "ui/views/background.h"
+#include "ui/views/controls/webview/webview.h"
+#include "ui/views/layout/fill_layout.h"
+#include "ui/views/layout/flex_layout.h"
+#include "ui/views/view_class_properties.h"
+
+WebUITabStripContainerView::WebUITabStripContainerView(Browser* browser)
+    : browser_(browser),
+      web_view_(
+          AddChildView(std::make_unique<views::WebView>(browser->profile()))) {
+  SetVisible(false);
+  SetLayoutManager(std::make_unique<views::FillLayout>());
+  web_view_->LoadInitialURL(GURL(chrome::kChromeUITabStripURL));
+  extensions::ChromeExtensionWebContentsObserver::CreateForWebContents(
+      web_view_->web_contents());
+  task_manager::WebContentsTags::CreateForTabContents(
+      web_view_->web_contents());
+}
+
+std::unique_ptr<views::View>
+WebUITabStripContainerView::CreateControlButtons() {
+  auto toolbar_button_container = std::make_unique<views::View>();
+  toolbar_button_container
+      ->SetLayoutManager(std::make_unique<views::FlexLayout>())
+      ->SetOrientation(views::LayoutOrientation::kHorizontal)
+      .SetCrossAxisAlignment(views::LayoutAlignment::kCenter)
+      .SetDefault(views::kMarginsKey,
+                  gfx::Insets(0, GetLayoutConstant(TOOLBAR_ELEMENT_PADDING)))
+      .SetInteriorMargin(
+          gfx::Insets(0, GetLayoutConstant(TOOLBAR_STANDARD_SPACING)))
+      .SetCollapseMargins(true);
+  toolbar_button_container->SetBackground(
+      views::CreateSolidBackground(gfx::kGoogleGrey300));
+
+  ToolbarButton* const new_tab_button = toolbar_button_container->AddChildView(
+      std::make_unique<ToolbarButton>(this));
+  new_tab_button->SetID(VIEW_ID_WEBUI_TAB_STRIP_NEW_TAB_BUTTON);
+  new_tab_button->SetImage(
+      views::Button::STATE_NORMAL,
+      gfx::CreateVectorIcon(kAddIcon, gfx::kGoogleGrey700));
+
+  ToolbarButton* const toggle_button = toolbar_button_container->AddChildView(
+      std::make_unique<ToolbarButton>(this));
+  toggle_button->SetID(VIEW_ID_WEBUI_TAB_STRIP_TOGGLE_BUTTON);
+  // TODO(pbos): Replace this icon tab counter.
+  toggle_button->SetImage(
+      views::Button::STATE_NORMAL,
+      gfx::CreateVectorIcon(kCaretUpIcon, gfx::kGoogleGrey700));
+
+  return toolbar_button_container;
+}
+
+void WebUITabStripContainerView::ButtonPressed(views::Button* sender,
+                                               const ui::Event& event) {
+  if (sender->GetID() == VIEW_ID_WEBUI_TAB_STRIP_TOGGLE_BUTTON) {
+    // TODO(pbos): Trigger a slide animation here.
+    SetVisible(!GetVisible());
+    InvalidateLayout();
+  } else if (sender->GetID() == VIEW_ID_WEBUI_TAB_STRIP_NEW_TAB_BUTTON) {
+    chrome::ExecuteCommand(browser_, IDC_NEW_TAB);
+  } else {
+    NOTREACHED();
+  }
+}
diff --git a/chrome/browser/ui/views/frame/webui_tab_strip_container_view.h b/chrome/browser/ui/views/frame/webui_tab_strip_container_view.h
@@ -0,0 +1,38 @@
+// Copyright 2019 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.
+
+#ifndef CHROME_BROWSER_UI_VIEWS_FRAME_WEBUI_TAB_STRIP_CONTAINER_VIEW_H_
+#define CHROME_BROWSER_UI_VIEWS_FRAME_WEBUI_TAB_STRIP_CONTAINER_VIEW_H_
+
+#include <memory>
+
+#include "chrome/common/buildflags.h"
+#include "ui/views/controls/button/button.h"
+#include "ui/views/view.h"
+
+#if !BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
+#error
+#endif
+
+namespace views {
+class WebView;
+}  // namespace views
+
+class Browser;
+
+class WebUITabStripContainerView : public views::View,
+                                   public views::ButtonListener {
+ public:
+  explicit WebUITabStripContainerView(Browser* browser);
+
+  std::unique_ptr<views::View> CreateControlButtons();
+
+ private:
+  void ButtonPressed(views::Button* sender, const ui::Event& event) override;
+
+  Browser* const browser_;
+  views::WebView* const web_view_;
+};
+
+#endif  // CHROME_BROWSER_UI_VIEWS_FRAME_WEBUI_TAB_STRIP_CONTAINER_VIEW_H_
diff --git a/chrome/common/webui_url_constants.cc b/chrome/common/webui_url_constants.cc
@@ -338,6 +338,7 @@ const char kChromeUIPrintHost[] = "print";
 
 #if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
 const char kChromeUITabStripHost[] = "tab-strip";
+const char kChromeUITabStripURL[] = "chrome://tab-strip";
 #endif
 
 const char kChromeUIWebRtcLogsHost[] = "webrtc-logs";

diff --git a/chrome/common/webui_url_constants.h b/chrome/common/webui_url_constants.h
@@ -299,6 +299,7 @@ extern const char kChromeUIPrintHost[];
 
 #if BUILDFLAG(ENABLE_WEBUI_TAB_STRIP)
 extern const char kChromeUITabStripHost[];
+extern const char kChromeUITabStripURL[];
 #endif
 
 extern const char kChromeUIWebRtcLogsHost[];

diff --git a/tools/metrics/histograms/enums.xml b/tools/metrics/histograms/enums.xml
@@ -34408,6 +34408,7 @@ Called by update_gpu_driver_bug_workaround_entries.py.-->
   <int value="-1768672408" label="ChromeDuplex:disabled"/>
   <int value="-1768308156" label="OmniboxDedupeGoogleDriveURLs:enabled"/>
   <int value="-1767470652" label="out-of-process-pdf"/>
+  <int value="-1766791501" label="WebUITabStrip:enabled"/>
   <int value="-1766648764" label="OmniboxShortBookmarkSuggestions:disabled"/>
   <int value="-1766129470" label="DataSaverLiteModeRebranding:disabled"/>
   <int value="-1758468685" label="DownloadHomeV2:disabled"/>
@@ -36356,6 +36357,7 @@ from previous Chrome versions.
   <int value="975104092" label="show-taps"/>
   <int value="976079108" label="TouchpadOverscrollHistoryNavigation:disabled"/>
   <int value="976278412" label="google-password-manager:enabled"/>
+  <int value="977968353" label="WebUITabStrip:disabled"/>
   <int value="978659723" label="TemporaryUnexpireFlagsM77:disabled"/>
   <int value="979445973" label="OmniboxSpareRenderer:enabled"/>
   <int value="980396200" label="enable-new-korean-ime"/>