[camera] Fix web facingMode capability handling by mackings · Pull Request #11728 · flutter/packages

mackings · 2026-05-18T09:35:11Z

[camera_web] Fix facingMode capability handling

Prevents availableCameras() from throwing a TypeError when a browser returns an invalid facingMode capability. The plugin now treats invalid or missing facing mode capabilities as unavailable, allowing availableCameras() to continue and fall back to CameraLensDirection.external.

Tests:

dart format packages/camera/camera_web/lib/src/camera_service.dart packages/camera/camera_web/example/integration_test/camera_service_test.dart
flutter analyze
flutter test
flutter drive --release --driver=test_driver/integration_test.dart --target=integration_test/camera_service_test.dart -d chrome
flutter drive --release --driver=test_driver/integration_test.dart --target=integration_test/camera_web_test.dart -d chrome

Pre-Review Checklist

gemini-code-assist

Code Review

This pull request fixes a TypeError in the camera_web package by validating that the facingMode capability is a valid JavaScript array before processing. The changes include logic in CameraService to handle invalid capabilities and a new integration test. Review feedback notes that the current runtime check does not verify the types of the array's elements and suggests a more efficient approach to validate and retrieve the first element safely.

gemini-code-assist · 2026-05-18T09:37:22Z

+      final List<String> facingModes =
+          (facingModeCapabilities as JSArray<JSString>).toDart
              .map((JSString e) => e.toDart)
-              .toList() ??
-          <String>[];
+              .toList();

