diff --git a/engine/src/flutter/lib/web_ui/lib/src/engine/view_embedder/style_manager.dart b/engine/src/flutter/lib/web_ui/lib/src/engine/view_embedder/style_manager.dart index ba1f0382fcb..b80b922451b 100644 --- a/engine/src/flutter/lib/web_ui/lib/src/engine/view_embedder/style_manager.dart +++ b/engine/src/flutter/lib/web_ui/lib/src/engine/view_embedder/style_manager.dart @@ -107,7 +107,7 @@ void applyGlobalCssRulesToSheet( '}' // Hide outline when the flutter-view root element is focused. '$cssSelectorPrefix:focus {' - ' outline: none;' + ' outline: rgb(0, 0, 0) none 0px;' '}', ); diff --git a/engine/src/flutter/lib/web_ui/test/engine/view_embedder/style_manager_test.dart b/engine/src/flutter/lib/web_ui/test/engine/view_embedder/style_manager_test.dart index 363cd98cbca..931f8a77b4b 100644 --- a/engine/src/flutter/lib/web_ui/test/engine/view_embedder/style_manager_test.dart +++ b/engine/src/flutter/lib/web_ui/test/engine/view_embedder/style_manager_test.dart @@ -5,7 +5,6 @@ import 'package:test/bootstrap/browser.dart'; import 'package:test/test.dart'; import 'package:ui/src/engine.dart'; -import 'package:ui/ui_web/src/ui_web.dart' as ui_web; import '../../common/matchers.dart'; @@ -15,29 +14,27 @@ void main() { void doTests() { group('StyleManager', () { - test( - 'attachGlobalStyles hides the outline when focused', - () { - final DomElement flutterViewElement = createDomElement(DomManager.flutterViewTagName); + test('attachGlobalStyles hides the outline when focused', () { + final DomElement flutterViewElement = createDomElement(DomManager.flutterViewTagName); - domDocument.body!.append(flutterViewElement); - StyleManager.attachGlobalStyles( - node: flutterViewElement, - styleId: 'testing', - styleNonce: 'testing', - cssSelectorPrefix: DomManager.flutterViewTagName, - ); - final expected = ui_web.browser.browserEngine == ui_web.BrowserEngine.firefox - ? 'rgb(0, 0, 0) 0px' - : 'rgb(0, 0, 0) none 0px'; - final String got = domWindow.getComputedStyle(flutterViewElement, 'focus').outline; + // Set a tab index so that the element is focusable. + flutterViewElement.tabIndex = 0; - expect(got, expected); - }, - skip: isFirefox - ? 'Skip until we fix the flake on Firefox. See: https://github.com/flutter/flutter/issues/180940' - : null, - ); + domDocument.body!.append(flutterViewElement); + StyleManager.attachGlobalStyles( + node: flutterViewElement, + styleId: 'testing', + styleNonce: 'testing', + cssSelectorPrefix: DomManager.flutterViewTagName, + ); + final expected = isFirefox ? 'rgb(0, 0, 0) 0px' : 'rgb(0, 0, 0) none 0px'; + + // Focus the element. + flutterViewElement.focusWithoutScroll(); + final String got = domWindow.getComputedStyle(flutterViewElement).outline; + + expect(got, expected); + }); test('styleSceneHost', () { expect(() => StyleManager.styleSceneHost(createDomHTMLDivElement()), throwsAssertionError);