From fabed26b094cfee83d8895a816d7b864ad460305 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Sat, 18 Jul 2020 12:19:03 +0100
Subject: [PATCH] Fix Breadcrumbs2 ending up with 2 tabIndexes on Firefox due
 to explicit css overflow scroll

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 src/components/structures/AutoHideScrollbar.js  | 13 +++++++------
 src/components/structures/IndicatorScrollbar.js |  2 +-
 src/components/structures/LeftPanel2.tsx        |  3 +++
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/structures/AutoHideScrollbar.js b/src/components/structures/AutoHideScrollbar.js
index 04323bb548..14f7c9ca83 100644
--- a/src/components/structures/AutoHideScrollbar.js
+++ b/src/components/structures/AutoHideScrollbar.js
@@ -38,12 +38,13 @@ export default class AutoHideScrollbar extends React.Component {
 
     render() {
         return (<div
-                    ref={this._collectContainerRef}
-                    style={this.props.style}
-                    className={["mx_AutoHideScrollbar", this.props.className].join(" ")}
-                    onScroll={this.props.onScroll}
-                    onWheel={this.props.onWheel}
-                >
+            ref={this._collectContainerRef}
+            style={this.props.style}
+            className={["mx_AutoHideScrollbar", this.props.className].join(" ")}
+            onScroll={this.props.onScroll}
+            onWheel={this.props.onWheel}
+            tabIndex={this.props.tabIndex}
+        >
             { this.props.children }
         </div>);
     }
diff --git a/src/components/structures/IndicatorScrollbar.js b/src/components/structures/IndicatorScrollbar.js
index 05ad4f7561..27f7fbb301 100644
--- a/src/components/structures/IndicatorScrollbar.js
+++ b/src/components/structures/IndicatorScrollbar.js
@@ -192,7 +192,7 @@ export default class IndicatorScrollbar extends React.Component {
             ref={this._collectScrollerComponent}
             wrappedRef={this._collectScroller}
             onWheel={this.onMouseWheel}
-            {... this.props}
+            {...this.props}
         >
             { leftOverflowIndicator }
             { this.props.children }
diff --git a/src/components/structures/LeftPanel2.tsx b/src/components/structures/LeftPanel2.tsx
index 717ec240ac..54da7446ac 100644
--- a/src/components/structures/LeftPanel2.tsx
+++ b/src/components/structures/LeftPanel2.tsx
@@ -327,6 +327,9 @@ export default class LeftPanel2 extends React.Component<IProps, IState> {
                 <IndicatorScrollbar
                     className="mx_LeftPanel2_breadcrumbsContainer mx_AutoHideScrollbar"
                     verticalScrollsHorizontally={true}
+                    // Firefox sometimes makes this element focusable due to
+                    // overflow:scroll;, so force it out of tab order.
+                    tabIndex={-1}
                 >
                     <RoomBreadcrumbs2 />
                 </IndicatorScrollbar>