Filtering from second page of lens and agg based table breaks the table viz.

[bhavyarm]

Kibana version: 8.4.0 BC4

Elasticsearch version: 8.4.0 BC4

Server OS version: darwin_x86_64

Browser version: chrome latest

Browser OS version: OS X

Original install method (e.g. download page, yum, from source, etc.): from staging

Describe the bug: Filtering from second page of lens table breaks the table viz. But filtering still works on the whole dashboard.
Reported here - https://discuss.elastic.co/t/filtering-directly-from-data-table-kibana-dashboard/312075

Happens for Lens and Agg based table in the same way

filter_pagination.mp4

console error:

TypeError: Cannot read properties of undefined (reading ‘595359f9-ce2d-4f89-b9c4-020b74893f4e’)
  at h (lens.chunk.2.js:3:152079)
  at a.rowIndex (lens.chunk.2.js:3:152389)
  at Qo (kbn-ui-shared-deps-npm.dll.js:420:58290)
  at xs (kbn-ui-shared-deps-npm.dll.js:420:107231)
  at Su (kbn-ui-shared-deps-npm.dll.js:420:97979)
  at _u (kbn-ui-shared-deps-npm.dll.js:420:97791)
  at du (kbn-ui-shared-deps-npm.dll.js:420:94653)
  at kbn-ui-shared-deps-npm.dll.js:420:45571
  at t.unstable_runWithPriority (kbn-ui-shared-deps-npm.dll.js:428:3844)
  at Gi (kbn-ui-shared-deps-npm.dll.js:420:45280)

[elasticmachine]

Pinging @elastic/kibana-vis-editors @elastic/kibana-vis-editors-external (Team:VisEditors)

[drewdaemon]

Documenting some initial investigation:

Overview

The gist of the problem is that the filtering cell actions are being rendered with an updated (single row because of the filtering) data table, but an outdated rowIndex (a row index that only existed before the filtering happened). This is only occurring when the filtering took place on the second page. It looks like this inconsistency may originate on the EUI side since it is the EuiDataGrid that handles calling the cell action render functions.

Deep dive

The code is breaking here because it gets run when table.rows has a length of one (what it should be after the filter operation). If table.rows is of length one and rowIndex is a positive number, table.rows[rowIndex] would be undefined. So the code is trying to index an undefined value.

kibana/x-pack/plugins/lens/public/visualizations/datatable/components/columns.tsx

Line 66 in 925b1a7

const rowValue = table.rows[rowIndex][columnId];

This statement runs many times (thanks React), but when the filter event occurs on the first page, the statement only runs BEFORE getContentData is updated with the new filtered (single-row) table.

kibana/x-pack/plugins/lens/public/visualizations/datatable/components/columns.tsx

Line 62 in 925b1a7

const getContentData = ({

However, when the filter event originates on the second page, getContentData is run both before and AFTER it has been updated with the new filtered table. This is what causes the issue. Digging deeper...

[MakoWish]

This also affects 8.3.3 (and perhaps earlier versions?). Will this be back-ported? I only see the fix has been applied to 8.4.0 and 8.5.0.

[drewdaemon]

@MakoWish thanks for raising the question.

Pagination was merged for Lens in 8.1.0 (#118557). I've verified that this bug was present from the get-go.

For aggs-based tables, I can see the bug in 8.1.0, but not before then (checked 8.0.0 and 7.17.0).

I'll run a backport to 8.1, 8.2 (edit: closed branch), and 8.3.

[drewdaemon]

Actually, @timductive informs me that it is unlikely that a patch to 8.3 will be released, let alone 8.1. Because of this, I'll backport to 8.3 to be safe, but will leave 8.1 alone.