Form's explicitly-valued null fields now show as undefined

Goal

Have fields' values within a form component show as null instead of undefined. (I believe this is a new, unexpected behavior; details below.)

Steps

  1. Have, say, a number input. Allow its value to either be the result of a query, or null:

Retool - form field undefined vs null 1

  1. Make sure the "Allow null" is checked in the component's Interaction > Validation Rules section:

Retool - form field undefined vs null 5

  1. Notice that when viewing the state of the component, both in the preview of the Default Value box (shown above) as well as in the State Inspector via the value property that it's indeed null:

Retool - form field undefined vs null 2

  1. But when that component is shown in the list of the form's .data property, it shows as undefined:

Retool - form field undefined vs null 3


It's a bit difficult to explain the details of noticing this, but for the past 2+ years we had a diff'ing function that would compare a query's data (the one that is used as the default data) with the corresponding fields in a form. The operation would hinge on the difference between a field with a non-null value and a null value.

We haven't touched the underlying comparison code here. From what I can tell, something in a form's .data list of components, and their values, has changed from allowing null for empty fields to now showing undefined. If this had always been the case, our function would've been malfunctioning in terms of its output — as it is now — for years.

From what I can tell this began only a week or so ago. As undefined and null are technically distinct — especially for certain types of API interaction and data persistence — I'm reluctant to refactor my entire app before asking about this.

Just a guess, but maybe it came about as a side effect of the fix that went in for this issue?

1 Like