Add TextView.set/getText

Author: zcbenz

patches/yoga/build.patch

@@ -7,7 +7,7 @@ Add GN build files for Yoga.
 
 diff --git a/BUILD.gn b/BUILD.gn
 new file mode 100644
-index 0000000000000000000000000000000000000000..3d322b2de0717cef005493c79144b751c79d81f6
+index 00000000..3d322b2d
 --- /dev/null
 +++ b/BUILD.gn
 @@ -0,0 +1,48 @@
@@ -60,7 +60,7 @@ index 0000000000000000000000000000000000000000..3d322b2de0717cef005493c79144b751
 +  public_configs = [ ":yoga_config" ]
 +}
 diff --git a/yoga/Utils.cpp b/yoga/Utils.cpp
-index c4281b60fc6e164b219d85296e1eb60e3ef1e0e4..4ec7c0c085a6d31b8b2ea5879305ed19aeb04337 100644
+index c4281b60..4ec7c0c0 100644
 --- a/yoga/Utils.cpp
 +++ b/yoga/Utils.cpp
 @@ -74,5 +74,5 @@ YGFloatOptional YGFloatOptionalMax(YGFloatOptional op1, YGFloatOptional op2) {
@@ -70,3 +70,37 @@ index c4281b60fc6e164b219d85296e1eb60e3ef1e0e4..4ec7c0c085a6d31b8b2ea5879305ed19
 -  throw std::logic_error(message);
 +  assert(message);
  }
+diff --git a/yoga/YGNodePrint.cpp b/yoga/YGNodePrint.cpp
+index 26efa485..9126de65 100644
+--- a/yoga/YGNodePrint.cpp
++++ b/yoga/YGNodePrint.cpp
+@@ -5,7 +5,6 @@
+  * LICENSE file in the root directory of this source tree.
+  */
+ 
+-#ifdef DEBUG
+ #include "YGNodePrint.h"
+ #include <stdarg.h>
+ #include "YGEnums.h"
+@@ -222,4 +221,3 @@ void YGNodeToString(
+ }
+ } // namespace yoga
+ } // namespace facebook
+-#endif
+diff --git a/yoga/YGNodePrint.h b/yoga/YGNodePrint.h
+index 3db504b4..f1b8659d 100644
+--- a/yoga/YGNodePrint.h
++++ b/yoga/YGNodePrint.h
+@@ -5,7 +5,6 @@
+  * LICENSE file in the root directory of this source tree.
+  */
+ 
+-#ifdef DEBUG
+ #pragma once
+ #include <string>
+ 
+@@ -22,4 +21,3 @@ void YGNodeToString(
+ 
+ } // namespace yoga
+ } // namespace facebook
+-#endif

shell/browser/api/electron_api_view.cc

@@ -11,9 +11,12 @@
 #if BUILDFLAG(ENABLE_VIEWS_API)
 #include "shell/browser/api/views/yoga_layout_manager.h"
 #include "shell/browser/api/views/yoga_util.h"
+#include "shell/common/color_util.h"
 #include "shell/common/gin_converters/value_converter.h"
+#include "third_party/yoga/yoga/YGNodePrint.h"
 #include "third_party/yoga/yoga/Yoga.h"
 #include "ui/base/layout.h"
+#include "ui/views/background.h"
 #include "ui/views/widget/widget.h"
 #endif
 
