[WIP] feat: Support Text Selection

integration_tests/specs/dom/elements/img.ts

@@ -524,4 +524,24 @@ describe('Tags img', () => {
     done();
   });
 
+  it('works with width/height attribute', async (done) => {
+    let image;
+    image = createElement(
+      'img',
+      {
+        src: 'assets/100x100-green.png'
+      },
+    );
+    image.setAttribute(
+      'width',
+      '100px'
+    );
+    image.setAttribute(
+      'height',
+      '100px'
+    );
+    BODY.appendChild(image);
+    await snapshot(0.1);
+    done();
+  });
 });

webf/lib/src/dom/text_node.dart

@@ -15,7 +15,8 @@ const String TAB_CHAR = '\t';
 class TextNode extends CharacterData {
   static const String NORMAL_SPACE = '\u0020';
 
-  TextNode(this._data, [BindingContext? context]) : super(NodeType.TEXT_NODE, context);
+  TextNode(this._data, [BindingContext? context])
+      : super(NodeType.TEXT_NODE, context);
 
   // Must be existed after text node is attached, and all text update will after text attached.
   RenderTextBox? _renderTextBox;
@@ -58,12 +59,16 @@ class TextNode extends CharacterData {
       _renderTextBox!.renderStyle = _parentElement.renderStyle;
       _renderTextBox!.data = data;
 
-      WebFRenderParagraph renderParagraph = _renderTextBox!.child as WebFRenderParagraph;
+      WebFRenderParagraph renderParagraph =
+          _renderTextBox!.child as WebFRenderParagraph;
       renderParagraph.markNeedsLayout();
 
-      RenderLayoutBox parentRenderLayoutBox = _parentElement.renderBoxModel as RenderLayoutBox;
-      parentRenderLayoutBox = parentRenderLayoutBox.renderScrollingContent ?? parentRenderLayoutBox;
-      _setTextSizeType(parentRenderLayoutBox.widthSizeType, parentRenderLayoutBox.heightSizeType);
+      RenderLayoutBox parentRenderLayoutBox =
+          _parentElement.renderBoxModel as RenderLayoutBox;
+      parentRenderLayoutBox =
+          parentRenderLayoutBox.renderScrollingContent ?? parentRenderLayoutBox;
+      _setTextSizeType(parentRenderLayoutBox.widthSizeType,
+          parentRenderLayoutBox.heightSizeType);
     }
   }
 