-      if (facingModeCapabilities.isNotEmpty) {
-        final String facingModeCapability = facingModeCapabilities.first;
+      if (facingModes.isNotEmpty) {
+        final String facingModeCapability = facingModes.first;
        return facingModeCapability;
      } else {
        // Return null if there are no facing mode capabilities.


The current implementation converts the entire array to a Dart list and maps every element to a string, which is inefficient since only the first element is needed. More importantly, isA<JSArray<JSString>>() only verifies that the object is a JS array at runtime; it does not check the types of the elements. If the browser returns an array containing non-string values (e.g., [true]), calling e.toDart will still result in a TypeError.

Consider a more robust and efficient approach that only checks the first element's type before converting it.

final List<JSAny?> facingModes = (facingModeCapabilities as JSArray).toDart; if (facingModes.isNotEmpty && facingModes.first.isA<JSString>()) { return (facingModes.first as JSString).toDart; } else { // Return null if there are no facing mode capabilities.

Updated to validate the first facingMode capability element before converting it, and added a regression test for a non-string array entry. The focused web integration test passes.

stuartmorgan-g · 2026-05-18T14:39:34Z

Thanks for the contribution! You’ve checked boxes in the PR checklist above that are not reflected in this PR, so I’m assuming this is a work in progress and am marking it as a Draft. Please review the checklist, updating the PR as appropriate, and when the state of the PR as posted reflects the checklist please feel free to mark it as ready for review.

Please also check that the contents of the PR are all actually relevant to the change you are attempting to make.

gemini-code-assist

Code Review

This pull request addresses a TypeError in the web implementation of availableCameras by improving the validation of the facingMode capability. The changes include safe property access using jsUtil and explicit type checks to ensure facingMode is a JSArray containing a JSString. Corresponding integration tests have been added to verify these scenarios. Feedback was provided to remove an unnecessary else block in camera_service.dart to improve code readability and adhere to Dart style conventions.

gemini-code-assist · 2026-05-19T12:51:44Z

+      if (facingModes.isNotEmpty && facingModes.first.isA<JSString>()) {
+        return (facingModes.first! as JSString).toDart;
      } else {
        // Return null if there are no facing mode capabilities.
        return null;


This else block is unnecessary. To improve readability and reduce nesting, it's better to remove the else and have a single return null; after the if block.

if (facingModes.isNotEmpty && facingModes.first.isA<JSString>()) { return (facingModes.first! as JSString).toDart; } // Return null if there are no facing mode capabilities. return null;

References

The repository style guide (lines 10-12) requires following language-specific style guides. For Dart, this change aligns with the Effective Dart style guide, which recommends avoiding else after an if statement that contains a return. ^(link)

stuartmorgan-g · 2026-05-19T16:02:54Z

[x] I followed [the version and CHANGELOG instructions], using [semantic versioning] and the [repository CHANGELOG style], or I have commented below to indicate which documented exception this PR falls under[^1].

As with #11727, this step needs to be completed.

mackings · 2026-05-19T16:20:25Z

[x] I followed [the version and CHANGELOG instructions], using [semantic versioning] and the [repository CHANGELOG style], or I have commented below to indicate which documented exception this PR falls under[^1].

As with #11727, this step needs to be completed.

Yes Updated.

stuartmorgan-g · 2026-05-19T18:30:50Z

As with the other PR: Could you explain why you believe this PR does not need to follow our documented process?

mackings · 2026-05-19T20:03:43Z

As with the other PR: Could you explain why you believe this PR does not need to follow our documented process?

You’re right, I misunderstood that checklist item earlier.

I’ve updated the PR to follow the version and CHANGELOG process now:

bumped the package version in pubspec.yaml.
updated the package CHANGELOG.md with the release heading and entry
restored the checklist item in the PR description
…

mdebbar · 2026-06-01T20:08:33Z

-## NEXT
+## 0.3.5+4

 * Updates minimum supported SDK version to Flutter 3.38/Dart 3.10.


Above this line, there should be a new line explaining what this change is doing.

Yes, I have made an update to it.

mdebbar · 2026-06-01T20:27:17Z

+      final JSAny? facingModeCapabilities = jsUtil.getProperty(
+        videoTrackCapabilities,
+        'facingMode'.toJS,
+      );
+      if (facingModeCapabilities == null ||
+          !facingModeCapabilities.isA<JSArray>()) {


Could you add a comment explaining why it's necessary to do all of this type-checking? Is it because facingMode is sometimes an object and not an array?

Yes, the type-checking is necessary because some browsers (notably Firefox) don't conform to the MediaTrackCapabilities spec and return facingMode as a non-array value (e.g. an empty string or a plain object) instead of the expected DOMString sequence. The original code cast it directly to JSArray without validation, which caused a TypeError at runtime when availableCameras() was called on those browsers.
I have added a comment to the code to explain this.

Enhance comments for facing mode capabilities handling in camera service.

mackings

@mdebbar

Fix TypeError in availableCameras() and update SDK version.

stuartmorgan-g · 2026-06-02T18:32:48Z

@bparrishMines for secondary review

github-actions Bot added p: camera platform-web labels May 18, 2026

gemini-code-assist Bot reviewed May 18, 2026

View reviewed changes

github-actions Bot added p: extension_google_sign_in_as_googleapis_auth p: go_router platform-ios platform-macos p: interactive_media_ads Plugin for IMA SDK p: google_fonts triage-framework Should be looked at in framework triage labels May 18, 2026

stuartmorgan-g marked this pull request as draft May 18, 2026 14:39

github-actions Bot removed p: extension_google_sign_in_as_googleapis_auth p: go_router platform-ios platform-macos p: interactive_media_ads Plugin for IMA SDK p: google_fonts triage-framework Should be looked at in framework triage labels May 19, 2026

gemini-code-assist Bot reviewed May 19, 2026

View reviewed changes

stuartmorgan-g changed the title ~~Fix camera_web facingMode capability handling~~ [camera] Fix web facingMode capability handling May 19, 2026

Fix camera_web facingMode capability handling

7027a3e

Merge branch 'main' into fix-camera-web-available-cameras-firefox

2f63eca

stuartmorgan-g added the triage-web Should be looked at in web triage label May 20, 2026

stuartmorgan-g requested a review from mdebbar May 20, 2026 10:57

Merge branch 'main' into fix-camera-web-available-cameras-firefox

bff44a3

mdebbar approved these changes Jun 1, 2026

View reviewed changes

mdebbar added the CICD Run CI/CD label Jun 1, 2026

Improve comments for facing mode capabilities

6889189

Enhance comments for facing mode capabilities handling in camera service.

github-actions Bot removed the CICD Run CI/CD label Jun 1, 2026

mackings commented Jun 1, 2026

View reviewed changes

mackings added 2 commits June 1, 2026 22:09

Update CHANGELOG for version 0.3.5+4

dbcd27c

Fix TypeError in availableCameras() and update SDK version.

Merge branch 'main' into fix-camera-web-available-cameras-firefox

e0496b5

stuartmorgan-g requested a review from bparrishMines June 2, 2026 18:32

Merge branch 'main' into fix-camera-web-available-cameras-firefox

9651fbe

Conversation

mackings commented May 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Pre-Review Checklist

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist Bot May 18, 2026

Choose a reason for hiding this comment

Uh oh!

mackings May 18, 2026

Choose a reason for hiding this comment

Uh oh!

stuartmorgan-g commented May 18, 2026

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist Bot May 19, 2026

Choose a reason for hiding this comment

Uh oh!

stuartmorgan-g commented May 19, 2026

Uh oh!

mackings commented May 19, 2026

Uh oh!

stuartmorgan-g commented May 19, 2026

Uh oh!

mackings commented May 19, 2026

Uh oh!

mdebbar Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

mackings Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

mdebbar Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

mackings Jun 1, 2026

Choose a reason for hiding this comment

Uh oh!

mackings left a comment

Choose a reason for hiding this comment

Uh oh!

stuartmorgan-g commented Jun 2, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

mackings commented May 18, 2026 •

edited

Loading