Restore old behavior for empty href props on anchor tags (#28124)

Treat `<a href="" />` the same with and without `enableFilterEmptyStringAttributesDOM` in #18513 we started to warn and ignore for empty `href` and `src` props since it usually hinted at a mistake. However, for anchor tags there's a valid use case since `<a href=""></a>` will by spec render a link to the current page. It could be used to reload the page without having to rely on browser affordances. The implementation for Fizz is in the spirit of #21153. I gated the fork behind the flag so that the fork is DCE'd when the flag is off. DiffTrain build for [f3ce87a](f3ce87a)
facebook · Jan 30, 2024 · 5f66358 · 5f66358
1 parent 3cc608a
commit 5f66358
Show file tree

Hide file tree

Showing 21 changed files with 1,021 additions and 712 deletions.
diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-417188314dd1d6df54efc8cd6a0c5d4830615888
+f3ce87ab650f07774e1df9bc3f8033e023973d10
diff --git a/compiled/facebook-www/React-dev.classic.js b/compiled/facebook-www/React-dev.classic.js
@@ -24,7 +24,7 @@ if (__DEV__) {
     ) {
       __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
     }
-    var ReactVersion = "18.3.0-www-classic-5e99f036";
+    var ReactVersion = "18.3.0-www-classic-3dc9e724";
 
     // ATTENTION
     // When adding new symbols to this file,

diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js
@@ -24,7 +24,7 @@ if (__DEV__) {
     ) {
       __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
     }
-    var ReactVersion = "18.3.0-www-modern-d235b405";
+    var ReactVersion = "18.3.0-www-modern-4671cea1";
 
     // ATTENTION
     // When adding new symbols to this file,

diff --git a/compiled/facebook-www/ReactART-dev.modern.js b/compiled/facebook-www/ReactART-dev.modern.js
@@ -66,7 +66,7 @@ if (__DEV__) {
       return self;
     }
 
-    var ReactVersion = "18.3.0-www-modern-4fcabd82";
+    var ReactVersion = "18.3.0-www-modern-c768d9b6";
 
     var LegacyRoot = 0;
     var ConcurrentRoot = 1;

diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js
@@ -35754,7 +35754,7 @@ if (__DEV__) {
       return root;
     }
 
-    var ReactVersion = "18.3.0-www-classic-c52d28d4";
+    var ReactVersion = "18.3.0-www-classic-3799de5b";
 
     function createPortal$1(
       children,
@@ -40608,7 +40608,10 @@ if (__DEV__) {
         case "src":
         case "href": {
           {
-            if (value === "") {
+            if (
+              value === "" && // <a href=""> is fine for "reload" links.
+              !(tag === "a" && key === "href")
+            ) {
               {
                 if (key === "src") {
                   error(
@@ -42832,7 +42835,10 @@ if (__DEV__) {
           case "src":
           case "href":
             {
-              if (value === "") {
+              if (
+                value === "" && // <a href=""> is fine for "reload" links.
+                !(tag === "a" && propKey === "href")
+              ) {
                 {
                   if (propKey === "src") {
                     error(

diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js
@@ -35575,7 +35575,7 @@ if (__DEV__) {
       return root;
     }
 
-    var ReactVersion = "18.3.0-www-modern-8e7b2378";
+    var ReactVersion = "18.3.0-www-modern-41422569";
 
     function createPortal$1(
       children,
@@ -41237,7 +41237,10 @@ if (__DEV__) {
         case "src":
         case "href": {
           {
-            if (value === "") {
+            if (
+              value === "" && // <a href=""> is fine for "reload" links.
+              !(tag === "a" && key === "href")
+            ) {
               {
                 if (key === "src") {
                   error(
@@ -43458,7 +43461,10 @@ if (__DEV__) {
           case "src":
           case "href":
             {
-              if (value === "") {
+              if (
+                value === "" && // <a href=""> is fine for "reload" links.
+                !(tag === "a" && propKey === "href")
+              ) {
                 {
                   if (propKey === "src") {
                     error(

diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js
@@ -14331,7 +14331,7 @@ function setProp(domElement, tag, key, value, props, prevValue) {
       break;
     case "src":
     case "href":
-      if ("" === value) {
+      if ("" === value && ("a" !== tag || "href" !== key)) {
         domElement.removeAttribute(key);
         break;
       }
@@ -17154,7 +17154,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1823 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-3deaa9d4",
+  version: "18.3.0-www-classic-8280394c",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2185 = {
@@ -17184,7 +17184,7 @@ var internals$jscomp$inline_2185 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-3deaa9d4"
+  reconcilerVersion: "18.3.0-www-classic-8280394c"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2186 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -17534,4 +17534,4 @@ exports.useFormStatus = function () {
     return ReactCurrentDispatcher$2.current.useHostTransitionStatus();
   throw Error(formatProdErrorMessage(248));
 };
-exports.version = "18.3.0-www-classic-3deaa9d4";
+exports.version = "18.3.0-www-classic-8280394c";
diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js
@@ -14633,7 +14633,7 @@ function setProp(domElement, tag, key, value, props, prevValue) {
       break;
     case "src":
     case "href":
-      if ("" === value) {
+      if ("" === value && ("a" !== tag || "href" !== key)) {
         domElement.removeAttribute(key);
         break;
       }
@@ -16677,7 +16677,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1782 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-2bb5f73b",
+  version: "18.3.0-www-modern-3c4feb2e",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2149 = {
@@ -16708,7 +16708,7 @@ var internals$jscomp$inline_2149 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-2bb5f73b"
+  reconcilerVersion: "18.3.0-www-modern-3c4feb2e"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2150 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16986,4 +16986,4 @@ exports.useFormStatus = function () {
     return ReactCurrentDispatcher$2.current.useHostTransitionStatus();
   throw Error(formatProdErrorMessage(248));
 };
-exports.version = "18.3.0-www-modern-2bb5f73b";
+exports.version = "18.3.0-www-modern-3c4feb2e";
diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js
@@ -15100,7 +15100,7 @@ function setProp(domElement, tag, key, value, props, prevValue) {
       break;
     case "src":
     case "href":
-      if ("" === value) {
+      if ("" === value && ("a" !== tag || "href" !== key)) {
         domElement.removeAttribute(key);
         break;
       }
@@ -17923,7 +17923,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1908 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-3ac173cd",
+  version: "18.3.0-www-classic-ec24bb93",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -17967,7 +17967,7 @@ var devToolsConfig$jscomp$inline_1908 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-3ac173cd"
+  reconcilerVersion: "18.3.0-www-classic-ec24bb93"
 });
 assign(Internals, {
   ReactBrowserEventEmitter: {
@@ -18304,7 +18304,7 @@ exports.useFormStatus = function () {
     return ReactCurrentDispatcher$2.current.useHostTransitionStatus();
   throw Error(formatProdErrorMessage(248));
 };
-exports.version = "18.3.0-www-classic-3ac173cd";
+exports.version = "18.3.0-www-classic-ec24bb93";
 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
   "function" ===
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js
@@ -15396,7 +15396,7 @@ function setProp(domElement, tag, key, value, props, prevValue) {
       break;
     case "src":
     case "href":
-      if ("" === value) {
+      if ("" === value && ("a" !== tag || "href" !== key)) {
         domElement.removeAttribute(key);
         break;
       }
@@ -17440,7 +17440,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1867 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-4fcabd82",
+  version: "18.3.0-www-modern-c768d9b6",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -17485,7 +17485,7 @@ var devToolsConfig$jscomp$inline_1867 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-4fcabd82"
+  reconcilerVersion: "18.3.0-www-modern-c768d9b6"
 });
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
 exports.createPortal = function (children, container) {
@@ -17750,7 +17750,7 @@ exports.useFormStatus = function () {
     return ReactCurrentDispatcher$2.current.useHostTransitionStatus();
   throw Error(formatProdErrorMessage(248));
 };
-exports.version = "18.3.0-www-modern-4fcabd82";
+exports.version = "18.3.0-www-modern-c768d9b6";
 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
   "function" ===
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

diff --git a/compiled/facebook-www/ReactDOMServer-dev.classic.js b/compiled/facebook-www/ReactDOMServer-dev.classic.js
@@ -19,7 +19,7 @@ if (__DEV__) {
     var React = require("react");
     var ReactDOM = require("react-dom");
 
-    var ReactVersion = "18.3.0-www-classic-59dbb481";
+    var ReactVersion = "18.3.0-www-classic-34681660";
 
     // This refers to a WWW module.
     var warningWWW = require("warning");
@@ -3329,6 +3329,59 @@ if (__DEV__) {
       }
     }
 
+    function pushStartAnchor(target, props) {
+      target.push(startChunkForTag("a"));
+      var children = null;
+      var innerHTML = null;
+
+      for (var propKey in props) {
+        if (hasOwnProperty.call(props, propKey)) {
+          var propValue = props[propKey];
+
+          if (propValue == null) {
+            continue;
+          }
+
+          switch (propKey) {
+            case "children":
+              children = propValue;
+              break;
+
+            case "dangerouslySetInnerHTML":
+              innerHTML = propValue;
+              break;
+
+            case "href":
+              if (propValue === "") {
+                // Empty `href` is special on anchors so we're short-circuiting here.
+                // On other tags it should trigger a warning
+                pushStringAttribute(target, "href", "");
+              } else {
+                pushAttribute(target, propKey, propValue);
+              }
+
+              break;
+
+            default:
+              pushAttribute(target, propKey, propValue);
+              break;
+          }
+        }
+      }
+
+      target.push(endOfStartTag);
+      pushInnerHTML(target, innerHTML, children);
+
+      if (typeof children === "string") {
+        // Special case children as a string to avoid the unnecessary comment.
+        // TODO: Remove this special case after the general optimization is in place.
+        target.push(stringToChunk(encodeHTMLTextNode(children)));
+        return null;
+      }
+
+      return children;
+    }
+
     function pushStartSelect(target, props) {
       {
         checkControlledValueProps("select", props);
@@ -5344,7 +5397,13 @@ if (__DEV__) {
         case "span":
         case "svg":
         case "path":
-        case "a":
+          // Fast track very common tags
+          break;
+
+        case "a": {
+          return pushStartAnchor(target, props);
+        }
+
         case "g":
         case "p":
         case "li":