Incosistent behavior of boolean property conditions

chillleader commented 7 months ago

Describe the Bug

Boolean properties behave inconsistently when it comes to referencing them in conditions:

When condition expects a boolean property to be true, it works as expected
When condition expects a boolean property to be false, nothing happens
Additionally, the boolean property's initial state is visually false (checkbox not active), however, the default element template value is "" (empty string).

Steps to Reproduce

Use the following element template

Element template

```json { "$schema": "https://unpkg.com/@camunda/zeebe-element-templates-json-schema/resources/schema.json", "name": "Boolean prop bug demo", "id": "9741b537-6b04-4540-9fbc-e136dcbcb5bc", "version": 1713266932057, "appliesTo": [ "bpmn:Task" ], "properties": [ { "id": "myBooleanProp", "type": "Boolean", "label": "Checkbox", "binding": { "type": "zeebe:property", "name": "myBooleanProp" } }, { "id": "inputForActiveCheckbox", "type": "String", "label": "Input that appears when checkbox is ACTIVE", "binding": { "type": "zeebe:property", "name": "inputActive" }, "condition": { "property": "myBooleanProp", "equals": true } }, { "id": "inputForInactiveCheckbox", "type": "String", "label": "Input that appears when checkbox is INACTIVE", "binding": { "type": "zeebe:property", "name": "inputInactive" }, "condition": { "property": "myBooleanProp", "equals": false } } ] } ```

Apply it to a task in a BPMN diagram
Observe that inputForActiveCheckbox is added when the checkbox is active, however when it's not active, inputForInactiveCheckbox is not added.

Expected Behavior

Conditions that expect boolean properties to be false should work as expected
Boolean properties should have a default value of false unless specified otherwise to be consistent with the UI representation

Environment

Desktop Modeler 5.22.0 / Web Modeler 8.5.0

marstamm commented 7 months ago

I can reproduce this bug. Root cause is this line, where we check if the condition has an equals.

https://github.com/bpmn-io/bpmn-js-element-templates/blob/8ccc64e4591195aaaf4d80eaddff7fdacac37f64/src/cloud-element-templates/Condition.js#L57-L59

The Code only checks if equals has a truthy value, rather than if the property exists. This blocks use-cases like checking for "false" or "undefined". We should therefore use condition.hasOwnProperty('equals') here.

marstamm commented 6 months ago

When implementing, I noticed that initially, the value will be '' (empty string) instead of false. To ensure the conditional property is displayed on the first render, you need to add a default value to it:

    {
      "id": "myBooleanProp",
      "type": "Boolean",
      "label": "Checkbox",
      "binding": {
        "type": "zeebe:property",
        "name": "myBooleanProp"
      },
      "value": false
    },

I'll go ahead with the identified fix and open a follow-up issue to decide if we always want to persist "false" by default

nikku commented 6 months ago

Released v1.15.2 with the fix.

bpmn-io / bpmn-js-element-templates