Skip to content

@types/react does not allow returning ReactPortal from render #20942

@Jessidhia

Description

@Jessidhia

A ReactPortal is not accepted as a valid ReactElement as it does not have a type or props key. However, React itself does accept ReactPortals as a valid return value.

This might be a bit tricky to fix as simply changing StatelessComponent/ComponentClass to return ReactElement|ReactPortal will probably break many things.

This problem will also probably repeat itself with future React.Fragment.

interface PortalProps {
  children: React.ReactNode
  target: Element
}
// type error: ReactPortal not assignable to ReactElement
const Portal: React.SFC<PortalProps> = ({ children, target }: PortalProps) => ReactDOM.createPortal(children, target)
const Portal2 = ({ children, target }: PortalProps) => ReactDOM.createPortal(children, target)
// type error: Portal2 is not a constructor for JSX elements
const test = <Portal2 target={document.body}>test</Portal2>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions