plotly / plotly/dash

filter_query condition of dash_table incorrectly matches unexpected rows

Open
#1,878 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug dash-data-table P3
Dominant language
Python
Stars
24.4k
Forks
2.3k
Avg merge
2d 7h
Merged PRs (30d)
13

Description

Describe your context

dash                 2.0.0

Describe the bug

The bug can be reproduced with the code below.

import dash
from dash import dash_table

table_props = {
    "columns": [
        {
            "id": "item_id",
            "name": "item_id",
            "type": "text",
        },
    ],
    "data": [
        {
            "item_id": "1234567890123456789z",
        },
        {
            "item_id": "12345678901234567890",
        },
        {
            "item_id": "12345678901234567891",
        },
    ],
    "style_data_conditional": [
        {
            "backgroundColor": "AQUA",
            "if": {
                "filter_query": "{item_id} = \"12345678901234567892\""
            }
        }
    ]
}


app = dash.Dash(__name__)
app.layout = dash_table.DataTable(**table_props)

app.run_server(debug=True)

Expected behavior

None of the rows should be matched by the filter_query, and thus should not be highlighted with AQUA background.

However, the last 2 rows are highlighted.

I suspect the bug might have to do with the fact that the column values look like numbers and thus being interpreted as numbers, but because the parsed numbers exceed what Javascript can represent, so they are coerced to some place holder for numbers exceeding the allowed range.

Screenshots

image

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the reproducible dash_table.DataTable example and the filter_query condition on item_id. Trace how filter_query compares the large text values in the frontend, then verify that the example highlights no rows while exact matching values still behave correctly.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, python
Domain
data-visualization, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.