Add credentialless as a recognized boolean attribute for iframes#36148
Add credentialless as a recognized boolean attribute for iframes#36148
Conversation
## 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
|
Comparing: 3cb2c42...8709472 Critical size changesIncludes critical production bundles, as well as any change greater than 2%:
Significant size changesIncludes any change greater than 0.2%: (No significant changes) |
| await act(() => { | ||
| root.render(<iframe credentialless={true} />); | ||
| }); | ||
| expect(container.firstChild.getAttribute('credentialless')).toBe(''); |
There was a problem hiding this comment.
@vmx906 I am a bit confused, should this be expect(container.firstChild.getAttribute('credentialless')).toBe('true'); ?
There was a problem hiding this comment.
@hoxyq I believe react set this to empty string when the prop is bool, see [1]
if (value && typeof value !== 'function' && typeof value !== 'symbol') {
domElement.setAttribute(key, '');
}
There was a problem hiding this comment.
@vmx906 Oh, I see, thanks! We use the presence of the attribute as a source of truth for boolean attributes.
| case 'seamless': | ||
| case 'itemScope': { | ||
| if (value && typeof value !== 'function' && typeof value !== 'symbol') { | ||
| domElement.setAttribute(key, ''); |
| await act(() => { | ||
| root.render(<iframe credentialless={true} />); | ||
| }); | ||
| expect(container.firstChild.getAttribute('credentialless')).toBe(''); |
There was a problem hiding this comment.
@hoxyq I believe react set this to empty string when the prop is bool, see [1]
if (value && typeof value !== 'function' && typeof value !== 'symbol') {
domElement.setAttribute(key, '');
}
| case 'controls': | ||
| case 'default': |
There was a problem hiding this comment.
@vmx906 I think you need to add credentialless here as well.
Can you also add a few test cases to ReactDOMServerIntegrationAttributes-test.js, similarly to what you did in DOMPropertyOperations-test.js?
There was a problem hiding this comment.
Good catch! Updated this missing path and added test
…DOMServerIntegrationAttributes-test.js
) ## 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. Per the [Anonymous iframe spec (WICG)](https://wicg.github.io/anonymous-iframe/): > The credentialless attribute enables loading documents hosted by the iframe with a new and ephemeral storage partition. It is a boolean value. The default is false. ``` partial interface HTMLIFrameElement { attribute boolean credentialless; }; ``` 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 - All tests pass in source and www channels (590 tests each) - Flow type checking passes (dom-node renderer) - Prettier and lint pass DiffTrain build for [306a01b](306a01b)
) ## 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. Per the [Anonymous iframe spec (WICG)](https://wicg.github.io/anonymous-iframe/): > The credentialless attribute enables loading documents hosted by the iframe with a new and ephemeral storage partition. It is a boolean value. The default is false. ``` partial interface HTMLIFrameElement { attribute boolean credentialless; }; ``` 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 - All tests pass in source and www channels (590 tests each) - Flow type checking passes (dom-node renderer) - Prettier and lint pass DiffTrain build for [306a01b](306a01b)
Summary
The
credentiallessattribute 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.Per the Anonymous iframe spec (WICG):
Changes:
setPropanddiffHydratedGenericElementpushAttributefor server-side renderingTest plan
credentialless={true}sets the attribute to''andcredentialless={false}removes it