[web] Multi-view sizing regression: canvases fail to match host container dimensions based on last view added

Steps to reproduce

See code sample, multi_view_bug.zip, below for easy reproduction.

Enable Multi-View: Initialize a Flutter Web application with multiViewEnabled: true in the engine initialization script.
Define Multiple Hosts: Create multiple HTML container elements (e.g., <div>) with varying CSS-defined dimensions (using vw/vh, percentages, or fixed pixels).
Attach Views: In the onEntrypointLoaded callback, call app.addView for each container, passing the host element and minimal/no explicit viewConstraints.
Render View Collection: Use ViewCollection in the root widget to render distinct widgets into each separate FlutterView.
Run on Flutter 3.41.x: Launch the application using Flutter framework version 3.41.0 or newer.
Observe Sizing: Note that the internal canvases for each view fail to synchronize with their specific host container's dimensions, often inheriting the scale or bounds of the last added view instead of tracking their own container.

Expected results

Each Flutter view's internal canvas and layout bounds should strictly match the physical dimensions of its specific HTML host element.

Actual results

The internal canvases are misaligned—either extending beyond or failing to fill their parent containers—depending on the size of the last view added. This suggests a state synchronization regression in the engine's multi-view sizing logic.

Code sample

Sample project

Download and unzip the following project to reproduce the bug.

multi_view_bug.zip

Flutter Web Multi-View Sizing Regression

This sample app reproduces a regression in Flutter Web's multi-view layout engine introduced in Flutter 3.41.x. The bug causes Flutter views to miscalculate their canvas size relative to their host HTML containers, leading to visual clipping or incorrect rendering bounds.

The Bug

In Flutter 3.41.6, when adding views via app.addView without explicit viewConstraints (or with minimal constraints), the Flutter engine fails to correctly synchronize its internal canvas scale with the host element's dimensions.

Observed behavior:

Internal Flutter layers (canvases) either extend beyond or do not fill their parent containers depending on the size of the last view added.
The Inspect mode in this sample app highlights the discrepancy:
- Red Dashed Border: The intended size of the HTML host container.
- Blue Solid Border/Shadow: The actual size of the Flutter-rendered canvas.

In the working version (3.38.8), these two boundaries align perfectly.

Reproduction Steps

This project uses FVM to manage Flutter versions. Ensure you have FVM installed.

1. Run the Working Version (Flutter 3.38.8)

Execute the following script to switch to the working version and launch the web server:

./run_3_38_8.sh

Open http://localhost:8080. Observe that all widgets fit perfectly within their boxes.

2. Run the Buggy Version (Flutter 3.41.6)

Execute the following script to switch to the buggy version:

./run_3_41_6.sh

Open http://localhost:8080. Observe that the internal canvases are misaligned or sized incorrectly relative to the borders.

Repro Details

lib/main.dart: Uses runWidget and ViewCollection to manage multiple views.
web/index.html: Defines flexible CSS containers (vw/vh) for the views.
web/flutter_bootstrap.js: Initializes the engine in multiViewEnabled mode and adds views to the HTML elements.
web/dom_verify.js: A diagnostic utility that verifies the DOM state and reports discrepancies.

Screenshots or Video

Screenshots / Video demonstration

The Bug (Flutter 3.41.6)

Expected Results (Flutter 3.38.8)

Logs

Resolving dependencies...
Downloading packages...
  characters 1.4.0 (1.4.1 available)
  matcher 0.12.17 (0.12.19 available)
  material_color_utilities 0.11.1 (0.13.0 available)
  meta 1.17.0 (1.18.2 available)
  test_api 0.7.7 (0.7.11 available)
  vector_math 2.2.0 (2.3.0 available)
Got dependencies!
6 packages have newer versions incompatible with dependency constraints.
Try `flutter pub outdated` for more information.
Launching lib/main.dart on Chrome in debug mode...
This app is linked to the debug service: ws://127.0.0.1:57370/nfu9aXf4z1g=/ws
Debug service listening on ws://127.0.0.1:57370/nfu9aXf4z1g=/ws
A Dart VM Service on Chrome is available at: http://127.0.0.1:57370/nfu9aXf4z1g=
The Flutter DevTools debugger and profiler on Chrome is available at: http://127.0.0.1:9101?uri=ws://127.0.0.1:57370/nfu9aXf4z1g=/ws
Connecting to VM Service at ws://127.0.0.1:57370/nfu9aXf4z1g=/ws
Connected to the VM Service.
Starting application from main method in: org-dartlang-app:/web_entrypoint.dart.
[DOM-TEST] Starting view verification...
[DOM-TEST] view-1: PASS - Matches: 476.0x354.0
[DOM-TEST] view-2: PASS - Matches: 356.0x354.0
[DOM-TEST] view-3: PASS - Matches: 956.0x175.0
[DOM-TEST] view-4: PASS - Matches: 236.0x115.0
Application finished.

Exited.

Flutter Doctor output

Doctor output

% fvm flutter doctor -v
[✓] Flutter (Channel stable, 3.41.6, on macOS 26.3.1 25D771280a darwin-arm64, locale en-US) [1,557ms]
    • Flutter version 3.41.6 on channel stable at /Users/kiplawrence/fvm/versions/3.41.6
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision db50e20168 (3 weeks ago), 2026-03-25 16:21:00 -0700
    • Engine revision 425cfb54d0
    • Dart version 3.11.4
    • DevTools version 2.54.2
    • Feature flags: enable-web, enable-linux-desktop, enable-macos-desktop, enable-windows-desktop,
      enable-android, enable-ios, cli-animations, enable-native-assets, omit-legacy-version-file,
      enable-lldb-debugging, enable-uiscene-migration

