// at line 47
render() {
// destructure out the props used by the HOC
const { opentokClientUrl, loadingDelegate, ...restProps } = this.props;
if (this.state.scriptLoaded) {
return <InnerComponent {...restProps} />;
}
return loadingDelegate;
}
// at Line 59
PreloadScript.propTypes = {
opentokClientUrl: PropTypes.string,
loadingDelegate: PropTypes.node,
};
Expected Typescript Behavior
The HOC take in a InnerComponent and outputs a new Components with it's own propTypes but also passes on any props not used by itself to the InnerComponent. Props outside of PreloadScriptProps / PreloadScript.propTypes should therefore comply with the InnerCompoents prop type validation as well as preloadScripts Prop types.
Actual Typescript Behavior
Passing in props besides PreloadScriptProps will trigger a type checking error, contrary to the behavior allowed in vanilla JS. You therefore can't pass down props to InnerComponent in TS despite the JS code doing that
Remedy
Update the typing declarations for preloadScript to use generics to allow props to be passed down to InnerComponent
Behavior of
preloadScript.js
Expected Typescript Behavior
The HOC take in a
InnerComponent
and outputs a new Components with it's ownpropTypes
but also passes on any props not used by itself to the InnerComponent. Props outside ofPreloadScriptProps / PreloadScript.propTypes
should therefore comply with theInnerCompoents
prop type validation as well aspreloadScripts
Prop types.Actual Typescript Behavior
Passing in props besides
PreloadScriptProps
will trigger a type checking error, contrary to the behavior allowed in vanilla JS. You therefore can't pass down props toInnerComponent
in TS despite the JS code doing thatRemedy
Update the typing declarations for
preloadScript
to use generics to allow props to be passed down toInnerComponent