cloudflare / cloudflare/react-gateway

Infinite render loop with deeply dynamic children

Open
#21 1 comment 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
576
Forks
70
PR merge metrics
No merged PRs in 30d

Description

## Description

I've got a `Modal` component which renders the modal box + its children if it's own `open` prop is set to `true`. This is run through `VelocityTransitionGroup`, which means if the `open` prop changes, it'll add remove/children respectively.

This causes an infinite render bug due, which I believe is due to [lines 34 - 36 in GatewayRegistry.js](https://github.com/cloudflare/react-gateway/blob/master/src/GatewayRegistry.js#L34-L36).

## Background information

The purpose of using `react-gateway` was to avoid an issue with nested forms, where the modal rendered its own form, after being triggered by an existing `form`'s element event.

## Question

**Why is it necessary to completely delete all the children?**

If my `Modal` is set to `open={true}`, it'll continuously try to re-render the children, because sending a `` into `Gateway` instructs the modal to add its own children, thus triggering `componentWillReceiveProps` on`Gateway`, and effectively deleting it and adding it **continuously**.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.