[✓] Android toolchain - develop for Android devices (Android SDK version 36.0.0) [3.7s]
    • Android SDK at /Users/kiplawrence/Library/Android/sdk
    • Emulator version 36.1.9.0 (build_id 13823996) (CL:N/A)
    • Platform android-36, build-tools 36.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
      This is the JDK bundled with the latest Android Studio installation on this machine.
      To manually set the JDK path, use: `flutter config --jdk-dir="path/to/jdk"`.
    • Java version OpenJDK Runtime Environment (build 21.0.6+-13391695-b895.109)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 26.4) [4.1s]
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 17E192
    • CocoaPods version 1.16.2

[✓] Chrome - develop for the web [7ms]
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Connected device (3 available) [7.2s]
    • MK (wireless) (mobile) • 00008150-001170AE2287801C • ios            • iOS 26.3.1 23D771330a
    • macOS (desktop)        • macos                     • darwin-arm64   • macOS 26.3.1 25D771280a
      darwin-arm64
    • Chrome (web)           • chrome                    • web-javascript • Google Chrome 147.0.7727.56

[✓] Network resources [332ms]
    • All expected network resources are available.

• No issues found!

@mightykip

@mightykip Thanks for reporting it.
I was able to reproduce the problem on latest stable version.
Also verified that it works fine on Flutter 3.38.8, so this appears to be a regression in newer versions.
Screenshot:

@puneetkukreja98

@puneetkukreja98, @flutter-zl, this is stopping my company from upgrading to the latest Flutter version... we are stuck on the last version because of this bug... any news on a fix for this?

@mdebbar

@puneetkukreja98, @flutter-zl, this is stopping my company from upgrading to the latest Flutter version... we are stuck on the last version because of this bug... any news on a fix for this?

@mdebbar has pending PRs(#185622, #185624, #185698) to fix this issue.

@mdebbar

Thank you for working on this @mdebbar !

@flutter-zl

Hi there @flutter-zl @puneetkukreja98 @mdebbar

We’ve had a great experience adopting Flutter and have seen significant improvements in our mobile development cycle. More recently, we’ve also established a real foothold on the web, allowing us to write in Flutter and ship the same code across Web, iOS, and Android.

The development stack, collaboration between teams, and tooling have genuinely become a pleasure to work with, and we’re excited to continue expanding our Flutter adoption across more of our codebase.

At the moment, we’ve run into this issue that is preventing us from upgrading to a newer Flutter version. Some changes in the newer releases appear to have affected behavior we rely on for Flutter Web, and we haven’t yet found a good path forward.

We’d really appreciate any guidance or recommendations from the Flutter team. If there’s someone specific we should be working with or reaching out to on this issue, we’d also be grateful for an introduction or a point in the right direction. We’re very invested in the platform and would love to find a solution that allows us to keep moving forward with the latest versions.

Respectfully,

Christopher

Live examples: one surface per view, views pooled and never removed

@puneetkukreja98

@puneetkukreja98 , @flutter-zl , @mdebbar

Hi Flutter team — I wanted to provide an update on the impact this regression is having on us and ask if there is any possibility of getting some help moving this forward.

This issue has been blocking our company from upgrading Flutter since April. We currently have to remain on an older Flutter version because upgrading causes this multi-view regression in a critical part of our application.

Unfortunately, we’re now reaching a point where staying on the older version is no longer viable.

With Xcode 27, Flutter encountered a blocking iOS/macOS build issue that required a change to Flutter’s Darwin build tooling:

#188625

That fix has been merged into newer Flutter, but the older Flutter version we’re pinned to does not contain it.

This leaves us stuck between two blocking issues:

Upgrade Flutter → this multi-view regression breaks our application.

Stay on our current Flutter version → we don’t have the Xcode 27 compatibility fix and can no longer reliably build with the current Apple toolchain.

So at this point, this regression is no longer just preventing us from upgrading Flutter — it’s putting us in a position where we don’t have a viable Flutter version to move forward with.

We have a large production Flutter application and would very much like to stay current with Flutter rather than maintaining patches or remaining indefinitely on an older toolchain.

Is there anything we can do to help move this issue forward? We’re happy to provide additional reproduction cases, testing, diagnostics, or help validate a potential fix.

Any assistance or guidance from the Flutter web team would be greatly appreciated. This has become a significant blocker for us.

Thank you!

[web] Make resize and render atomic on the shared offscreen surface (f…

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

[web] Multi-view sizing regression: canvases fail to match host container dimensions based on last view added #185034

Steps to reproduce

Expected results

Actual results

Code sample

Download and unzip the following project to reproduce the bug.

Flutter Web Multi-View Sizing Regression

The Bug

Reproduction Steps

1. Run the Working Version (Flutter 3.38.8)

2. Run the Buggy Version (Flutter 3.41.6)

Repro Details

Screenshots or Video

The Bug (Flutter 3.41.6)

Expected Results (Flutter 3.38.8)

Logs

Flutter Doctor output

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[web] Multi-view sizing regression: canvases fail to match host container dimensions based on last view added #185034

Description

Steps to reproduce

Expected results

Actual results

Code sample

Download and unzip the following project to reproduce the bug.

Flutter Web Multi-View Sizing Regression

The Bug

Reproduction Steps

1. Run the Working Version (Flutter 3.38.8)

2. Run the Buggy Version (Flutter 3.41.6)

Repro Details

Screenshots or Video

The Bug (Flutter 3.41.6)

Expected Results (Flutter 3.38.8)

Logs

Flutter Doctor output

Activity

puneetkukreja98 commented on Apr 15, 2026

mightykip commented on Jun 2, 2026

flutter-zl commented on Jun 2, 2026

mightykip commented on Jun 23, 2026

chris-clm09 commented on Sep 1, 2026

mightykip commented on Oct 1, 2026

github-actions commented on Nov 2, 2026

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions