Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughAdds a new WebF camera plugin: a Flutter-backed custom element exposing camera controls (photo/video, zoom, flash, focus, exposure) to JS/React/Vue via generated bindings, TypeScript declarations, and example app integrations; includes docs, license, configs, and minor iOS build include updates. Changes
Sequence Diagram(s)sequenceDiagram
participant JS as App (React/Vue/JS)
participant WebF as WebF Engine
participant Flutter as FlutterCamera (Dart)
participant Native as Native Platform (iOS/Android)
JS->>WebF: installWebFCamera() / register 'flutter-camera'
JS->>WebF: create `<flutter-camera>` element
WebF->>Flutter: Instantiate FlutterCamera / createState
Flutter->>Native: Query available cameras
Native-->>Flutter: cameras + capabilities
Flutter->>WebF: dispatchEvent 'cameraready' (cameras, ranges)
WebF-->>JS: deliver cameraready event
sequenceDiagram
participant JS as App
participant WebF as WebF Engine
participant Flutter as FlutterCamera
participant Native as Native Platform
JS->>WebF: call takePicture()
WebF->>Flutter: invoke takePicture async
Flutter->>Native: capture photo
Native-->>Flutter: return file path + metadata
Flutter->>WebF: dispatchEvent 'photocaptured' (path, size, dims)
WebF-->>JS: photocaptured event received
sequenceDiagram
participant JS as App
participant WebF as WebF Engine
participant Flutter as FlutterCamera
participant Native as Native Platform
JS->>WebF: startVideoRecording()
WebF->>Flutter: startVideoRecording
Flutter->>Native: start recording
Native-->>Flutter: recording started
Flutter->>WebF: dispatchEvent 'recordingstarted'
JS->>WebF: stopVideoRecording()
WebF->>Flutter: stopVideoRecording
Native-->>Flutter: return video path + duration
Flutter->>WebF: dispatchEvent 'recordingstopped'
WebF-->>JS: recordingstopped event received
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
🤖 Fix all issues with AI agents
In @native_uis/webf_camera/lib/src/camera.dart:
- Around line 743-747: The dispose() method calls the async helper
widgetElement._disposeCamera() without awaiting, which risks lost async cleanup;
import dart:async show unawaited and wrap the call as
unawaited(widgetElement._disposeCamera()) inside dispose(), or alternatively
move/ensure async cleanup is performed from a lifecycle method that supports
async cleanup; update the top-level imports to include unawaited and replace the
direct call to widgetElement._disposeCamera() in dispose() with an
unawaited(...) call.
- Around line 522-533: The returned photo metadata uses
_cameraController!.value.previewSize which is the preview stream size and may
not match the saved image; fix takePicture handling by reading the captured file
bytes (via XFile.readAsBytes or similar) and decode the actual image dimensions
using decodeImageFromList (or equivalent image decoder) to obtain real
width/height, then populate result['width'] and result['height'] with those
decoded values before dispatchEvent(CustomEvent('photocaptured', detail:
result)) and returning result (use a Completer/Future to await
decodeImageFromList since it is asynchronous).
In @native_uis/webf_camera/pubspec.yaml:
- Around line 6-8: Update the Flutter SDK constraint in the pubspec.yaml
environment block to match the Dart SDK requirement: replace the current flutter
constraint (the "flutter" entry under environment) with a minimum of 3.27.0 so
it remains compatible with Dart SDK ^3.6.0; ensure the environment section
contains sdk: ^3.6.0 and flutter: >=3.27.0.
In @native_uis/webf_camera/README.md:
- Around line 75-127: Update the Vue documentation block to avoid referencing
the non-existent npm package "@openwebf/vue-camera": either remove the entire
"Vue" section or replace it with a short note that Vue support is planned for a
future release and the example usage (FlutterCamera, cameraRef, takePicture,
handleCameraReady/handlePhotoCaptured/handleCameraFailed) is illustrative only;
ensure no install command or import statement for "@openwebf/vue-camera" remains
in the README and, if keeping an example, mark all component names and handlers
as hypothetical and not currently available on npm.
🧹 Nitpick comments (10)
native_uis/webf_camera/lib/src/tsconfig.json (1)
1-8: Consider adding declaration-related compiler options.The strict mode is correctly enabled per project guidelines. For a library containing
.d.tsdeclaration files, consider adding these options for better type checking:💡 Optional enhancement
{ "compilerOptions": { "target": "ES2020", "module": "CommonJS", - "strict": true + "strict": true, + "skipLibCheck": false, + "noEmit": true }, "include": ["./"] }native_uis/webf_camera/pubspec.yaml (1)
22-27: Consider adding repository and issue_tracker fields.For better pub.dev discoverability and contribution workflows, consider adding:
repository: https://github.com/openwebf/webf issue_tracker: https://github.com/openwebf/webf/issuesnative_uis/webf_camera/lib/src/logger.dart (2)
8-34: Consider conditional log levels based on build mode.Both loggers will output in release builds. Consider using
kReleaseModefromfoundation.dartto disable or reduce logging in production:♻️ Suggested improvement
+import 'package:flutter/foundation.dart'; import 'package:logger/logger.dart'; /// Global logger instance for WebF Camera final Logger logger = Logger( printer: PrettyPrinter( methodCount: 0, errorMethodCount: 0, lineLength: 80, colors: true, printEmojis: true, dateTimeFormat: DateTimeFormat.onlyTimeAndSinceStart, noBoxingByDefault: true, ), - level: Level.debug, + level: kReleaseMode ? Level.warning : Level.debug, );
22-34: Clarify the intended usage of devLogger vs logger.Having two global logger instances may cause confusion for developers about which one to use. Consider either:
- Documenting clear usage guidelines in the docstrings
- Consolidating into a single logger with configurable verbosity
- Making
devLoggerpackage-private if it's only for internal debuggingnative_uis/webf_camera/.gitignore (2)
82-82: Consider committing pubspec.lock for this package.According to Dart best practices, packages should commit their
pubspec.lockfile to ensure reproducible builds in CI and consistent dependency resolution across the team. This differs from applications where lock files are typically ignored.However, if this is intentional (e.g., the package is only consumed internally and you want consumers to always resolve fresh dependencies), this can remain as-is.
76-76: Remove irrelevant exception path.This exception path appears to be copied from Flutter SDK's template and is not applicable to this package:
-!/packages/flutter_tools/test/data/dart_dependencies_test/**/.packagesnative_uis/webf_camera/tsconfig.json (1)
16-18: Minor: Redundant include pattern.
**/*.d.tsalready coverslib/**/*.d.ts. Consider simplifying to just one pattern. This is purely cosmetic.Optional simplification
"include": [ - "lib/**/*.d.ts", "**/*.d.ts" ],use_cases/src/pages/WebFCameraPage.tsx (1)
106-115: Consider removingasynckeyword from event-driven action handlers.These functions (
takePicture,toggleRecording,switchCamera) are markedasyncbut don'tawaitanything - they fire synchronous method calls and rely on event handlers for results. Theasynckeyword is unnecessary and could mislead readers into thinking there's promise-based flow control.Optional cleanup
-const takePicture = async () => { +const takePicture = () => { if (!cameraRef.current || !isCameraReady) return; setIsProcessing(prev => ({ ...prev, capture: true })); try { cameraRef.current.takePicture(); } catch (error) { // ... } };Apply similarly to
toggleRecording,switchCamera,cycleFlashMode, andhandleZoomChange.Also applies to: 117-130, 132-141
native_uis/webf_camera/lib/src/camera.d.ts (2)
90-142: Consider using the defined union types instead ofstringfor stronger type safety.The properties
facing,resolution,flash-mode,focus-mode, andexposure-modeare typed asstring, but corresponding union types are already defined at the top of this file. Using those types would provide better autocomplete and catch invalid values at compile time.♻️ Suggested improvement
interface FlutterCameraProperties { /** * Camera facing direction. * @default 'back' */ - facing?: string; + facing?: CameraFacing; /** * Resolution preset. * @default 'high' */ - resolution?: string; + resolution?: ResolutionPreset; /** * Flash mode. * @default 'auto' */ - 'flash-mode'?: string; + 'flash-mode'?: FlashMode; // ... zoom, exposure-offset remain as-is ... /** * Focus mode. * @default 'auto' */ - 'focus-mode'?: string; + 'focus-mode'?: FocusMode; /** * Exposure mode. * @default 'auto' */ - 'exposure-mode'?: string; + 'exposure-mode'?: ExposureMode; }
169-170: UseFlashModetype for the mode parameter.For consistency with the type definitions and better type safety, use the
FlashModeunion type.♻️ Suggested fix
/** Set flash mode. */ - setFlashMode(mode: string): Promise<void>; + setFlashMode(mode: FlashMode): Promise<void>;
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (2)
use_cases/package-lock.jsonis excluded by!**/package-lock.jsonuse_cases/pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (26)
native_uis/webf_camera/.gitignorenative_uis/webf_camera/LICENSEnative_uis/webf_camera/README.mdnative_uis/webf_camera/analysis_options.yamlnative_uis/webf_camera/lib/src/camera.d.tsnative_uis/webf_camera/lib/src/camera.dartnative_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/src/global.d.tsnative_uis/webf_camera/lib/src/logger.dartnative_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/lib/webf_camera.dartnative_uis/webf_camera/pubspec.yamlnative_uis/webf_camera/tsconfig.jsonuse_cases/package.jsonuse_cases/src/App.tsxuse_cases/src/pages/FeatureCatalogPage.tsxuse_cases/src/pages/WebFCameraPage.tsxwebf/example/lib/main.dartwebf/example/macos/Runner.xcodeproj/project.pbxprojwebf/example/pubspec.yamlwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.ccwebf/ios/Classes/code_gen/qjs_html_option_element.ccwebf/ios/Classes/code_gen/qjs_html_select_element.ccwebf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/core/html/forms/html_option_element.ccwebf/ios/Classes/core/html/forms/html_select_element.cc
🧰 Additional context used
📓 Path-based instructions (2)
webf/**/*.dart
📄 CodeRabbit inference engine (webf/CLAUDE.md)
webf/**/*.dart: Follow rules in webf/analysis_options.yaml for Dart code style
Use single quotes for strings in Dart code
File names must use snake_case in Dart
Class names must use PascalCase in Dart
Variables and functions must use camelCase in Dart
Prefer final fields when applicable in Dart code
Lines should be max 120 characters in Dart code
Always free allocated memory in Dart FFI using malloc.free() for toNativeUtf8() allocations
Free FFI allocated memory in finally blocks to ensure cleanup on exceptions
Track ownership of allocated pointers in FFI callbacks
Free NativeValue pointers after converting with fromNativeValue in FFI code
Document memory ownership clearly in FFI async callbacks
Implement WidgetElement to create custom Flutter widgets integrated into WebF's DOM tree
Register custom WidgetElements using WidgetElementRegistry.register(tagName, builder)
Override buildWidget(BuildContext context) method in WidgetElement to build the Flutter widget
Call updateWidget() when attributes change in WidgetElement implementations
Dispose controllers and subscriptions in WidgetElement for memory management
Follow W3C event standards when dispatching events from WidgetElement
Minimize widget rebuilds in WidgetElement for performance optimization
Implement ARIA attributes in WidgetElement when applicable for accessibilityDart code in webf module must follow naming conventions: snake_case for file names, PascalCase for classes, and camelCase for class members
webf/**/*.dart: Always free allocated memory in Dart FFI
Usemalloc.free()fortoNativeUtf8()allocations in Dart FFI
Track pointer ownership in callbacks within Dart FFI
Files:
webf/example/lib/main.dart
{bridge/**/*.{cc,h},webf/**/*.dart}
📄 CodeRabbit inference engine (CLAUDE.md)
Document memory ownership clearly in FFI implementations
Files:
webf/example/lib/main.dart
🧠 Learnings (53)
📓 Common learnings
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Implement WidgetElement to create custom Flutter widgets integrated into WebF's DOM tree
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: No build needed for Dart-only changes in webf/
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: Applies to docs/**/*.md : Clarify that WebF builds Flutter apps, not web apps in documentation
📚 Learning: 2025-12-08T23:28:11.651Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-08T23:28:11.651Z
Learning: Applies to cli/**/*.ts : TypeScript code in cli module must use strict TypeScript configuration
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/polyfill/**/*.{ts,tsx,d.ts} : Include a reference to `webf.d.ts` in polyfill type generation for accessing core types like `EventTarget`
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/lib/src/global.d.tsnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-11-26T10:24:13.090Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: cli/CLAUDE.md:0-0
Timestamp: 2025-11-26T10:24:13.090Z
Learning: Update documentation when adding new features, along with TypeScript interfaces, tests, and templates
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/README.mdnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/polyfill/**/*.{ts,tsx,d.ts} : Use Rollup with `rollup-plugin-dts` to generate types from `bridge/polyfill/src` into `bridge/typings/polyfill.d.ts`
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/polyfill/**/*.{ts,tsx} : DO NOT manually edit `bridge/typings/polyfill.d.ts` - it is generated from polyfill TypeScript source
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/core/**/*.d.ts : Scan all `.d.ts` files in `bridge/core/` directory and merge them into a single `bridge/typings/webf.d.ts` file using the `merge-bridge-typings` task
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/core/**/*.d.ts : DO NOT manually edit `bridge/typings/webf.d.ts` - it is generated from bridge/core/*.d.ts
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/lib/src/global.d.tsnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-11-26T10:24:13.090Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: cli/CLAUDE.md:0-0
Timestamp: 2025-11-26T10:24:13.090Z
Learning: Applies to cli/**/*.ts : Auto-detect and create missing project files (package.json, global.d.ts, tsconfig.json) when running codegen without an existing project
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/polyfill/rollup.config.dts.js : Use `rollup.config.dts.js` in `bridge/polyfill/` directory as the configuration for Rollup-based type generation
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-12-08T23:27:27.888Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: integration_tests/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:27.888Z
Learning: Applies to integration_tests/specs/**/*.ts : Use TypeScript (.ts extension) for test files
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.jsonnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-11-26T10:24:13.090Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: cli/CLAUDE.md:0-0
Timestamp: 2025-11-26T10:24:13.090Z
Learning: Use TypeScript strict mode
Applied to files:
native_uis/webf_camera/lib/src/tsconfig.json
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/typings/index.d.ts : Configure `bridge/typings/index.d.ts` to reference both `webf.d.ts` and `polyfill.d.ts` and re-export polyfill module exports for a unified interface
Applied to files:
native_uis/webf_camera/lib/src/global.d.tsnative_uis/webf_camera/tsconfig.json
📚 Learning: 2025-11-26T10:24:13.090Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: cli/CLAUDE.md:0-0
Timestamp: 2025-11-26T10:24:13.090Z
Learning: Applies to cli/**/*.ts : Handle HTML attribute type conversion automatically: booleans use 'value == true || value == empty', integers use int.tryParse with default 0, doubles use double.tryParse with default 0.0, strings use direct assignment
Applied to files:
native_uis/webf_camera/lib/src/global.d.ts
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/core/**/*.d.ts : Create a `webf` namespace containing all type exports from merged bridge core types
Applied to files:
native_uis/webf_camera/lib/src/global.d.ts
📚 Learning: 2025-12-08T23:27:41.357Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: scripts/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:41.357Z
Learning: Applies to scripts/bridge/core/**/*.d.ts : Transform WebF-specific type annotations: `DartImpl<T>` → `T`, `StaticMember<T>` → `T`, `StaticMethod<T>` → `T`, `SupportAsync<T>` → generates both sync and async variants, `DependentsOnLayout<T>` → `T`
Applied to files:
native_uis/webf_camera/lib/src/global.d.tsnative_uis/webf_camera/lib/src/camera.d.ts
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Follow rules in webf/analysis_options.yaml for Dart code style
Applied to files:
native_uis/webf_camera/analysis_options.yamlnative_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-21T14:42:52.637Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/AGENTS.md:0-0
Timestamp: 2025-12-21T14:42:52.637Z
Learning: Applies to bridge/webf/**/*.dart : Dart code in webf must follow `webf/analysis_options.yaml` with files named in `snake_case.dart`, types in `PascalCase`, and members in `camelCase`
Applied to files:
native_uis/webf_camera/analysis_options.yamlnative_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Lint with: npm run lint (runs flutter analyze in webf directory)
Applied to files:
native_uis/webf_camera/analysis_options.yaml
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: No build needed for Dart-only changes in webf/
Applied to files:
webf/example/lib/main.dartwebf/ios/Classes/core/dart_binding_object.ccnative_uis/webf_camera/lib/webf_camera.dartwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.ccwebf/example/pubspec.yamlnative_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Prefer final fields when applicable in Dart code
Applied to files:
webf/example/lib/main.dartnative_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/webf_camera.dartnative_uis/webf_camera/lib/src/camera.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Run Flutter dart tests with: cd webf && flutter test
Applied to files:
webf/example/lib/main.dartnative_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/test/**/*_test.dart : When testing with WebFController, wait for initialization with: await controller.controlledInitCompleter.future
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/test/**/*_test.dart : Use mock bundles from test/src/foundation/mock_bundle.dart for testing in unit tests
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:11.651Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-08T23:28:11.651Z
Learning: Applies to webf/**/*.dart : Dart code in webf module must follow naming conventions: snake_case for file names, PascalCase for classes, and camelCase for class members
Applied to files:
webf/example/lib/main.dartwebf/example/pubspec.yamlnative_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/ios/webf_ios.podspec : Ensure all source files, particularly `member_installer.cc`, are included in the `source_files` pattern in `ios/webf_ios.podspec`
Applied to files:
webf/ios/Classes/code_gen/qjs_html_option_element.ccwebf/ios/Classes/code_gen/qjs_html_select_element.ccwebf/ios/Classes/core/dart_binding_object.ccwebf/example/macos/Runner.xcodeproj/project.pbxprojwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.ccwebf/ios/Classes/core/html/forms/html_option_element.ccwebf/ios/Classes/core/html/forms/html_select_element.cc
📚 Learning: 2025-12-13T16:32:47.644Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: For cross-language features, search both C++ (.cc/.h) and Dart (.dart) files
Applied to files:
native_uis/webf_camera/.gitignore
📚 Learning: 2025-11-26T10:24:13.090Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: cli/CLAUDE.md:0-0
Timestamp: 2025-11-26T10:24:13.090Z
Learning: Applies to cli/**/*.ts : Use the logger utility (debug, info, warn, error from './logger') for debugging instead of console methods
Applied to files:
native_uis/webf_camera/lib/src/logger.dart
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/**/*.{cc,cpp,h,hpp} : Use `WEBF_EXPORT_C` macro for exporting C functions to Dart FFI
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccnative_uis/webf_camera/lib/webf_camera.dartwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/lib/bridge.dart : lib/bridge.dart contains FFI bindings to C++ bridge
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccnative_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/webf_camera.dartwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/**/*.{cc,cpp,h,hpp} : For C++ FFI function naming: use `GetObjectPropertiesFromDart` for C++ exports, `NativeGetObjectPropertiesFunc` for Dart typedefs, and `GetObjectPropertiesFunc` for Dart functions
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccnative_uis/webf_camera/lib/src/camera_bindings_generated.dartwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-13T16:32:47.644Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: Applies to {bridge/**/*.{cc,h},webf/**/*.dart} : Document memory ownership clearly in FFI implementations
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/**/*.{cc,cpp,h,hpp} : In FFI contexts, use `Dart_Handle` instead of `Handle` for type compatibility
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-13T16:32:47.644Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: Applies to bridge/**/*.{cc,h} : Use `PostToDart` for returning results to Dart isolate
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/ios/webf_ios.podspec : Include all necessary C++ bridge source files with pattern `bridge/**/*.{h,cc,cpp}` and bindings with `bridge/bindings/**/*.{h,cc}` in the iOS podspec source_files
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/example/macos/Runner.xcodeproj/project.pbxprojwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/**/*.{cc,cpp} : For async FFI operations, use `Dart_NewPersistentHandle_DL` to keep Dart objects alive, convert back with `Dart_HandleFromPersistent_DL` before use, and always call `Dart_DeletePersistentHandle_DL` after the async operation completes
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: Applies to bridge/**/*.{cc,cpp} : Use PostToJs for executing operations on the JS thread from other threads, PostToDart for returning results to Dart isolate, and avoid PostToJsSync to prevent deadlocks
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-13T16:32:47.644Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: Applies to webf/**/*.dart : Track pointer ownership in callbacks within Dart FFI
Applied to files:
webf/ios/Classes/core/dart_binding_object.ccwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Track ownership of allocated pointers in FFI callbacks
Applied to files:
webf/ios/Classes/core/dart_binding_object.cc
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Call updateWidget() when attributes change in WidgetElement implementations
Applied to files:
native_uis/webf_camera/lib/src/camera_bindings_generated.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Implement ARIA attributes in WidgetElement when applicable for accessibility
Applied to files:
native_uis/webf_camera/lib/src/camera_bindings_generated.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Override buildWidget(BuildContext context) method in WidgetElement to build the Flutter widget
Applied to files:
native_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/webf_camera.dartnative_uis/webf_camera/lib/src/camera.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Implement WidgetElement to create custom Flutter widgets integrated into WebF's DOM tree
Applied to files:
native_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/webf_camera.dartnative_uis/webf_camera/pubspec.yamlnative_uis/webf_camera/lib/src/camera.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Minimize widget rebuilds in WidgetElement for performance optimization
Applied to files:
native_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/src/camera.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Register custom WidgetElements using WidgetElementRegistry.register(tagName, builder)
Applied to files:
native_uis/webf_camera/lib/src/camera_bindings_generated.dartnative_uis/webf_camera/lib/webf_camera.dart
📚 Learning: 2025-12-08T23:27:15.946Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: bridge/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:27:15.946Z
Learning: For iOS build errors, verify file inclusion by checking `ios/webf_ios.podspec` for missing source files and `CMakeLists.txt` for C++ build configuration
Applied to files:
webf/example/macos/Runner.xcodeproj/project.pbxprojwebf/ios/Classes/bindings/qjs/qjs_dart_binding_object.ccwebf/ios/Classes/core/html/forms/html_select_element.cc
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Variables and functions must use camelCase in Dart
Applied to files:
native_uis/webf_camera/lib/webf_camera.dartnative_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-08T23:28:11.651Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-08T23:28:11.651Z
Learning: Applies to webf/test/**/*.dart : Dart/Flutter widget and unit tests must be placed in `webf/test/` and use `WebFWidgetTestUtils` and `pumpAndSettle()` where needed
Applied to files:
native_uis/webf_camera/lib/webf_camera.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/test/**/*_test.dart : Use WebFWidgetTestUtils.prepareWidgetTest() to test HTML/CSS rendering in widget unit tests
Applied to files:
native_uis/webf_camera/lib/webf_camera.dart
📚 Learning: 2025-12-08T23:28:11.651Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-08T23:28:11.651Z
Learning: Applies to webf/integration_test/**/*.dart : Dart/Flutter integration tests must be placed in `webf/integration_test/` directory
Applied to files:
webf/example/pubspec.yaml
📚 Learning: 2025-12-13T16:32:47.644Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: Applies to docs/**/*.md : Clarify that WebF builds Flutter apps, not web apps in documentation
Applied to files:
native_uis/webf_camera/pubspec.yaml
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Document memory ownership clearly in FFI async callbacks
Applied to files:
native_uis/webf_camera/lib/src/camera.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Dispose controllers and subscriptions in WidgetElement for memory management
Applied to files:
native_uis/webf_camera/lib/src/camera.dart
🧬 Code graph analysis (1)
use_cases/src/App.tsx (1)
use_cases/src/pages/WebFCameraPage.tsx (1)
WebFCameraPage(38-408)
🪛 LanguageTool
native_uis/webf_camera/README.md
[uncategorized] ~296-~296: The operating system from Apple is written “macOS”.
Context: ...minSdkVersion 21 ### macOS Add to `macos/Runner/Info.plist`: xml NSCame...
(MAC_OS)
[uncategorized] ~305-~305: The operating system from Apple is written “macOS”.
Context: ... video with audio. ``` Add to macos/Runner/DebugProfile.entitlements and `...
(MAC_OS)
[uncategorized] ~305-~305: The operating system from Apple is written “macOS”.
Context: ...s/Runner/DebugProfile.entitlementsandmacos/Runner/Release.entitlements`: ```xml <...
(MAC_OS)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
- GitHub Check: build_windows_bridge (Debug)
- GitHub Check: Build Android Bridge
- GitHub Check: Analyze (javascript-typescript)
- GitHub Check: Analyze (c-cpp)
- GitHub Check: Analyze (rust)
🔇 Additional comments (25)
native_uis/webf_camera/LICENSE (1)
1-201: LGTM! Standard Apache License 2.0 added for the camera plugin.The addition of the Apache License 2.0 is appropriate for this new native UI plugin package. The copyright notice correctly attributes ownership to "The OpenWebF Authors" for 2025.
webf/example/macos/Runner.xcodeproj/project.pbxproj (1)
269-269: LGTM — Auto-generated CocoaPods framework embedding.The
objective_c.frameworkis correctly added to bothinputPathsandoutputPathsof the Embed Pods Frameworks phase, maintaining alphabetical order. This is a standard transitive dependency addition, likely pulled in by Flutter plugins that use Objective-C interop for macOS platform APIs.Also applies to: 288-288
webf/ios/Classes/bindings/qjs/qjs_dart_binding_object.cc (1)
1-1: Consistent with established iOS build pattern.This follows the same forwarding pattern as other binding files, enabling code reuse between platforms. The relative path depth (4 levels up from
bindings/qjs/) correctly resolves to the source implementation atwebf/src/bindings/qjs/qjs_dart_binding_object.cc.webf/ios/Classes/core/dart_binding_object.cc (1)
1-1: Pattern is well-established and properly configured.The .cc inclusion pattern is systematic throughout the iOS build—hundreds of similar files exist in
webf/ios/Classes/. The target file exists atwebf/src/core/dart_binding_object.cc, and the iOS podspec'ssource_files = 'Classes/**/*'configuration will automatically include this file in the build.webf/ios/Classes/code_gen/qjs_html_select_element.cc (1)
1-1: Clarify the connection between HTML select element bindings and the camera plugin PR objectives.This file was added as part of a commit titled "camera usage cases," but the code adds HTML select element QuickJS bindings. Clarify whether these changes are intentional, required for the camera plugin, or if they should be separated into a different PR.
Note: The podspec configuration is correct —
Classes/**/*recursively includes all source files, including this bridging file.webf/ios/Classes/code_gen/qjs_html_option_element.cc (1)
1-1: This file will fail to compile: the included source file does not exist.The iOS wrapper file includes
../../../src/code_gen/qjs_html_option_element.cc, which resolves tobridge/code_gen/qjs_html_option_element.cc. This file does not exist in the repository.This issue affects all 38+
qjs_html_*.ccfiles inwebf/ios/Classes/code_gen/— each attempting to include a non-existent source file frombridge/code_gen/. The entire iOS build will fail during compilation.Either the target source files must be generated/added to
bridge/code_gen/, or the include paths must be corrected to point to the actual location of these implementations.⛔ Skipped due to learnings
Learnt from: CR Repo: openwebf/webf PR: 0 File: bridge/CLAUDE.md:0-0 Timestamp: 2025-12-08T23:27:15.946Z Learning: Applies to bridge/ios/webf_ios.podspec : Ensure all source files, particularly `member_installer.cc`, are included in the `source_files` pattern in `ios/webf_ios.podspec`Learnt from: CR Repo: openwebf/webf PR: 0 File: bridge/CLAUDE.md:0-0 Timestamp: 2025-12-08T23:27:15.946Z Learning: For iOS build errors, verify file inclusion by checking `ios/webf_ios.podspec` for missing source files and `CMakeLists.txt` for C++ build configurationLearnt from: CR Repo: openwebf/webf PR: 0 File: bridge/CLAUDE.md:0-0 Timestamp: 2025-12-08T23:27:15.946Z Learning: Applies to bridge/ios/webf_ios.podspec : Include all necessary C++ bridge source files with pattern `bridge/**/*.{h,cc,cpp}` and bindings with `bridge/bindings/**/*.{h,cc}` in the iOS podspec source_filesnative_uis/webf_camera/analysis_options.yaml (1)
1-4: LGTM!Standard Flutter analysis options configuration using
flutter_lintspackage. This aligns with Flutter best practices for linting.webf/example/pubspec.yaml (1)
37-38: LGTM!The path dependency follows the same pattern as
webf_video_playerand other native UI plugins in the project.native_uis/webf_camera/README.md (1)
1-316: Comprehensive and well-structured documentation.The README covers installation, setup, multi-framework usage examples (React, Vue, HTML, JavaScript), properties, methods, events, error codes, and platform configuration. This is excellent for developer onboarding.
use_cases/package.json (1)
6-6: No issues identified. The@openwebf/react-camerapackage is published on npm (version 1.0.0) and can be safely added as a dependency.native_uis/webf_camera/lib/webf_camera.dart (1)
1-27: LGTM! Clean and well-documented installation entry point.The implementation follows established patterns used by other WebF plugins (
installWebFCupertinoUI,installWebFVideoPlayer). The documentation with example usage is helpful for consumers of this package.webf/example/lib/main.dart (3)
26-26: LGTM! Import correctly placed with other WebF plugin imports.
32-32: Verify the port change from 5175 to 5176.The demo entry URL port was changed. Please confirm this is intentional and that the development server configuration has been updated accordingly.
42-42: LGTM! Camera plugin installation follows the established pattern.The
installWebFCamera()call is correctly placed alongside other WebF plugin installations.native_uis/webf_camera/pubspec.yaml (1)
14-14: Thecamera: ^0.11.0dependency is valid and appropriate. The latest available version on pub.dev is 0.11.3, which falls within the specified constraint and provides the most current release in the 0.11.x series.native_uis/webf_camera/lib/src/camera_bindings_generated.dart (1)
1-132: LGTM - Auto-generated bindings follow expected patterns.The bindings correctly map HTML attributes (kebab-case like
flash-mode) to Dart properties (camelCase likeflashMode). Boolean attribute handling properly treats empty string astrueper HTML attribute conventions. Based on learnings, this follows the expected WidgetElement pattern.native_uis/webf_camera/lib/src/camera.dart (1)
179-724: Well-structured camera implementation following WebF patterns.The implementation correctly:
- Uses
WidgetElementpattern with proper state management- Caches zoom/exposure limits after initialization
- Handles camera switching with proper controller disposal
- Dispatches events for JS consumption (
cameraready,photocaptured, etc.)- Applies settings only when initialized
Based on learnings, this follows the expected pattern of calling
updateWidget()(viarequestUpdateState) when attributes change.use_cases/src/pages/FeatureCatalogPage.tsx (1)
125-125: LGTM - Catalog entry added correctly.The new entry follows the established pattern and the path
/webf-cameraaligns with the route definition inApp.tsx.native_uis/webf_camera/lib/src/global.d.ts (1)
1-2: LGTM - Type aliases provide semantic clarity for Dart interop.The
doubleandintaliases make the TypeScript declarations more readable when mirroring Dart's type system, while correctly resolving to JavaScript'snumbertype at runtime.use_cases/src/App.tsx (1)
22-22: LGTM - Route correctly integrated.Import and route definition follow the established patterns. The path
/webf-camerais consistent with the feature catalog entry.Also applies to: 223-223
use_cases/src/pages/WebFCameraPage.tsx (2)
177-408: Well-implemented camera demo page with comprehensive functionality.The component demonstrates:
- Proper ref usage for imperative camera control
- Good UX with loading indicators and status feedback
- Comprehensive error handling
- Helpful usage guide with code examples
The event-driven architecture aligns with the Dart implementation's custom event dispatching.
6-36: No action needed. The local type definitions forCameraReadyDetail,CameraCaptureResult,CameraVideoResult,CameraErrorDetail, andCameraSwitchedDetailare appropriate as they define event detail types specific to theFlutterCameraElementcomponent. The@openwebf/react-cameranpm package does not export these types, making the local definitions necessary.native_uis/webf_camera/lib/src/camera.d.ts (3)
6-29: Well-defined union types for camera configuration.These type aliases provide good type safety for camera settings. They should be leveraged in the properties and method interfaces below.
206-239: Event interface is well-structured.The event types appropriately map to their detail payloads and follow standard naming conventions.
34-50: No action needed—intanddoubletype aliases are already properly declared.The global.d.ts file declares these types as aliases for
number(type int = number;andtype double = number;), making them available throughout the project including in this file. No compilation errors should occur.
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In @package.json:
- Around line 58-59: The dependency "@openwebf/vue-camera" is declared at the
root but is used only as a type-only import in vue_usecases; remove the entry
from the root package.json and add the same dependency (same version spec
"^1.0.0") to the vue_usecases/package.json dependencies so it is installed only
for that workspace; after moving, run the workspace install (or update lockfile)
to ensure the change is reflected and verify that
vue_usecases/src/pages/WebFCameraPage.vue type imports resolve correctly.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (8)
native_uis/webf_camera/README.mdnative_uis/webf_camera/pubspec.yamlpackage.jsonvue_usecases/src/App.vuevue_usecases/src/pages/FeatureCatalogPage.vuevue_usecases/src/pages/WebFCameraPage.vuevue_usecases/src/routes.tswebf/example/lib/main.dart
🚧 Files skipped from review as they are similar to previous changes (1)
- native_uis/webf_camera/pubspec.yaml
🧰 Additional context used
📓 Path-based instructions (2)
webf/**/*.dart
📄 CodeRabbit inference engine (webf/CLAUDE.md)
webf/**/*.dart: Follow rules in webf/analysis_options.yaml for Dart code style
Use single quotes for strings in Dart code
File names must use snake_case in Dart
Class names must use PascalCase in Dart
Variables and functions must use camelCase in Dart
Prefer final fields when applicable in Dart code
Lines should be max 120 characters in Dart code
Always free allocated memory in Dart FFI using malloc.free() for toNativeUtf8() allocations
Free FFI allocated memory in finally blocks to ensure cleanup on exceptions
Track ownership of allocated pointers in FFI callbacks
Free NativeValue pointers after converting with fromNativeValue in FFI code
Document memory ownership clearly in FFI async callbacks
Implement WidgetElement to create custom Flutter widgets integrated into WebF's DOM tree
Register custom WidgetElements using WidgetElementRegistry.register(tagName, builder)
Override buildWidget(BuildContext context) method in WidgetElement to build the Flutter widget
Call updateWidget() when attributes change in WidgetElement implementations
Dispose controllers and subscriptions in WidgetElement for memory management
Follow W3C event standards when dispatching events from WidgetElement
Minimize widget rebuilds in WidgetElement for performance optimization
Implement ARIA attributes in WidgetElement when applicable for accessibilityDart code in webf module must follow naming conventions: snake_case for file names, PascalCase for classes, and camelCase for class members
webf/**/*.dart: Always free allocated memory in Dart FFI
Usemalloc.free()fortoNativeUtf8()allocations in Dart FFI
Track pointer ownership in callbacks within Dart FFI
Files:
webf/example/lib/main.dart
{bridge/**/*.{cc,h},webf/**/*.dart}
📄 CodeRabbit inference engine (CLAUDE.md)
Document memory ownership clearly in FFI implementations
Files:
webf/example/lib/main.dart
🧠 Learnings (10)
📓 Common learnings
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Implement WidgetElement to create custom Flutter widgets integrated into WebF's DOM tree
Learnt from: CR
Repo: openwebf/webf PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-13T16:32:47.644Z
Learning: Applies to docs/**/*.md : Clarify that WebF builds Flutter apps, not web apps in documentation
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: No build needed for Dart-only changes in webf/
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Prefer final fields when applicable in Dart code
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/**/*.dart : Variables and functions must use camelCase in Dart
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Run Flutter dart tests with: cd webf && flutter test
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/test/**/*_test.dart : When testing with WebFController, wait for initialization with: await controller.controlledInitCompleter.future
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:00.818Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: webf/CLAUDE.md:0-0
Timestamp: 2025-12-08T23:28:00.818Z
Learning: Applies to webf/test/**/*_test.dart : Use mock bundles from test/src/foundation/mock_bundle.dart for testing in unit tests
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:11.651Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-08T23:28:11.651Z
Learning: Applies to webf/**/*.dart : Dart code in webf module must follow naming conventions: snake_case for file names, PascalCase for classes, and camelCase for class members
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-12-08T23:28:11.651Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-08T23:28:11.651Z
Learning: Applies to webf/test/**/*.dart : Dart/Flutter widget and unit tests must be placed in `webf/test/` and use `WebFWidgetTestUtils` and `pumpAndSettle()` where needed
Applied to files:
webf/example/lib/main.dart
📚 Learning: 2025-11-26T10:24:13.090Z
Learnt from: CR
Repo: openwebf/webf PR: 0
File: cli/CLAUDE.md:0-0
Timestamp: 2025-11-26T10:24:13.090Z
Learning: Update documentation when adding new features, along with TypeScript interfaces, tests, and templates
Applied to files:
native_uis/webf_camera/README.md
🪛 LanguageTool
native_uis/webf_camera/README.md
[uncategorized] ~297-~297: The operating system from Apple is written “macOS”.
Context: ...minSdkVersion 21 ### macOS Add to `macos/Runner/Info.plist`: xml NSCame...
(MAC_OS)
[uncategorized] ~306-~306: The operating system from Apple is written “macOS”.
Context: ... video with audio. ``` Add to macos/Runner/DebugProfile.entitlements and `...
(MAC_OS)
[uncategorized] ~306-~306: The operating system from Apple is written “macOS”.
Context: ...s/Runner/DebugProfile.entitlementsandmacos/Runner/Release.entitlements`: ```xml <...
(MAC_OS)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Analyze (c-cpp)
🔇 Additional comments (10)
vue_usecases/src/pages/FeatureCatalogPage.vue (1)
119-119: LGTM!The new catalog entry for WebF Camera follows the existing pattern and correctly references the
/webf-cameraroute defined in routes.ts.native_uis/webf_camera/README.md (1)
1-317: Well-documented plugin with comprehensive usage examples.The README provides thorough documentation covering installation, setup, framework-specific usage (React, Vue, HTML/JS), properties, methods, events, error codes, and platform-specific configuration. The static analysis hints about "macOS" capitalization are false positives—the section heading correctly uses "macOS" while file paths correctly use lowercase
macos.webf/example/lib/main.dart (2)
26-26: LGTM!The camera plugin integration follows the established pattern—importing the package and calling
installWebFCamera()alongside other WebF UI plugin installations. The placement afterinstallWebFCupertinoUI()is consistent with the ordering of other native UI plugins.Also applies to: 42-42
32-32: Verify the demo URL port change is intentional.The demo entry URL port changed from
5175to5173. Port 5173 is Vite's default, but this change could affect developers who were previously running on port 5175.vue_usecases/src/pages/WebFCameraPage.vue (4)
1-50: LGTM!The type definitions and reactive state are well-structured. The type-only import pattern from
@openwebf/vue-camerais correct for Vue custom elements, and the event interfaces align with the camera API defined in the Dart bindings.
71-133: LGTM!The event handlers and action methods properly manage state transitions and include error handling. The pattern of setting
isProcessingflags before calling methods and resetting them in event handlers correctly prevents duplicate operations during async actions.
135-198: LGTM!The remaining methods (
toggleRecording,switchCamera,cycleFlashMode,handleZoomChange) follow a consistent pattern with proper guard checks, error handling, and state management. ThegetFlashIconfunction uses hardcoded HTML entities which is safe for use withv-html.
201-397: LGTM!The template is well-organized with a clear separation of concerns: camera preview, controls, status/error displays, captured media previews, and usage documentation. The initialization overlay and disabled button states provide good UX during camera startup and processing.
vue_usecases/src/routes.ts (1)
23-23: LGTM!The new route entry follows the established pattern with async component loading and is correctly positioned among the feature catalog routes. The path
/webf-cameraaligns with the catalog entry in FeatureCatalogPage.vue.vue_usecases/src/App.vue (1)
2-3: LGTM!The refactor from static page rendering to dynamic route-based rendering is a clean architectural improvement. The
v-foriteration overappRouteswith proper:keybinding enables scalable route management—new routes can now be added simply by updatingroutes.tswithout modifyingApp.vue.Also applies to: 13-22
1 participant
Summary
webf_cameranative UI plugin that provides camera capture functionality for WebF appsSummary by CodeRabbit
New Features
Documentation
Chores
✏️ Tip: You can customize this high-level summary in your review settings.