diff --git a/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx b/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx index 23c55716cc38f66bdfa55e62bf27113a1efd3ae7..b2f90f8dfa9bab61665512c5956e123dbca3ed74 100644 --- a/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx +++ b/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx @@ -109,7 +109,12 @@ export default class LoadingAndErrorWrapper extends Component { ); if (noWrapper && !error && !loading) { - return React.Children.only(this.getChildren()); + const children = this.getChildren(); + // special case for loading wrapper with null/undefined child + if (children == null) { + return null; + } + return React.Children.only(children); } return ( <div className={this.props.className} style={this.props.style}> diff --git a/frontend/test/metabase/components/LoadingAndErrorWrapper.unit.spec.js b/frontend/test/metabase/components/LoadingAndErrorWrapper.unit.spec.js index f5b389915008266333aed568fc79005f4f13462c..ada32475f4681c3c360ea20b676b6be69342c5e0 100644 --- a/frontend/test/metabase/components/LoadingAndErrorWrapper.unit.spec.js +++ b/frontend/test/metabase/components/LoadingAndErrorWrapper.unit.spec.js @@ -22,6 +22,10 @@ describe("LoadingAndErrorWrapper", () => { expect(wrapper.find(Child).length).toEqual(1); }); + it("shouldn't fail if loaded with null children and no wrapper", () => { + mount(<LoadingAndErrorWrapper loading={false} noWrapper />); + }); + it("should display a given scene during loading", () => { const Scene = () => <div>Fun load animation</div>;