@@ -84,8 +89,10 @@ class TextNode extends CharacterData {
     // If element attach WidgetElement, render object should be attach to render tree when mount.
     if (parent.renderObjectManagerType == RenderObjectManagerType.WEBF_NODE &&
         parent.renderBoxModel is RenderLayoutBox) {
-      RenderLayoutBox parentRenderLayoutBox = parent.renderBoxModel as RenderLayoutBox;
-      parentRenderLayoutBox = parentRenderLayoutBox.renderScrollingContent ?? parentRenderLayoutBox;
+      RenderLayoutBox parentRenderLayoutBox =
+          parent.renderBoxModel as RenderLayoutBox;
+      parentRenderLayoutBox =
+          parentRenderLayoutBox.renderScrollingContent ?? parentRenderLayoutBox;
       parentRenderLayoutBox.insert(_renderTextBox!, after: after);
     }
 
@@ -96,7 +103,8 @@ class TextNode extends CharacterData {
   void _detachRenderTextBox() {
     if (isRendererAttached) {
       RenderTextBox renderTextBox = _renderTextBox!;
-      ContainerRenderObjectMixin parent = renderTextBox.parent as ContainerRenderObjectMixin;
+      ContainerRenderObjectMixin parent =
+          renderTextBox.parent as ContainerRenderObjectMixin;
       parent.remove(renderTextBox);
     }
   }
@@ -115,7 +123,10 @@ class TextNode extends CharacterData {
 
   @override
   RenderBox createRenderer() {
-    return _renderTextBox = RenderTextBox(data, renderStyle: parentElement!.renderStyle);
+    return _renderTextBox = RenderTextBox(data,
+        renderStyle: parentElement!.renderStyle,
+        registrar: ownerDocument.controller.registrar,
+        selectionColor: ownerDocument.controller.selectionColor);
   }
 
   @override

webf/lib/src/gesture/scroll_position.dart

@@ -487,7 +487,7 @@ abstract class ScrollPosition extends ViewportOffset with ScrollMetrics {
     ScrollPositionAlignmentPolicy alignmentPolicy = ScrollPositionAlignmentPolicy.explicit,
   }) {
     assert(object.attached);
-    final RenderAbstractViewport viewport = RenderAbstractViewport.of(object)!;
+    final RenderAbstractViewport viewport = RenderAbstractViewport.of(object);
 
     double? target;
     switch (alignmentPolicy) {

webf/lib/src/html/img.dart

@@ -103,9 +103,9 @@ class ImageElement extends Element {
     properties['src'] = BindingObjectProperty(getter: () => src, setter: (value) => src = castToType<String>(value));
     properties['loading'] =
         BindingObjectProperty(getter: () => loading, setter: (value) => loading = castToType<String>(value));
-    properties['width'] = BindingObjectProperty(getter: () => width, setter: (value) => width = castToType<int>(value));
+    properties['width'] = BindingObjectProperty(getter: () => width, setter: (value) => widthValue = castToType<String>(value));
     properties['height'] =
-        BindingObjectProperty(getter: () => height, setter: (value) => height = castToType<int>(value));
+        BindingObjectProperty(getter: () => height, setter: (value) => heightValue = castToType<String>(value));
     properties['scaling'] =
         BindingObjectProperty(getter: () => scaling, setter: (value) => scaling = castToType<String>(value));
     properties['naturalWidth'] = BindingObjectProperty(getter: () => naturalWidth);
@@ -119,8 +119,8 @@ class ImageElement extends Element {
 
     attributes['src'] = ElementAttributeProperty(setter: (value) => src = attributeToProperty<String>(value));
     attributes['loading'] = ElementAttributeProperty(setter: (value) => loading = attributeToProperty<String>(value));
-    attributes['width'] = ElementAttributeProperty(setter: (value) => width = attributeToProperty<int>(value));
-    attributes['height'] = ElementAttributeProperty(setter: (value) => height = attributeToProperty<int>(value));
+    attributes['width'] = ElementAttributeProperty(setter: (value) => widthValue = attributeToProperty<String>(value));
+    attributes['height'] = ElementAttributeProperty(setter: (value) => heightValue = attributeToProperty<String>(value));
     attributes['scaling'] = ElementAttributeProperty(setter: (value) => scaling = attributeToProperty<String>(value));
   }
 
@@ -224,14 +224,20 @@ class ImageElement extends Element {
   // Width and height set through attributes.
   double? get _attrWidth {
     if (hasAttribute(WIDTH)) {
-      return CSSLength.toDouble(getAttribute(WIDTH));
+      final width = getAttribute(WIDTH);
+      if (width != null) {
+        return CSSLength.parseLength(width, renderStyle, WIDTH).computedValue;
+      }
     }
     return null;
   }
 
   double? get _attrHeight {
     if (hasAttribute(HEIGHT)) {
-      return CSSLength.toDouble(getAttribute(HEIGHT));
+      final height = getAttribute(HEIGHT);
+      if (height != null) {
+        return CSSLength.parseLength(height, renderStyle, HEIGHT).computedValue;
+      }
     }
     return null;
   }
@@ -529,19 +535,17 @@ class ImageElement extends Element {
     }
   }
 
-  set width(int value) {
-    if (value.isNegative) value = 0;
-    internalSetAttribute(WIDTH, value.toString());
+  set widthValue(String value) {
+    internalSetAttribute(WIDTH, width);
     if (_shouldScaling) {
       _decode(updateImageProvider: true);
     } else {
       _resizeImage();
     }
   }
 
-  set height(int value) {
-    if (value.isNegative) value = 0;
-    internalSetAttribute(HEIGHT, value.toString());
+  set heightValue(String value) {
+    internalSetAttribute(HEIGHT, height);
     if (_shouldScaling) {
       _decode(updateImageProvider: true);
     } else {

webf/lib/src/launcher/controller.dart

@@ -767,6 +767,10 @@ class WebFController {
     _name = value;
   }
 
+  final SelectionRegistrar? registrar;
+
+  late Color? selectionColor;
+
   final GestureListener? _gestureListener;
 
   // The kraken view entrypoint bundle.
@@ -793,6 +797,8 @@ class WebFController {
     this.devToolsService,
     this.uriParser,
     this.initialCookies,
+    this.registrar,
+    this.selectionColor
   })  : _name = name,
         _entrypoint = entrypoint,
         _gestureListener = gestureListener {