[web] Repair RenderCanvas CSS size drift (#188797) ## What changed This PR makes the stock `RenderCanvas` path repair stale inline canvas CSS size even when the backing-store size and DPR have not changed. Changes: - Factor the expected logical canvas CSS size into a helper. - Check actual `style.width` / `style.height` before the same-size early return. - Re-apply backing-store / DPR CSS size when the inline style is stale. - Add regression coverage for `1206 x 2142 @ DPR 3`, repairing `0.333333px` back to `402 x 714px`. ## Why flutter/flutter#188723 tracks a Safari/WebKit Skwasm case where the canvas backing store can be valid while the visible CSS/display rect remains collapsed around `0.328125 x 0.328125px`. The existing stock `RenderCanvas` code repairs CSS size on physical-size changes and DPR changes, but not when only the inline CSS value is stale. This PR makes that same-size path self-heal. ## Scope This does not enable Skwasm by default, change WebKit policy, depend on the multi-surface rasterizer, or by itself close all Safari/WebKit default-policy gates. ## Validation - `dart format`: passed. - `git diff --check`: passed. - Targeted `felt` browser test in the #188797 checkout: passed locally. - Command: `DART_SUPPRESS_ANALYTICS=true HOME=/private/tmp DART_SDK_DIR=/private/tmp/flutter-mobile-safari-skwasm-canvas-css-size-fix-upstream-worktree/engine/src/flutter/third_party/dart/tools/sdks/dart-sdk ./dev/felt test --gcs-prod --browser chrome --compiler dart2js --renderer canvaskit --fail-early test/engine/compositing/render_canvas_test.dart` - Result: `chrome-dart2js-canvaskit-engine`, `3/3`, `All tests passed!`. - Fresh `engine/src/out/wasm_release/flutter_web_sdk` build from the #188797 worktree: passed locally. - `dev/benchmarks/macrobenchmarks` built as web wasm/profile using the local `wasm_release` SDK: passed locally. - Guardrail: preserved SDK/app build logs and generated bundle were checked for `FLUTTER_WEB_SKWASM_FORCE_MULTI_SURFACE_RASTERIZER`; the string was absent. - Simulator MobileSafari, Skwasm, `variant=none`, no forced CSS sizing, `bench_card_infinite_scroll`: `probe-complete`, `errors: []`, loaded `skwasm_heavy`, `main.dart.mjs`, and `main.dart.wasm`, `crossOriginIsolated=true`, canvas backing `1206 x 2142`, CSS/display/style `402 x 714` / `402px x 714px`. - Physical iPhone MobileSafari, Skwasm, `variant=none`, no forced CSS sizing, `bench_card_infinite_scroll`: `all-benchmarks-complete`, `errors: []`, loaded `skwasm_heavy`, `main.dart.mjs`, and `main.dart.wasm`, canvas backing `1206 x 2142`, CSS/display/style `402 x 714` / `402px x 714px`. - Physical iPhone MobileSafari, Skwasm, `variant=none`, no forced CSS sizing, `bench_simple_lazy_text_scroll`: `all-benchmarks-complete`, `errors: []`, loaded `skwasm_heavy`, `main.dart.mjs`, and `main.dart.wasm`, canvas backing `1206 x 2142`, CSS/display/style `402 x 714` / `402px x 714px`. Physical iPhone page telemetry reported `crossOriginIsolated=false` even though the harness served isolation headers. Skwasm still loaded through the WebKit allowlist, so this is local physical geometry/benchmark-completion evidence, not a cross-origin-isolation pass. Related issue: flutter/flutter#188723. Broader Safari/WebKit Wasm/Skwasm tracking: flutter/flutter#178893. --------- Co-authored-by: Harry Terkelsen <1961493+harryterkelsen@users.noreply.github.com>
Flutter is Google's SDK for crafting beautiful, fast user experiences for mobile, web, and desktop from a single codebase. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source.
For release and other announcements, join the flutter-announce mailing list. Our documentation also tracks breaking changes across releases.
The Flutter tool may occasionally download resources from Google servers. By downloading or using the Flutter SDK, you agree to the Google Terms of Service: https://policies.google.com/terms
For example, when installed from GitHub (as opposed to from a prepackaged archive), the Flutter tool will download the Dart SDK from Google servers immediately when first run, as it is used to execute the flutter tool itself. This will also occur when Flutter is upgraded (e.g. by running the flutter upgrade command).
We think Flutter will help you create beautiful, fast apps, with a productive, extensible and open development model, whether you're targeting iOS or Android, web, Windows, macOS, Linux or embedding it as the UI toolkit for a platform of your choice.
We want to enable designers to deliver their full creative vision without being forced to water it down due to limitations of the underlying framework. Flutter‘s layered architecture gives you control over every pixel on the screen and its powerful compositing capabilities let you overlay and animate graphics, video, text, and controls without limitation. Flutter includes a full set of widgets that deliver pixel-perfect experiences whether you’re building for iOS (Cupertino) or other platforms (Material), along with support for customizing or creating entirely new visual components.
Flutter is fast. It's powered by hardware-accelerated 2D graphics libraries like Skia (which underpins Chrome and Android) and Impeller. We architected Flutter to support glitch-free, jank-free graphics at the native speed of your device.
Flutter code is powered by the world-class Dart programming language, which enables compilation to 32-bit and 64-bit ARM machine code for iOS and Android, JavaScript and WebAssembly for the web, as well as Intel x64 and ARM for desktop devices.
Flutter offers stateful hot reload, allowing you to make changes to your code and see the results instantly without restarting your app or losing its state.
Flutter works with any development tool (or none at all), and also includes editor plug-ins for both Visual Studio Code and IntelliJ / Android Studio. Flutter provides tens of thousands of packages to speed your development, regardless of your target platform. And accessing other native code is easy, with support for both FFI (on Android, on iOS, on macOS, and on Windows) as well as platform-specific APIs.
Flutter is a fully open-source project, and we welcome contributions. Information on how to get started can be found in our contributor guide.