@@ -43,6 +46,7 @@ View::View(views::View* view) : view_(view) {
 #if BUILDFLAG(ENABLE_VIEWS_API)
   yoga_config_ = YGConfigNew();
   yoga_node_ = YGNodeNewWithConfig(yoga_config_);
+  YGNodeSetContext(yoga_node_, this);
   AttachYogaNode(view, yoga_node_);
 
   view_->SetLayoutManager(std::make_unique<YogaLayoutManager>());
@@ -81,17 +85,34 @@ void View::AddChildViewAt(gin::Handle<View> child, size_t index) {
   view()->Layout();
 }
 
+void View::SetBackgroundColor(const std::string& color_name) {
+  SkColor color = ParseHexColor(color_name);
+  view()->SetBackground(views::CreateSolidBackground(color));
+}
+
 void View::SetStyle(std::map<std::string, base::Value> dict) {
   for (const auto& it : dict) {
-    if (it.second.is_double())
+    if (it.first == "backgroundColor") {
+      if (it.second.is_string())
+        SetBackgroundColor(it.second.GetString());
+    } else if (it.second.is_double()) {
       SetYogaProperty(yoga_node_, it.first, it.second.GetDouble());
-    else if (it.second.is_int())
+    } else if (it.second.is_int()) {
       SetYogaProperty(yoga_node_, it.first, it.second.GetInt());
-    else if (it.second.is_string())
+    } else if (it.second.is_string()) {
       SetYogaProperty(yoga_node_, it.first, it.second.GetString());
+    }
   }
 }
 
+std::string View::GetComputedLayout() const {
+  std::string result;
+  auto options = static_cast<YGPrintOptions>(
+      YGPrintOptionsLayout | YGPrintOptionsStyle | YGPrintOptionsChildren);
+  facebook::yoga::YGNodeToString(result, yoga_node_, options, 0);
+  return result;
+}
+
 void View::OnViewVisibilityChanged(views::View* observed_view,
                                    views::View* starting_view) {
   YGNodeStyleSetDisplay(yoga_node_,
@@ -118,7 +139,9 @@ void View::BuildPrototype(v8::Isolate* isolate,
   gin_helper::ObjectTemplateBuilder(isolate, prototype->PrototypeTemplate())
       .SetMethod("addChildView", &View::AddChildView)
       .SetMethod("addChildViewAt", &View::AddChildViewAt)
-      .SetMethod("setStyle", &View::SetStyle);
+      .SetMethod("setBackgroundColor", &View::SetBackgroundColor)
+      .SetMethod("setStyle", &View::SetStyle)
+      .SetMethod("getComputedLayout", &View::GetComputedLayout);
 #endif
 }
 

shell/browser/api/electron_api_view.h

@@ -35,9 +35,14 @@ class View : public gin_helper::Wrappable<View>, public views::ViewObserver {
   void AddChildView(gin::Handle<View> view);
   void AddChildViewAt(gin::Handle<View> view, size_t index);
 
+  void SetBackgroundColor(const std::string& color_name);
   void SetStyle(std::map<std::string, base::Value> dict);
+  std::string GetComputedLayout() const;
 #endif
 
+#if BUILDFLAG(ENABLE_VIEWS_API)
+  YGNodeRef yoga_node() const { return yoga_node_; }
+#endif
   views::View* view() const { return view_; }
 
  protected:

shell/browser/api/views/electron_api_text_view.cc

@@ -8,16 +8,43 @@
 #include "shell/common/gin_helper/dictionary.h"
 #include "shell/common/gin_helper/object_template_builder.h"
 #include "shell/common/node_includes.h"
+#include "third_party/yoga/yoga/Yoga.h"
 
 namespace electron {
 
 namespace api {
 
+namespace {
+
+YGSize MeasureText(YGNodeRef node,
+                   float width,
+                   YGMeasureMode mode,
+                   float height,
+                   YGMeasureMode height_mode) {
+  auto* text_view = static_cast<TextView*>(YGNodeGetContext(node));
+  gfx::Size size = text_view->view()->GetPreferredSize();
+  return {size.width(), size.height()};
+}
+
+}  // namespace
+
 TextView::TextView(const base::string16& text)
-    : View(new views::StyledLabel(text, this)) {}
+    : View(new views::StyledLabel(text, this)) {
+  YGNodeSetMeasureFunc(yoga_node(), MeasureText);
+  YGNodeMarkDirty(yoga_node());
+}
 
 TextView::~TextView() {}
 
+void TextView::SetText(const base::string16& text) {
+  label()->SetText(text);
+  YGNodeMarkDirty(yoga_node());
+}
+
+const base::string16& TextView::GetText() const {
+  return label()->GetText();
+}
+
 // static
 gin_helper::WrappableBase* TextView::New(const base::string16& text,
                                          gin_helper::Arguments* args) {
@@ -31,7 +58,9 @@ gin_helper::WrappableBase* TextView::New(const base::string16& text,
 void TextView::BuildPrototype(v8::Isolate* isolate,
                               v8::Local<v8::FunctionTemplate> prototype) {
   prototype->SetClassName(gin::StringToV8(isolate, "TextView"));
-  gin_helper::ObjectTemplateBuilder(isolate, prototype->PrototypeTemplate());
+  gin_helper::ObjectTemplateBuilder(isolate, prototype->PrototypeTemplate())
+      .SetMethod("setText", &TextView::SetText)
+      .SetMethod("getText", &TextView::GetText);
 }
 
 }  // namespace api

shell/browser/api/views/electron_api_text_view.h

@@ -21,6 +21,9 @@ class TextView : public View, public views::StyledLabelListener {
   static void BuildPrototype(v8::Isolate* isolate,
                              v8::Local<v8::FunctionTemplate> prototype);
 
+  void SetText(const base::string16& text);
+  const base::string16& GetText() const;
+
  protected:
   explicit TextView(const base::string16& text);
   ~TextView() override;

shell/browser/api/views/yoga_util.cc

@@ -158,88 +158,88 @@ using EdgeSetter = void (*)(const YGNodeRef, const YGEdge, float);
 
 // Sorted list of CSS node properties.
 const std::tuple<const char*, IntConverter, IntSetter> int_setters[] = {
-    {"aligncontent", AlignValue,
+    {"alignContent", AlignValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetAlignContent)},
-    {"alignitems", AlignValue,
+    {"alignItems", AlignValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetAlignItems)},
-    {"alignself", AlignValue,
+    {"alignSelf", AlignValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetAlignSelf)},
     {"direction", DirectionValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetDirection)},
     {"display", DisplayValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetDisplay)},
-    {"flexdirection", FlexDirectionValue,
+    {"flexDirection", FlexDirectionValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetFlexDirection)},
-    {"flexwrap", WrapValue,
+    {"flexWrap", WrapValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetFlexWrap)},
-    {"justifycontent", JustifyValue,
+    {"justifyContent", JustifyValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetJustifyContent)},
     {"overflow", OverflowValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetOverflow)},
     {"position", PositionValue,
      reinterpret_cast<IntSetter>(YGNodeStyleSetPositionType)},
 };
 const std::pair<const char*, FloatSetter> float_setters[] = {
-    {"aspectratio", YGNodeStyleSetAspectRatio},
+    {"aspectRatio", YGNodeStyleSetAspectRatio},
     {"flex", YGNodeStyleSetFlex},
-    {"flexbasis", YGNodeStyleSetFlexBasis},
-    {"flexgrow", YGNodeStyleSetFlexGrow},
-    {"flexshrink", YGNodeStyleSetFlexShrink},
+    {"flexBasis", YGNodeStyleSetFlexBasis},
+    {"flexGrow", YGNodeStyleSetFlexGrow},
+    {"flexShrink", YGNodeStyleSetFlexShrink},
     {"height", YGNodeStyleSetHeight},
-    {"maxheight", YGNodeStyleSetMaxHeight},
-    {"maxwidth", YGNodeStyleSetMaxWidth},
-    {"minheight", YGNodeStyleSetMinHeight},
-    {"minwidth", YGNodeStyleSetMinWidth},
+    {"maxHeight", YGNodeStyleSetMaxHeight},
+    {"maxWidth", YGNodeStyleSetMaxWidth},
+    {"minHeight", YGNodeStyleSetMinHeight},
+    {"minWidth", YGNodeStyleSetMinWidth},
     {"width", YGNodeStyleSetWidth},
 };
 const std::pair<const char*, AutoSetter> auto_setters[] = {
-    {"flexbasis", YGNodeStyleSetFlexBasisAuto},
+    {"flexBasis", YGNodeStyleSetFlexBasisAuto},
     {"height", YGNodeStyleSetHeightAuto},
     {"width", YGNodeStyleSetWidthAuto},
 };
 const std::pair<const char*, FloatSetter> percent_setters[] = {
-    {"flexbasis", YGNodeStyleSetFlexBasisPercent},
+    {"flexBasis", YGNodeStyleSetFlexBasisPercent},
     {"height", YGNodeStyleSetHeightPercent},
-    {"maxheight", YGNodeStyleSetMaxHeightPercent},
-    {"maxwidth", YGNodeStyleSetMaxWidthPercent},
-    {"minheight", YGNodeStyleSetMinHeightPercent},
-    {"minwidth", YGNodeStyleSetMinWidthPercent},
+    {"maxHeight", YGNodeStyleSetMaxHeightPercent},
+    {"maxWidth", YGNodeStyleSetMaxWidthPercent},
+    {"minHeight", YGNodeStyleSetMinHeightPercent},
+    {"minWidth", YGNodeStyleSetMinWidthPercent},
     {"width", YGNodeStyleSetWidthPercent},
 };
 const std::tuple<const char*, YGEdge, EdgeSetter> edge_setters[] = {
     {"border", YGEdgeAll, YGNodeStyleSetBorder},
-    {"borderbottom", YGEdgeBottom, YGNodeStyleSetBorder},
-    {"borderleft", YGEdgeLeft, YGNodeStyleSetBorder},
-    {"borderright", YGEdgeRight, YGNodeStyleSetBorder},
-    {"bordertop", YGEdgeTop, YGNodeStyleSetBorder},
+    {"borderBottom", YGEdgeBottom, YGNodeStyleSetBorder},
+    {"borderLeft", YGEdgeLeft, YGNodeStyleSetBorder},
+    {"borderRight", YGEdgeRight, YGNodeStyleSetBorder},
+    {"borderTop", YGEdgeTop, YGNodeStyleSetBorder},
     {"bottom", YGEdgeBottom, YGNodeStyleSetPosition},
     {"left", YGEdgeLeft, YGNodeStyleSetPosition},
     {"margin", YGEdgeAll, YGNodeStyleSetMargin},
-    {"marginbottom", YGEdgeBottom, YGNodeStyleSetMargin},
-    {"marginleft", YGEdgeLeft, YGNodeStyleSetMargin},
-    {"marginright", YGEdgeRight, YGNodeStyleSetMargin},
-    {"margintop", YGEdgeTop, YGNodeStyleSetMargin},
+    {"marginBottom", YGEdgeBottom, YGNodeStyleSetMargin},
+    {"marginLeft", YGEdgeLeft, YGNodeStyleSetMargin},
+    {"marginRight", YGEdgeRight, YGNodeStyleSetMargin},
+    {"marginTop", YGEdgeTop, YGNodeStyleSetMargin},
     {"padding", YGEdgeAll, YGNodeStyleSetPadding},
-    {"paddingbottom", YGEdgeBottom, YGNodeStyleSetPadding},
-    {"paddingleft", YGEdgeLeft, YGNodeStyleSetPadding},
-    {"paddingright", YGEdgeRight, YGNodeStyleSetPadding},
-    {"paddingtop", YGEdgeTop, YGNodeStyleSetPadding},
+    {"paddingBottom", YGEdgeBottom, YGNodeStyleSetPadding},
+    {"paddingLeft", YGEdgeLeft, YGNodeStyleSetPadding},
+    {"paddingRight", YGEdgeRight, YGNodeStyleSetPadding},
+    {"paddingTop", YGEdgeTop, YGNodeStyleSetPadding},
     {"right", YGEdgeRight, YGNodeStyleSetPosition},
     {"top", YGEdgeTop, YGNodeStyleSetPosition},
 };
 const std::tuple<const char*, YGEdge, EdgeSetter> edge_percent_setters[] = {
     {"bottom", YGEdgeBottom, YGNodeStyleSetPositionPercent},
     {"left", YGEdgeLeft, YGNodeStyleSetPositionPercent},
     {"margin", YGEdgeAll, YGNodeStyleSetMarginPercent},
-    {"marginbottom", YGEdgeBottom, YGNodeStyleSetMarginPercent},
-    {"marginleft", YGEdgeLeft, YGNodeStyleSetMarginPercent},
-    {"marginright", YGEdgeRight, YGNodeStyleSetMarginPercent},
-    {"margintop", YGEdgeTop, YGNodeStyleSetMarginPercent},
+    {"marginBottom", YGEdgeBottom, YGNodeStyleSetMarginPercent},
+    {"marginLeft", YGEdgeLeft, YGNodeStyleSetMarginPercent},
+    {"marginRight", YGEdgeRight, YGNodeStyleSetMarginPercent},
+    {"marginTop", YGEdgeTop, YGNodeStyleSetMarginPercent},
     {"padding", YGEdgeAll, YGNodeStyleSetPaddingPercent},
-    {"paddingbottom", YGEdgeBottom, YGNodeStyleSetPaddingPercent},
-    {"paddingleft", YGEdgeLeft, YGNodeStyleSetPaddingPercent},
-    {"paddingright", YGEdgeRight, YGNodeStyleSetPaddingPercent},
-    {"paddingtop", YGEdgeTop, YGNodeStyleSetPaddingPercent},
+    {"paddingBottom", YGEdgeBottom, YGNodeStyleSetPaddingPercent},
+    {"paddingLeft", YGEdgeLeft, YGNodeStyleSetPaddingPercent},
+    {"paddingRight", YGEdgeRight, YGNodeStyleSetPaddingPercent},
+    {"paddingTop", YGEdgeTop, YGNodeStyleSetPaddingPercent},
     {"right", YGEdgeRight, YGNodeStyleSetPositionPercent},
     {"top", YGEdgeTop, YGNodeStyleSetPositionPercent},
 };