Skip to content

Commit b34e647

Browse files
committed
Limit the meaning of "custom element" to not include is
Effectively this means that you can't use custom properties/events, other than the ones React knows about on `is` extensions. This is unfortunate but there's too many paths that are forked in inconsistent ways. I think the solution is to let all React elements set unknown properties in the same way as this flag but that's a bigger change than this flag implies. Since `is` is not universally supported yet anyway, this doesn't seem like a huge loss. Attributes still work.
1 parent b088bc6 commit b34e647

File tree

5 files changed

+10
-6
lines changed

5 files changed

+10
-6
lines changed

packages/react-dom-bindings/src/client/ReactDOMComponent.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -653,7 +653,6 @@ export function setInitialProperties(
653653
}
654654
// defaultChecked and defaultValue are ignored by setProp
655655
default: {
656-
// TODO: If the `is` prop is specified, this should go through the isCustomElementTag flow.
657656
setProp(domElement, tag, propKey, propValue, false, props);
658657
}
659658
}
@@ -948,7 +947,6 @@ export function updateProperties(
948947
}
949948
// defaultChecked and defaultValue are ignored by setProp
950949
default: {
951-
// TODO: If the `is` prop is specified, this should go through the isCustomElementTag flow.
952950
setProp(domElement, tag, propKey, propValue, false, nextProps);
953951
}
954952
}

packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2604,7 +2604,7 @@ export function pushStartInstance(
26042604
);
26052605
}
26062606
default: {
2607-
if (type.indexOf('-') === -1 && typeof props.is !== 'string') {
2607+
if (type.indexOf('-') === -1) {
26082608
// Generic element
26092609
return pushStartGenericElement(target, props, type);
26102610
} else {

packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -308,7 +308,7 @@ function warnUnknownProperties(type, props, eventRegistry) {
308308
}
309309

310310
export function validateProperties(type, props, eventRegistry) {
311-
if (isCustomElement(type, props)) {
311+
if (isCustomElement(type, props) || typeof props.is === 'string') {
312312
return;
313313
}
314314
warnUnknownProperties(type, props, eventRegistry);

packages/react-dom-bindings/src/shared/isCustomElement.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99

1010
function isCustomElement(tagName: string, props: Object): boolean {
1111
if (tagName.indexOf('-') === -1) {
12-
return typeof props.is === 'string';
12+
return false;
1313
}
1414
switch (tagName) {
1515
// These are reserved SVG and MathML elements.

packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -669,8 +669,14 @@ describe('ReactDOMServerIntegration', () => {
669669
}
670670
});
671671

672-
itRenders('htmlFor attribute on custom elements', async render => {
672+
itRenders('htmlFor property on is elements', async render => {
673673
const e = await render(<div is="custom-element" htmlFor="test" />);
674+
expect(e.getAttribute('htmlFor')).toBe(null);
675+
expect(e.getAttribute('for')).toBe('test');
676+
});
677+
678+
itRenders('htmlFor attribute on custom elements', async render => {
679+
const e = await render(<custom-element htmlFor="test" />);
674680
expect(e.getAttribute('htmlFor')).toBe('test');
675681
expect(e.getAttribute('for')).toBe(null);
676682
});

0 commit comments

Comments
 (0)