renderAttachedToDocument function

dynamic renderAttachedToDocument(
  1. dynamic component, {
  2. bool autoTearDown = true,
  3. Element? container,
  4. Callback? autoTearDownCallback,
})

Renders the component into a node attached to document.body as opposed to a detached node.

Returns the rendered component.

Implementation

/* [1] */ renderAttachedToDocument(dynamic component,
    {bool autoTearDown = true,
    Element? container,
    Callback? autoTearDownCallback}) {
  final containerElement = container ??
      (DivElement()
        // Set arbitrary height and width for container to ensure nothing is cut off.
        ..style.setProperty('width', '800px')
        ..style.setProperty('height', '800px'));

  setComponentZone();

  document.body!.append(containerElement);

  if (autoTearDown) {
    addTearDown(() {
      react_dom.unmountComponentAtNode(containerElement);
      containerElement.remove();
      if (autoTearDownCallback != null) autoTearDownCallback();
    });
  } else {
    _attachedReactContainers.add(containerElement);
  }

  return react_dom.render(component is component_base.UiProps ? component.build() : component, containerElement);
}