feat: support Path2D to js

bridge/CMakeLists.txt

@@ -372,6 +372,7 @@ if ($ENV{WEBF_JS_ENGINE} MATCHES "quickjs")
     core/html/canvas/canvas_rendering_context_2d.cc
     core/html/canvas/canvas_gradient.cc
     core/html/canvas/canvas_pattern.cc
+    core/html/canvas/path_2d.cc
     core/geometry/dom_matrix.cc
     core/geometry/dom_matrix_readonly.cc
     core/html/forms/html_button_element.cc
@@ -502,6 +503,7 @@ if ($ENV{WEBF_JS_ENGINE} MATCHES "quickjs")
     out/qjs_canvas_rendering_context.cc
     out/qjs_canvas_gradient.cc
     out/qjs_canvas_pattern.cc
+    out/qjs_path_2d.cc
     out/qjs_dom_matrix.cc
     out/qjs_dom_matrix_readonly.cc
     out/qjs_union_dom_string_sequencedouble.cc
@@ -517,6 +519,7 @@ if ($ENV{WEBF_JS_ENGINE} MATCHES "quickjs")
     out/qjs_promise_rejection_event_init.cc
     out/qjs_unionevent_listener_options_boolean.cc
     out/qjs_unionadd_event_listener_options_boolean.cc
+    out/qjs_unionpath_2_d_dom_string.cc
     out/qjs_html_template_element.cc
     out/qjs_html_unknown_element.cc
     out/qjs_performance.cc

bridge/bindings/qjs/binding_initializer.cc

@@ -11,6 +11,7 @@
 #include "qjs_bounding_client_rect.h"
 #include "qjs_canvas_gradient.h"
 #include "qjs_canvas_pattern.h"
+#include "qjs_path_2d.h"
 #include "qjs_canvas_rendering_context.h"
 #include "qjs_canvas_rendering_context_2d.h"
 #include "qjs_character_data.h"
