support slot attribute on DOM elements for V1 shadowDom named slots p… (#8061)
* support slot attribute on DOM elements for V1 shadowDom named slots projection Closes #7784 * fix(test): fix lint errors
Martin Hochel committed
Nov 5, 2016 at 17:34 UTC
346d50e2ba0cccf25605791e9739ddb0cf5ddd04
2 files changed
+20
src/renderers/dom/shared/HTMLDOMPropertyConfig.js
+2
@@ -139,6 +139,8 @@ var HTMLDOMPropertyConfig = {
139
shape: 0,
140
size: HAS_POSITIVE_NUMERIC_VALUE,
141
sizes: 0,
142
+ // support for projecting regular DOM Elements via V1 named slots ( shadow dom )
143
+ slot: 0,
144
span: HAS_POSITIVE_NUMERIC_VALUE,
145
spellCheck: 0,
146
src: 0,
src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+18
@@ -245,6 +245,24 @@ describe('ReactDOMComponent', () => {
245
expect(stubStyle.display).toEqual('');
246
});
247
248
+ it('should allow named slot projection on both web components and regular DOM elements', () => {
249
+ var container = document.createElement('div');
250
+
251
+ ReactDOM.render(
252
+ <my-component>
253
+ <my-second-component slot="first"></my-second-component>
254
+ <button slot="second">Hello</button>
255
+ </my-component>,
256
+ container
257
+ );
258
+
259
+ var lightDOM = container.firstChild.childNodes;
260
+
261
+ expect(lightDOM[0].getAttribute('slot')).toBe('first');
262
+ expect(lightDOM[1].getAttribute('slot')).toBe('second');
263
+
264
+ } );
265
+
266
it('should skip reserved props on web components', () => {
267
var container = document.createElement('div');
268