Skip to content

fix(DataTable): add null check for data in Column component#3265

Open
adchamberlain wants to merge 1 commit intoevidence-dev:mainfrom
adchamberlain:fix/datatable-column-null-check
Open

fix(DataTable): add null check for data in Column component#3265
adchamberlain wants to merge 1 commit intoevidence-dev:mainfrom
adchamberlain:fix/datatable-column-null-check

Conversation

@adchamberlain
Copy link

@adchamberlain adchamberlain commented Jan 21, 2026

Problem

Added null check in Column.svelte's checkColumnName() function to guard against data not being
ready during initial render.

Changes

function checkColumnName() {                                                                     
    try {                                                                                        
        // Guard against data not being ready yet                                                
        if (!$props.data || !$props.data.length || !$props.data[0]) {                            
            return; // Data not ready, skip validation for now                                   
        }                                                                                        
        // ... rest of validation                                                                
    }                                                                                            
}                                                                                                
                                                                                                 
Testing Notes                                                                                    
                                                                                                 
While testing this fix, we discovered there may be additional rendering issues in DataTable      
beyond this null check:                                                                          
                                                                                                 
- Debug output confirmed data flows correctly through the component:                             
  - columnSummary.length = 7                                                                     
  - props.columns.length = 7                                                                     
  - orderedColumns.length = 7                                                                    
  - displayedData.length = 5                                                                     
- Despite all data being populated correctly, the table-container div does not render            
- Raw HTML tables iterating over the same Query data render correctly, confirming data access    
works                                                                                            
- Issue reproduced with both inline SQL queries and source data queries                          
                                                                                                 
This PR addresses the async data guard in checkColumnName(), but the Evidence team may want to   
investigate the broader table rendering issue where the table container fails to render even when
 all data props are properly populated.                                                          
                                                                                                 
Environment                                                                                      
                                                                                                 
- @evidence-dev/core-components: 5.4.0                                                           
- @evidence-dev/evidence: 40.1.6                                                                 
                                             

The checkColumnName() function in Column.svelte was accessing
$props.data[0] without first checking if data was available.
This caused DataTable to silently fail when data was loaded
asynchronously (e.g., via Query objects), resulting in the
table container rendering but no rows being displayed.

Added guard clause to return early if data is not yet ready,
allowing the reactive update to properly register columns
once data becomes available.

Fixes issue where DataTable shows search/pagination but no rows.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant