chore: add test for object slots

This commit is contained in:
Amour1688 2020-12-12 00:36:24 +08:00
parent c04904f209
commit 87f614b703
2 changed files with 34 additions and 8 deletions

View File

@ -121,8 +121,8 @@ const transformJSXElement = (
} else if ( } else if (
t.isCallExpression(child) && child.loc && isComponent t.isCallExpression(child) && child.loc && isComponent
) { // the element was generated and doesn't have location information ) { // the element was generated and doesn't have location information
const slotId = path.scope.generateUidIdentifier('slot'); const { scope } = path;
const scope = path.scope; const slotId = scope.generateUidIdentifier('slot');
if (scope) { if (scope) {
scope.push({ scope.push({
id: slotId, id: slotId,

View File

@ -571,23 +571,49 @@ describe('should support passing object slots via JSX children', () => {
expect(wrapper.html()).toBe('<span>foo<!----></span>'); expect(wrapper.html()).toBe('<span>foo<!----></span>');
}); });
test('single expression, array map expression', () => { test('single expression, function expression variable', () => {
const Test = defineComponent({ const foo = () => 'foo';
setup(_, { slots }) {
return () => <span>{slots.default?.()}</span>; const wrapper = mount({
render() {
return (
<A>{foo}</A>
);
}, },
}); });
expect(wrapper.html()).toBe('<span>foo<!----></span>');
});
test('single expression, array map expression', () => {
const data = ['A', 'B', 'C']; const data = ['A', 'B', 'C'];
const wrapper = mount({ const wrapper = mount({
render() { render() {
return ( return (
<div>{data.map((item: string) => <Test><span>{item}</span></Test>)}</div> <>
{data.map((item) => <A><span>{item}</span></A>)}
</>
); );
}, },
}); });
expect(wrapper.html()).toBe('<div><span><span>A</span></span><span><span>B</span></span><span><span>C</span></span></div>'); expect(wrapper.html()).toBe('<span><span>A</span><!----></span><span><span>B</span><!----></span><span><span>C</span><!----></span>');
});
test('xx', () => {
const data = ['A', 'B', 'C'];
const wrapper = mount({
render() {
return (
<>
{data.map((item) => <A>{() => <span>{item}</span>}</A>)}
</>
);
},
});
expect(wrapper.html()).toBe('<span><span>A</span><!----></span><span><span>B</span><!----></span><span><span>C</span><!----></span>');
}); });
}); });