Fix: Move href, src, and formaction from reflected attributes to regular attributes

The mapping between props and attributes for those keys is not exactly an identity, e.g. if the provided URL is a relative one like , reading the attribute's value will return the same relative URL, but reading the prop will return a computed absolute URL that includes the domain name.

Author: raquo

js/src/test/scala/com/thirdparty/defs/attrs/HtmlAttrs.scala

@@ -58,6 +58,17 @@ trait HtmlAttrs {
   lazy val dropZone: HtmlAttr[String] = stringHtmlAttr("dropzone")
 
 
+  /**
+    * The `formaction` attribute provides the URL that will process the input control 
+    * when the form is submitted and overrides the default `action` attribute of the 
+    * `form` element. This should be used only with `input` elements of `type` 
+    * submit or image.
+    * 
+    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#formaction
+    */
+  lazy val formAction: HtmlAttr[String] = stringHtmlAttr("formaction")
+
+
   /** The form attribute specifies an ID of the form an `<input>` element belongs to. */
   lazy val formId: HtmlAttr[String] = stringHtmlAttr("form")
 
@@ -71,6 +82,20 @@ trait HtmlAttrs {
   lazy val heightAttr: HtmlAttr[Int] = intHtmlAttr("height")
 
 
+  /**
+    * This is the single required attribute for anchors defining a hypertext
+    * source link. It indicates the link target, either a URL or a URL fragment.
+    * A URL fragment is a name preceded by a hash mark (#), which specifies an
+    * internal target location (an ID) within the current document. URLs are not
+    * restricted to Web (HTTP)-based documents. URLs might use any protocol
+    * supported by the browser. For example, file, ftp, and mailto work in most
+    * user agents.
+    * 
+    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href
+    */
+  lazy val href: HtmlAttr[String] = stringHtmlAttr("href")
+
+
   /**
     * Identifies a list of pre-defined options to suggest to the user. The value must be
     * the id of a [[FormTags.dataList]] element in
@@ -99,6 +124,17 @@ trait HtmlAttrs {
   lazy val minAttr: HtmlAttr[String] = stringHtmlAttr("min")
 
 
+  /**
+    * Specifies the URL of an image for `<img>` tag, for `type="image"` input buttons, 
+    * or the URL of some other network resources like `<iframe>`.
+    * 
+    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-src
+    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#src
+    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-src
+    */
+  lazy val src: HtmlAttr[String] = stringHtmlAttr("src")
+
+
   /**
     * The step attribute specifies the numeric intervals for an `<input>` element
     * that should be considered legal for the input. For example, if step is 2

js/src/test/scala/com/thirdparty/defs/props/Props.scala

@@ -283,17 +283,6 @@ trait Props {
   lazy val forId: Prop[String, String] = stringProp("htmlFor")
 
 
-  /**
-    * The `formaction` attribute provides the URL that will process the input control
-    * when the form is submitted and overrides the default `action` attribute of the
-    * `form` element. This should be used only with `input` elements of `type`
-    * submit or image.
-    * 
-    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#formaction
-    */
-  lazy val formAction: Prop[String, String] = stringProp("formAction")
-
-
   /**
     * The `formenctype` attribute provides the encoding type of the form when it is
     * submitted (for forms with a method of "POST") and overrides the default
@@ -363,20 +352,6 @@ trait Props {
   lazy val high: Prop[Double, Double] = doubleProp("high")
 
 
-  /**
-    * This is the single required attribute for anchors defining a hypertext
-    * source link. It indicates the link target, either a URL or a URL fragment.
-    * A URL fragment is a name preceded by a hash mark (#), which specifies an
-    * internal target location (an ID) within the current document. URLs are not
-    * restricted to Web (HTTP)-based documents. URLs might use any protocol
-    * supported by the browser. For example, file, ftp, and mailto work in most
-    * user agents.
-    * 
-    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href
-    */
-  lazy val href: Prop[String, String] = stringProp("href")
-
-
   /**
     * This enumerated attribute defines the pragma that can alter servers and
     * user-agents behavior. The value of the pragma is defined using the content
@@ -666,18 +641,6 @@ trait Props {
   lazy val spellCheck: Prop[Boolean, Boolean] = boolProp("spellcheck")
 
 
-  /**
-    * If the value of the type attribute is image, this attribute specifies a URI
-    * for the location of an image to display on the graphical submit button;
-    * otherwise it is ignored.
-    * 
-    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-src
-    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#src
-    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-src
-    */
-  lazy val src: Prop[String, String] = stringProp("src")
-
-
   /**
     * This integer attribute indicates if the element can take input focus (is
     * focusable), if it should participate to sequential keyboard navigation, and

shared/src/main/scala/com/raquo/domtypes/defs/attrs/HtmlAttrDefs.scala

@@ -69,6 +69,29 @@ object HtmlAttrDefs {
       docUrls = Nil,
     ),
 
+    // This is NOT a true reflected attribute – the `formAction` prop value does not match the
+    // `formAction` attribute value when reading: the prop contains the full absolute URL,
+    // whereas the attr can have a relative URL if that's what you provide as its value.
+    // Also, if formAction is not set for this input element, the attr value is an empty string,
+    // whereas the prop value contains the value of the form's action property.
+    AttrDef(
+      tagType = HtmlTagType,
+      scalaName = "formAction",
+      domName = "formaction",
+      namespace = None,
+      scalaValueType = "String",
+      codec = "StringAsIs",
+      commentLines = List(
+        "The `formaction` attribute provides the URL that will process the input control ",
+        "when the form is submitted and overrides the default `action` attribute of the ",
+        "`form` element. This should be used only with `input` elements of `type` ",
+        "submit or image.",
+      ),
+      docUrls = List(
+        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#formaction",
+      ),
+    ),
+
     AttrDef(
       tagType = HtmlTagType,
       scalaName = "formId",
@@ -98,6 +121,30 @@ object HtmlAttrDefs {
       ),
     ),
 
+    // This is NOT a true reflected attribute – the `href` prop value does not match the
+    // `href` attribute value when reading: the prop contains the full absolute URL,
+    // whereas the attr can have a relative URL if that's what you provide as its value.
+    AttrDef(
+      tagType = HtmlTagType,
+      scalaName = "href",
+      domName = "href",
+      namespace = None,
+      scalaValueType = "String",
+      codec = "StringAsIs",
+      commentLines = List(
+        "This is the single required attribute for anchors defining a hypertext",
+        "source link. It indicates the link target, either a URL or a URL fragment.",
+        "A URL fragment is a name preceded by a hash mark (#), which specifies an",
+        "internal target location (an ID) within the current document. URLs are not",
+        "restricted to Web (HTTP)-based documents. URLs might use any protocol",
+        "supported by the browser. For example, file, ftp, and mailto work in most",
+        "user agents.",
+      ),
+      docUrls = List(
+        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href",
+      ),
+    ),
+
     AttrDef(
       tagType = HtmlTagType,
       scalaName = "listId",
@@ -147,6 +194,27 @@ object HtmlAttrDefs {
       ),
     ),
 
+    // This is NOT a true reflected attribute – the `src` prop value does not match the
+    // `src` attribute value when reading: the prop contains the full absolute URL,
+    // whereas the attr can have a relative URL if that's what you provide as its value.
+    AttrDef(
+      tagType = HtmlTagType,
+      scalaName = "src",
+      domName = "src",
+      namespace = None,
+      scalaValueType = "String",
+      codec = "StringAsIs",
+      commentLines = List(
+        "Specifies the URL of an image for `<img>` tag, for `type=\"image\"` input buttons, ",
+        "or the URL of some other network resources like `<iframe>`.",
+      ),
+      docUrls = List(
+        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-src",
+        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#src",
+        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-src",
+      ),
+    ),
+
     AttrDef(
       tagType = HtmlTagType,
       scalaName = "stepAttr",

shared/src/main/scala/com/raquo/domtypes/defs/reflectedAttrs/ReflectedHtmlAttrDefs.scala

@@ -385,25 +385,6 @@ object ReflectedHtmlAttrDefs {
       ),
     ),
 
-    ReflectedHtmlAttrDef(
-      scalaName = "formAction",
-      domAttrName = "formaction",
-      domPropName = "formAction",
-      scalaValueType = "String",
-      domPropValueType = "String",
-      attrCodec = "StringAsIs",
-      propCodec = "StringAsIs",
-      commentLines = List(
-        "The `formaction` attribute provides the URL that will process the input control",
-        "when the form is submitted and overrides the default `action` attribute of the",
-        "`form` element. This should be used only with `input` elements of `type`",
-        "submit or image.",
-      ),
-      docUrls = List(
-        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#formaction",
-      ),
-    ),
-
     ReflectedHtmlAttrDef(
       scalaName = "formEncType",
       domAttrName = "formenctype",
@@ -521,28 +502,6 @@ object ReflectedHtmlAttrDefs {
       ),
     ),
 
-    ReflectedHtmlAttrDef(
-      scalaName = "href",
-      domAttrName = "href",
-      domPropName = "href",
-      scalaValueType = "String",
-      domPropValueType = "String",
-      attrCodec = "StringAsIs",
-      propCodec = "StringAsIs",
-      commentLines = List(
-        "This is the single required attribute for anchors defining a hypertext",
-        "source link. It indicates the link target, either a URL or a URL fragment.",
-        "A URL fragment is a name preceded by a hash mark (#), which specifies an",
-        "internal target location (an ID) within the current document. URLs are not",
-        "restricted to Web (HTTP)-based documents. URLs might use any protocol",
-        "supported by the browser. For example, file, ftp, and mailto work in most",
-        "user agents.",
-      ),
-      docUrls = List(
-        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href",
-      ),
-    ),
-
     ReflectedHtmlAttrDef(
       scalaName = "httpEquiv",
       domAttrName = "http-equiv",
@@ -1032,26 +991,6 @@ object ReflectedHtmlAttrDefs {
       ),
     ),
 
-    ReflectedHtmlAttrDef(
-      scalaName = "src",
-      domAttrName = "src",
-      domPropName = "src",
-      scalaValueType = "String",
-      domPropValueType = "String",
-      attrCodec = "StringAsIs",
-      propCodec = "StringAsIs",
-      commentLines = List(
-        "If the value of the type attribute is image, this attribute specifies a URI",
-        "for the location of an image to display on the graphical submit button;",
-        "otherwise it is ignored.",
-      ),
-      docUrls = List(
-        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-src",
-        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#src",
-        "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-src",
-      ),
-    ),
-
     ReflectedHtmlAttrDef(
       scalaName = "tabIndex",
       domAttrName = "tabindex",