zulip / zulip-mobile / 7473

47%

push

travis-ci

composebox: On hide, keep Inputs mounted, just invisible.

Fixes #2861.

When `canSend` property is `false` we hide the ComposeBox component.
Then after it appears again the contents of both topic and message
Inputs are missing.

This issue exists only with our uncontrolled Input.

The cause is quite curious. We correctly initialize the inputs
on `componentDidMount`. So the component is working correctly on
initial render. What is messing it up is that if `canSend` becomes
`false` we do render a `null` (so nothing). This happens when we
are refreshing the state, on `APP_REFRESH` called on broken queues,
but can happen in other cases too (any case that makes `canSend` be
`false`).

When we show the compose box again, since we handle the show/no show
logic inside the component's `render`, the lifecycle event
`componentDidMount` is not called again. Thus we do not initialize the
values of the new Input components for the message topic and content.

There are several approaches to fixing this:
 * take the `canSend` logic ouside of the component. On each change
   the whole component will get unmounted and the `componentDidMount`
   will be called again - not a bad solution
 * handle the `false` to `true` transition of the value inside the
   `componentWillReceiveProps` - would work, but we are trying to get
   rid of this funcion, and also makes the logic too convoluted
 * do not unmount the Inputs when hiding - the chosen solution

When we need to hide the component, instead of not rendering it at
all, we just hide it - setting the `opacity` to 0 does that.
We also set `position` to `absolute` so it does not take up space
visually.

Tested both on iOS and Android and works well.

1415 of 2957 branches covered (47.85%)

Branch coverage included in aggregate %.

4826 of 6589 relevant lines covered (73.24%)

38.0 hits per line