@@ -162,6 +163,7 @@ void InstallBindings(ExecutingContext* context) {
   QJSCanvasRenderingContext2D::Install(context);
   QJSCanvasPattern::Install(context);
   QJSCanvasGradient::Install(context);
+  QJSPath2D::Install(context);
   QJSDOMMatrixReadonly::Install(context);
   QJSDOMMatrix::Install(context);
   QJSCSSStyleDeclaration::Install(context);

bridge/bindings/qjs/wrapper_type_info.h

@@ -79,6 +79,7 @@ enum {
   JS_CLASS_CANVAS_RENDERING_CONTEXT_2_D,
   JS_CLASS_CANVAS_GRADIENT,
   JS_CLASS_CANVAS_PATTERN,
+  JS_CLASS_PATH_2_D,
   JS_CLASS_DOM_MATRIX,
   JS_CLASS_DOM_MATRIX_READONLY,
   JS_CLASS_HTML_TEMPLATE_ELEMENT,

bridge/core/binding_call_methods.json5

@@ -114,6 +114,7 @@
     "scale",
     "strokeText",
     "setTransform",
+    "addPath",
     "transform",
     "translate",
     "reset",

bridge/core/binding_object.h

@@ -70,7 +70,10 @@ enum BindingMethodCallOperations {
   kAsyncAnonymousFunction,
 };
 
-enum CreateBindingObjectType { kCreateDOMMatrix = 0 };
+enum CreateBindingObjectType { 
+  kCreateDOMMatrix = 0,
+  kCreatePath2D = 1,
+};
 
 struct BindingObjectPromiseContext : public DartReadable {
   ExecutingContext* context;

bridge/core/geometry/dom_matrix.cc

@@ -12,6 +12,13 @@ DOMMatrix* DOMMatrix::Create(ExecutingContext* context,
   return MakeGarbageCollected<DOMMatrix>(context, init, exception_state);
 }
 
+DOMMatrix* DOMMatrix::Create(webf::ExecutingContext* context, webf::ExceptionState& exception_state) {
+  return MakeGarbageCollected<DOMMatrix>(context, exception_state);
+}
+
+DOMMatrix::DOMMatrix(webf::ExecutingContext* context, webf::ExceptionState& exception_state):
+      DOMMatrixReadonly(context, exception_state) {}
+
 DOMMatrix::DOMMatrix(ExecutingContext* context,
                      const std::shared_ptr<QJSUnionDomStringSequenceDouble>& init,
                      ExceptionState& exception_state)

bridge/core/geometry/dom_matrix.d.ts

@@ -1,3 +1,3 @@
 interface DOMMatrix extends DOMMatrixReadonly {
-  new(init: string | double[]): DOMMatrix;
+  new(init?: string | double[]): DOMMatrix;
 }

bridge/core/geometry/dom_matrix.h

@@ -16,8 +16,12 @@ class DOMMatrix : public DOMMatrixReadonly {
   static DOMMatrix* Create(ExecutingContext* context,
                            const std::shared_ptr<QJSUnionDomStringSequenceDouble>& init,
                            ExceptionState& exception_state);
+  static DOMMatrix* Create(ExecutingContext* context,
+                           ExceptionState& exception_state);
 
   DOMMatrix() = delete;
+  explicit DOMMatrix(ExecutingContext* context,
+                     ExceptionState& exception_state);
   explicit DOMMatrix(ExecutingContext* context,
                      const std::shared_ptr<QJSUnionDomStringSequenceDouble>& init,
                      ExceptionState& exception_state);

bridge/core/geometry/dom_matrix_readonly.cc

@@ -28,6 +28,13 @@ DOMMatrixReadonly::DOMMatrixReadonly(ExecutingContext* context,
                                                               CreateBindingObjectType::kCreateDOMMatrix, arguments, 1);
 }
 
+DOMMatrixReadonly::DOMMatrixReadonly(webf::ExecutingContext* context, webf::ExceptionState& exception_state)
+    : BindingObject(context->ctx()) {
+  GetExecutingContext()->dartMethodPtr()->createBindingObject(GetExecutingContext()->isDedicated(),
+                                                              GetExecutingContext()->contextId(), bindingObject(),
+                                                              CreateBindingObjectType::kCreateDOMMatrix, nullptr, 0);
+}
+
 NativeValue DOMMatrixReadonly::HandleCallFromDartSide(const AtomicString& method,
                                                       int32_t argc,
                                                       const NativeValue* argv,

bridge/core/geometry/dom_matrix_readonly.h

@@ -24,6 +24,8 @@ class DOMMatrixReadonly : public BindingObject {
   explicit DOMMatrixReadonly(ExecutingContext* context,
                              const std::shared_ptr<QJSUnionDomStringSequenceDouble>& init,
                              ExceptionState& exception_state);
+  explicit DOMMatrixReadonly(ExecutingContext* context,
+                                 ExceptionState& exception_state);
 
   NativeValue HandleCallFromDartSide(const AtomicString& method,
                                      int32_t argc,

bridge/core/html/canvas/canvas_rendering_context_2d.cc

@@ -137,6 +137,37 @@ void CanvasRenderingContext2D::setStrokeStyle(const std::shared_ptr<QJSUnionDomS
   stroke_style_ = style;
 }
 
+void CanvasRenderingContext2D::fill(webf::ExceptionState& exception_state) {
+  InvokeBindingMethod(binding_call_methods::kfill, 0, nullptr, FlushUICommandReason::kDependentsOnElement,
+                      exception_state);
+}
+
+void CanvasRenderingContext2D::fill(std::shared_ptr<const QJSUnionPath2DDomString> pathOrPattern,
+                                    webf::ExceptionState& exception_state) {
+  if (pathOrPattern->IsDomString()) {
+    NativeValue arguments[] = {
+        NativeValueConverter<NativeTypeString>::ToNativeValue(ctx(), pathOrPattern->GetAsDomString())};
+    InvokeBindingMethod(binding_call_methods::kfill, sizeof(arguments) / sizeof(NativeValue), arguments,
+                        FlushUICommandReason::kDependentsOnElement, exception_state);
+  } else if (pathOrPattern->IsPath2D()) {
+    NativeValue arguments[] = {
+        NativeValueConverter<NativeTypePointer<Path2D>>::ToNativeValue(pathOrPattern->GetAsPath2D())};
+    InvokeBindingMethod(binding_call_methods::kfill, sizeof(arguments) / sizeof(NativeValue), arguments,
+                        FlushUICommandReason::kDependentsOnElement, exception_state);
+  }
+}
+
+void CanvasRenderingContext2D::fill(std::shared_ptr<const QJSUnionPath2DDomString> pathOrPattern,
+                                    const webf::AtomicString& fillRule,
+                                    webf::ExceptionState& exception_state) {
+  assert(pathOrPattern->IsPath2D());
+  NativeValue arguments[] = {
+      NativeValueConverter<NativeTypePointer<Path2D>>::ToNativeValue(pathOrPattern->GetAsPath2D()),
+      NativeValueConverter<NativeTypeString>::ToNativeValue(ctx(), fillRule)};
+  InvokeBindingMethod(binding_call_methods::kfill, sizeof(arguments) / sizeof(NativeValue), arguments,
+                      FlushUICommandReason::kDependentsOnElement, exception_state);
+}
+
 void CanvasRenderingContext2D::Trace(GCVisitor* visitor) const {
   if (fill_style_ != nullptr)
     fill_style_->Trace(visitor);

bridge/core/html/canvas/canvas_rendering_context_2d.d.ts

@@ -21,12 +21,12 @@ interface CanvasRenderingContext2D extends CanvasRenderingContext {
     bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): DartImpl<void>;
     clearRect(x: number, y: number, w: number, h: number): DartImpl<void>;
     closePath(): DartImpl<void>;
-    clip(path?: string): DartImpl<void>;
+    clip(path?: Path2D, fillRule?: string): DartImpl<void>;
     drawImage(image: HTMLImageElement, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): DartImpl<void>;
     drawImage(image: HTMLImageElement, dx: number, dy: number, dw: number, dh: number): DartImpl<void>;
     drawImage(image: HTMLImageElement, dx: number, dy: number): DartImpl<void>;
     ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise?: boolean): DartImpl<void>;
-    fill(path?: string): DartImpl<void>;
+    fill(path?: Path2D | string, fillRule?: string): void;
     fillRect(x: number, y: number, w: number, h: number): DartImpl<void>;
     fillText(text: string, x: number, y: number, maxWidth?: number): DartImpl<void>;
     lineTo(x: number, y: number): DartImpl<void>;
@@ -36,7 +36,7 @@ interface CanvasRenderingContext2D extends CanvasRenderingContext {
     resetTransform(): DartImpl<void>;
     rotate(angle: number): DartImpl<void>;
     quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): DartImpl<void>;
-    stroke(): DartImpl<void>;
+    stroke(path?: Path2D): DartImpl<void>;
     strokeRect(x: number, y: number, w: number, h: number): DartImpl<void>;
     save(): DartImpl<void>;
     scale(x: number, y: number): DartImpl<void>;

bridge/core/html/canvas/canvas_rendering_context_2d.h

@@ -7,9 +7,11 @@
 
 #include "canvas_gradient.h"
 #include "canvas_pattern.h"
+#include "path_2d.h"
 #include "canvas_rendering_context.h"
 #include "qjs_union_dom_stringcanvas_gradient.h"
 #include "qjs_unionhtml_image_elementhtml_canvas_element.h"
+#include "qjs_unionpath_2_d_dom_string.h"
 
 namespace webf {
 
@@ -44,6 +46,10 @@ class CanvasRenderingContext2D : public CanvasRenderingContext {
   void setFillStyle(const std::shared_ptr<QJSUnionDomStringCanvasGradient>& style, ExceptionState& exception_state);
   bool IsCanvas2d() const override;
 
+  void fill(ExceptionState& exception_state);
+  void fill(std::shared_ptr<const QJSUnionPath2DDomString> pathOrPattern, ExceptionState& exception_state);
+  void fill(std::shared_ptr<const QJSUnionPath2DDomString> pathOrPattern, const AtomicString& fillRule, ExceptionState& exception_state);
+
   std::shared_ptr<QJSUnionDomStringCanvasGradient> strokeStyle();
   void setStrokeStyle(const std::shared_ptr<QJSUnionDomStringCanvasGradient>& style, ExceptionState& exception_state);
 

bridge/core/html/canvas/path_2d.cc

@@ -0,0 +1,43 @@
+/*
+ * Copyright (C) 2022-present The WebF authors. All rights reserved.
+ */
+
+#include "path_2d.h"
+#include "binding_call_methods.h"
+#include "foundation/native_value_converter.h"
+
+namespace webf {
+
+Path2D* Path2D::Create(ExecutingContext* context, ExceptionState& exception_state) {
+  return MakeGarbageCollected<Path2D>(context, exception_state);
+}
+
+Path2D::Path2D(ExecutingContext* context, ExceptionState& exception_state)
+  : BindingObject(context->ctx()) {
+  NativeValue arguments[0];
+  GetExecutingContext()->dartMethodPtr()->createBindingObject(GetExecutingContext()->isDedicated(),
+                                                              GetExecutingContext()->contextId(), bindingObject(),
+                                                              CreateBindingObjectType::kCreatePath2D, arguments, 0);
+}
+
+void Path2D::addPath(Path2D* path, DOMMatrixReadonly* dom_matrix, ExceptionState& exception_state) {
+  NativeValue arguments[] = {NativeValueConverter<NativeTypePointer<Path2D>>::ToNativeValue(path),
+                            NativeValueConverter<NativeTypePointer<DOMMatrixReadonly>>::ToNativeValue(dom_matrix)};
+  InvokeBindingMethod(binding_call_methods::kaddPath, 2, arguments, FlushUICommandReason::kDependentsOnElement,
+                      exception_state);
+}
+
+void Path2D::addPath(webf::Path2D* path, webf::ExceptionState& exception_state) {
+  NativeValue arguments[] = {NativeValueConverter<NativeTypePointer<Path2D>>::ToNativeValue(path)};
+  InvokeBindingMethod(binding_call_methods::kaddPath, 1, arguments, FlushUICommandReason::kDependentsOnElement,
+                      exception_state);
+}
+
+NativeValue Path2D::HandleCallFromDartSide(const AtomicString& method,
+                                          int32_t argc,
+                                          const NativeValue* argv,
+                                          Dart_Handle dart_object) {
+  return Native_NewNull();
+}
+
+}  // namespace webf

bridge/core/html/canvas/path_2d.d.ts

@@ -0,0 +1,13 @@
+interface Path2D {
+  closePath(): DartImpl<void>;
+  moveTo(x: number, y: number): DartImpl<void>;
+  lineTo(x: number, y: number): DartImpl<void>;
+  bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): DartImpl<void>;
+  quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): DartImpl<void>;
+  arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean): DartImpl<void>;
+  arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): DartImpl<void>;
+  ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise?: boolean): DartImpl<void>;
+  rect(x: number, y: number, w: number, h: number): DartImpl<void>;
+  addPath(path: Path2D, matrix?: DOMMatrix): void;
+  new(): Path2D;
+}

bridge/core/html/canvas/path_2d.h

@@ -0,0 +1,37 @@
+/*
+ * Copyright (C) 2022-present The WebF authors. All rights reserved.
+ */
+
+#ifndef WEBF_CORE_HTML_CANVAS_CANVAS_PATH_2D_H_
+#define WEBF_CORE_HTML_CANVAS_CANVAS_PATH_2D_H_
+
+#include "bindings/qjs/script_wrappable.h"
+#include "core/binding_object.h"
+#include "core/geometry/dom_matrix.h"
+
+namespace webf {
+
+class Path2D : public BindingObject {
+  DEFINE_WRAPPERTYPEINFO();
+
+ public:
+  using ImplType = Path2D*;
+  static Path2D* Create(ExecutingContext* context, ExceptionState& exception_state);
+  Path2D() = delete;
+
+  explicit Path2D(ExecutingContext* context, ExceptionState& exception_state);
+
+  void addPath(Path2D* path, DOMMatrixReadonly* dom_matrix, ExceptionState& exception_state);
+  void addPath(Path2D* path, ExceptionState& exception_state);
+
+  NativeValue HandleCallFromDartSide(const AtomicString& method,
+                                    int32_t argc,
+                                    const NativeValue* argv,
+                                    Dart_Handle dart_object) override;
+
+  private:
+};  // namespace webf
+
+}
+
+#endif  // WEBF_CORE_HTML_CANVAS_CANVAS_PATH_2D_H_a

bridge/scripts/code_generator/src/idl/generateSource.ts

@@ -312,7 +312,7 @@ function generateNativeValueTypeConverter(type: ParameterType): string {
 function generateRequiredInitBody(argument: FunctionArguments, argsIndex: number) {
   let type = generateIDLTypeConverter(argument.type, !argument.required);
 
-  let hasArgumentCheck = type.indexOf('Element') >= 0 || type.indexOf('Node') >= 0 || type === 'EventTarget' || type.indexOf('DOMMatrix') >= 0;
+  let hasArgumentCheck = type.indexOf('Element') >= 0 || type.indexOf('Node') >= 0 || type === 'EventTarget' || type.indexOf('DOMMatrix') >= 0 || type.indexOf('Path2D') >= 0;
 
   let body = '';
   if (argument.isDotDotDot) {

bridge/scripts/code_generator/templates/idl_templates/union.cc.tpl

@@ -10,6 +10,7 @@
 #include "bindings/qjs/converter_impl.h"
 #include "core/html/html_image_element.h"
 #include "core/html/canvas/html_canvas_element.h"
+#include "core/html/canvas/path_2d.h"
 
 namespace webf {
 

webf/lib/src/bridge/binding.dart

@@ -14,6 +14,7 @@ import 'package:webf/dom.dart';
 import 'package:webf/geometry.dart';
 import 'package:webf/foundation.dart';
 import 'package:webf/launcher.dart';
+import 'package:webf/src/html/canvas/canvas_path_2d.dart';
 
 // We have some integrated built-in behavior starting with string prefix reuse the callNativeMethod implements.
 enum BindingMethodCallOperations {
@@ -157,7 +158,8 @@ Future<void> _dispatchEventToNative(Event event, bool isCapture) async {
 }
 
 enum CreateBindingObjectType {
-  createDOMMatrix
+  createDOMMatrix,
+  createPath2D,
 }
 
 abstract class BindingBridge {
@@ -178,6 +180,11 @@ abstract class BindingBridge {
         controller.view.setBindingObject(pointer, domMatrix);
         return;
       }
+      case CreateBindingObjectType.createPath2D: {
+        Path2D path2D = Path2D(context: BindingContext(controller.view, contextId, pointer), path2DInit: arguments);
+        controller.view.setBindingObject(pointer, path2D);
+        return;
+      }
     }
   }