From 8ffe9ddd6a3b0a911b19f364fe5a04becaefe4aa Mon Sep 17 00:00:00 2001
From: Vitalii Makarov <vmx@meta.com>
Date: Thu, 26 Mar 2026 15:45:21 +0000
Subject: [PATCH] Add credentialless as a recognized boolean attribute for
 iframes

## Summary

The `credentialless` attribute is a boolean HTML attribute for `<iframe>` elements
that loads the iframe in a new, ephemeral context without access to the parent's
credentials (cookies, client certificates, etc.). This change adds it to all
boolean attribute switch/case lists in React DOM so it is properly handled as a
boolean (set when true, removed when false) rather than being treated as an
unknown string attribute.

Changes:
- ReactDOMComponent.js: Added to both `setProp` and `diffHydratedGenericElement`
- ReactFizzConfigDOM.js: Added to `pushAttribute` for server-side rendering
- ReactDOMUnknownPropertyHook.js: Added to both validation switch/case lists

## Test plan

- Added unit test in DOMPropertyOperations-test.js verifying `credentialless={true}`
  sets the attribute to `''` and `credentialless={false}` removes it
- Added server rendering tests in ReactDOMServerIntegrationAttributes-test.js for
  both true and false values
- All tests pass in source and www channels (590 tests each)
- Flow type checking passes (dom-node renderer)
- Prettier and lint pass
---
 .../src/client/ReactDOMComponent.js           |  1 +
 .../src/server/ReactFizzConfigDOM.js          |  1 +
 .../src/shared/ReactDOMUnknownPropertyHook.js |  2 ++
 .../__tests__/DOMPropertyOperations-test.js   | 28 +++++++++++++++++++
 4 files changed, 32 insertions(+)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index 1b25e3727023..869cf6690ec4 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -756,6 +756,7 @@ function setProp(
     case 'async':
     case 'autoPlay':
     case 'controls':
+    case 'credentialless':
     case 'default':
     case 'defer':
     case 'disabled':
diff --git a/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js b/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js
index e654ea88007d..ba2e0b21d91a 100644
--- a/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js
+++ b/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js
@@ -1695,6 +1695,7 @@ function pushAttribute(
     case 'async':
     case 'autoPlay':
     case 'controls':
+    case 'credentialless':
     case 'default':
     case 'defer':
     case 'disabled':
diff --git a/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js b/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js
index f45e477d876f..aee7d9adb7df 100644
--- a/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js
+++ b/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js
@@ -208,6 +208,7 @@ function validateProperty(tagName, name, value, eventRegistry) {
           case 'async':
           case 'autoPlay':
           case 'controls':
+          case 'credentialless':
           case 'default':
           case 'defer':
           case 'disabled':
@@ -287,6 +288,7 @@ function validateProperty(tagName, name, value, eventRegistry) {
             case 'async':
             case 'autoPlay':
             case 'controls':
+            case 'credentialless':
             case 'default':
             case 'defer':
             case 'disabled':
diff --git a/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js b/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js
index ef09e49bf36c..5bbc2c8dbac8 100644
--- a/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js
+++ b/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js
@@ -160,6 +160,34 @@ describe('DOMPropertyOperations', () => {
       expect(container.firstChild.hasAttribute('allowFullScreen')).toBe(false);
     });
 
+    it('should set credentialless boolean attribute on iframes', async () => {
+      const container = document.createElement('div');
+      const root = ReactDOMClient.createRoot(container);
+      await act(() => {
+        root.render(<iframe credentialless={true} />);
+      });
+      expect(container.firstChild.getAttribute('credentialless')).toBe('');
+      await act(() => {
+        root.render(<iframe credentialless={false} />);
+      });
+      expect(container.firstChild.hasAttribute('credentialless')).toBe(false);
+    });
+
+    it('should set credentialless attribute when passed a string and warn', async () => {
+      const container = document.createElement('div');
+      const root = ReactDOMClient.createRoot(container);
+      await act(() => {
+        root.render(<iframe credentialless="true" />);
+      });
+      assertConsoleErrorDev([
+        'Received the string `true` for the boolean attribute `credentialless`. ' +
+          'Although this works, it will not work as expected if you pass the string "false". ' +
+          'Did you mean credentialless={true}?\n' +
+          '    in iframe (at **)',
+      ]);
+      expect(container.firstChild.getAttribute('credentialless')).toBe('');
+    });
+
     it('should remove when setting custom attr to null', async () => {
       const container = document.createElement('div');
       const root = ReactDOMClient.createRoot(container);