[web] Move all DOM creation to DomManager #48123

mdebbar · 2023-11-16T15:38:11Z

FlutterViewEmbedder doesn't create the DOM tree anymore (instead, DomManager does).
DomManager only creates the DOM tree (with styles) but doesn't insert it into the document.
EngineFlutterView takes the root element from DomManager and inserts it into the document.
We finally can now create multiple Flutter views, each with its own DOM tree.

cc @yjbanov since I'm making a few changes that probably conflict with your semantics changes.

Part of flutter/flutter#134443
Part of flutter/flutter#137447

yjbanov · 2023-11-16T20:30:31Z

lib/web_ui/lib/src/engine/view_embedder/dom_manager.dart

+
+    StyleManager.styleSemanticsHost(
+      semanticsHost,
+      devicePixelRatio,


Looks like devicePixelRatio is only used here, and also it seems like a bug? How do we update the semantics host when devicePixelRatio changes?

Looks like devicePixelRatio is only used here

Not sure what you mean here. Yes, it's not used anywhere else in this method.

and also it seems like a bug? How do we update the semantics host when devicePixelRatio changes?

The code that listens for resize events (and updates the semantics host) is still in FlutterViewEmbedder for now:

engine/lib/web_ui/lib/src/engine/embedder.dart

Lines 220 to 224 in aae07e9

void _metricsDidChange(ui.Size? newSize) {

StyleManager.scaleSemanticsHost(

_semanticsHostElement,

window.devicePixelRatio,

);

I do plan to move it out of there though. Stay tuned.

I'm just having a feeling that this is the wrong place for styling and scaling the semantics host. In fact, I'm thinking maybe the semantics host is the wrong element to style and scale. Should it be the responsibility of EngineSemanticsOwner? Then we won't need DomManager to be concerned about devicePixelRatio.

Having said that, I'm totally fine with not making this change in this PR.

Yeah, I think it makes sense for the semantic owner to "own" the styling of the semantics tree.

I'll leave it as is for now, but feel free to move it to the semantics owner as part of your overhaul there.

yjbanov · 2023-11-16T20:31:32Z

lib/web_ui/lib/src/engine/view_embedder/dom_manager.dart


  /// This is where accessibility announcements are inserted.
-  DomElement get announcementsHost => _embedder.announcementsHostDEPRECATED;
+  DomElement announcementsHost;


Can we make all DOM elements final?

yjbanov · 2023-11-16T20:32:31Z

lib/web_ui/lib/src/engine/view_embedder/dom_manager.dart

+}
+
+DomShadowRoot _attachShadowRoot(DomElement element) {
+  if (getJsProperty<Object?>(element, 'attachShadow') == null) {


I think we can remove this check now. I believe @ditman removed the non-shadow DOM mode a long time ago.

It was me who removed it, and I kept this check so that we show a somewhat meaningful error to the user instead of an obscure null check error. I'm happy to remove it if we think there's no value in having this error message.

There's probably some value, but also, this leaks into production code and increases code size, so there's also value in removing it.

Ok, let me put it behind an assert.

yjbanov · 2023-11-16T20:33:29Z

lib/web_ui/lib/src/engine/view_embedder/dom_manager.dart

+    'mode': 'open',
+    // This needs to stay false to prevent issues like this:
+    // - https://github.com/flutter/flutter/issues/85759
+    'delegatesFocus': false,


I think we don't need this either, since @htoor3 moved all focusables (text input, semantics) outside the shadow root.

I would prefer to not make functional changes in this PR :)

I'll file an issue though, so we make this change in the future.

flutter/flutter#138576

yjbanov

…8123)

…138637) flutter/engine@90c3ada...141a01c 2023-11-17 dnfield@google.com Reland "[Impeller] Fail if software backend is chosen and Impeller is enabled on iOS." (flutter/engine#46275) 2023-11-17 matanlurey@users.noreply.github.com Make `impeller/geometry/...` compatible with `.clang-tidy`. (flutter/engine#48154) 2023-11-17 matanlurey@users.noreply.github.com Make `impeller/{archivist|compiler|core|entity}/...` compatible with â�¦ (flutter/engine#48153) 2023-11-17 109111084+yaakovschectman@users.noreply.github.com Assign mojom `kSwitch` role to switches (flutter/engine#48146) 2023-11-17 mdebbar@google.com [web] Move scene DOM management to DomManager (flutter/engine#47460) 2023-11-17 30870216+gaaclarke@users.noreply.github.com [Impeller] Unify around "transform" (flutter/engine#48184) 2023-11-17 skia-flutter-autoroll@skia.org Roll Dart SDK from a9c212f2f54b to 03cddb5d740d (1 revision) (flutter/engine#48182) 2023-11-17 matanlurey@users.noreply.github.com Actually make `status_or.h` compatible with `.clang-tidy`. (flutter/engine#48151) 2023-11-17 jonahwilliams@google.com [Impeller] Cleanups to geometry interfaces. (flutter/engine#48180) 2023-11-17 mdebbar@google.com [web] Move all DOM creation to DomManager (flutter/engine#48123) 2023-11-17 15619084+vashworth@users.noreply.github.com Reenable UnobstructedPlatformViewTests testMultiplePlatformViewsWithOverlays (flutter/engine#48139) 2023-11-17 skia-flutter-autoroll@skia.org Roll Dart SDK from 46e8b18047eb to a9c212f2f54b (1 revision) (flutter/engine#48176) 2023-11-17 skia-flutter-autoroll@skia.org Roll Skia from bcd22e8f95bc to 8e9e168418a0 (1 revision) (flutter/engine#48173) 2023-11-17 skia-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from M0zM3CJLIrd5lb0u0... to Bcq9TZdt-vtTSL5YH... (flutter/engine#48172) 2023-11-17 skia-flutter-autoroll@skia.org Roll Skia from c8ee25282849 to bcd22e8f95bc (1 revision) (flutter/engine#48170) 2023-11-17 bdero@google.com [Flutter GPU] Add Textures. (flutter/engine#48118) Also rolling transitive DEPS: fuchsia/sdk/core/linux-amd64 from M0zM3CJLIrd5 to Bcq9TZdt-vtT If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-engine-flutter-autoroll Please CC jonahwilliams@google.com,rmistry@google.com,zra@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

[web] Move all DOM creation to DomManager

7c504e6

mdebbar requested review from yjbanov and ditman November 16, 2023 15:38

github-actions bot added the platform-web Code specifically for the web engine label Nov 16, 2023

yjbanov reviewed Nov 16, 2023

View reviewed changes

finals

211d40e

mdebbar requested a review from yjbanov November 16, 2023 22:32

yjbanov approved these changes Nov 16, 2023

View reviewed changes

mdebbar added 2 commits November 17, 2023 10:51

assert shadow dom

aa47677

Merge branch 'main' into dom_creation

4acc668

mdebbar added the autosubmit Merge PR when tree becomes green via auto submit App label Nov 17, 2023

auto-submit bot merged commit 1665717 into flutter:main Nov 17, 2023
26 checks passed

mdebbar deleted the dom_creation branch November 17, 2023 16:54

engine-flutter-autoroll mentioned this pull request Nov 17, 2023

Roll Flutter Engine from 90c3ada3682c to 141a01c5c70b (16 revisions) flutter/flutter#138637

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Nov 17, 2023

166571703 [web] Move all DOM creation to DomManager (flutter/engine#4…

6df05e1

…8123)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[web] Move all DOM creation to DomManager #48123

[web] Move all DOM creation to DomManager #48123

mdebbar commented Nov 16, 2023 •

edited

Loading

yjbanov Nov 16, 2023

mdebbar Nov 16, 2023

yjbanov Nov 16, 2023

mdebbar Nov 17, 2023

yjbanov Nov 16, 2023

mdebbar Nov 16, 2023

yjbanov Nov 16, 2023

mdebbar Nov 16, 2023

yjbanov Nov 16, 2023

mdebbar Nov 17, 2023

yjbanov Nov 16, 2023

mdebbar Nov 16, 2023

mdebbar Nov 16, 2023

yjbanov left a comment

	void _metricsDidChange(ui.Size? newSize) {
	StyleManager.scaleSemanticsHost(
	_semanticsHostElement,
	window.devicePixelRatio,
	);

[web] Move all DOM creation to DomManager #48123

[web] Move all DOM creation to DomManager #48123

Conversation

mdebbar commented Nov 16, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

yjbanov left a comment

Choose a reason for hiding this comment

mdebbar commented Nov 16, 2023 •

edited

Loading