002ee78966
## Description
**Problem**
When using a Table widget's Select column type with dynamic options, the
computed value binding fails to handle empty table states correctly. If
the table has no data (`processedTableData` is empty), the dynamic
options evaluation still attempts to map over the non-existent table
data, resulting in an empty array instead of the expected options.
**Root Cause**
The issue stems from the `getComputedValue` function always using the
table mapping binding prefix:
```typescript
{{${tableName}.processedTableData.map((currentRow, currentIndex) => (
// dynamic options here
))}}
```
This creates an unnecessary dependency on table data even when the
dynamic options don't reference `currentRow` or `currentIndex`, causing
evaluation to fail when the table is empty.
### Problematic Evaluation
When the table is empty, expressions like this in table widget computed
properties:
```typescript
{{[
{ label: "Released", value: "Released" },
{ label: "Not Released", value: "Not Released" }
]}}
```
Would evaluate to an empty array `[]` because it's wrapped in a `.map()`
over empty table data.
**Solution**
Updated the binding logic to account for scenarios where table does not
have data and return the evaluated string directly in an IIFE
1. Updated the binding prefix and suffix
```typescript
static getBindingPrefix = (tableName: string) => {
return `{{(() => { const tableData = ${tableName}.processedTableData || []; return tableData.length > 0 ? tableData.map((currentRow, currentIndex) => (`;
};
static getBindingSuffix = (stringToEvaluate: string) => {
return `)) : ${stringToEvaluate} })()}}`;
};
```
2. Refactored `getComputedValue` and `getInputComputedValue` to
implement the new bindings
3. Created a migration and migration test for the DSL change
This ensures that:
- Dynamic options not dependent on table context evaluate correctly even
with empty tables
- The component maintains consistent behaviour across all table states
The solution prevents unnecessary table data dependencies while
preserving the ability to use table-specific values when required.
Fixes #23470
## Automation
/ok-to-test tags="@tag.Table, @tag.Binding, @tag.Select, @tag.Sanity,
@tag.Widget"
### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/13514895959>
> Commit: 0d2e78a0a7be63d4f70fc3499829621bd1761b3d
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=13514895959&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Table, @tag.Binding, @tag.Select, @tag.Sanity,
@tag.Widget`
> Spec:
> <hr>Tue, 25 Feb 2025 07:52:52 UTC
<!-- end of auto-generated comment: Cypress test results -->
## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [x] No
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Enhanced test coverage for adding new rows in the `TableV2` widget,
ensuring proper UI behavior when no data exists.
- **Bug Fixes**
- Improved validation of UI elements based on the "Allow adding a row"
property.
- **Refactor**
- Streamlined logic for handling computed values in the
`ComputeTablePropertyControlV2`, improving readability and
functionality.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|---|---|---|
| .. | ||
| .husky | ||
| .yarn | ||
| config | ||
| cypress | ||
| docker/templates | ||
| generators | ||
| packages | ||
| public | ||
| scripts | ||
| src | ||
| test | ||
| typings | ||
| .babelrc | ||
| .dockerignore | ||
| .editorconfig | ||
| .eslintrc.base.json | ||
| .eslintrc.js | ||
| .fork-ts-checkerrc | ||
| .gitignore | ||
| .lintstagedrc.json | ||
| .nvmrc | ||
| .prettierignore | ||
| .prettierrc | ||
| .sentryclirc | ||
| .yarnrc.yml | ||
| build.sh | ||
| cypress_ci_custom.config.ts | ||
| cypress_ci_hosted.config.ts | ||
| cypress_ci.config.ts | ||
| cypress-add-tags.js | ||
| cypress.config.ts | ||
| download-assets.js | ||
| jest.config.js | ||
| knip.json | ||
| package.json | ||
| README.md | ||
| README.old.md | ||
| start-caddy.sh | ||
| start-https.sh | ||
| tailwind.config.js | ||
| tsconfig.json | ||
| tsconfig.path.json | ||
| vercel.json | ||
| yarn.lock | ||
Appsmith Client
This project was bootstrapped with Create React App.
For details on setting up your development machine, please refer to the Setup Guide