influxdata / influxdata/ui

Bug: Dynamic query zoom breaks when using dashboard variables

Open
#6,863 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

kind/bug team/ui
Dominant language
TypeScript
Stars
117
Forks
51
Avg merge
2d 15h
Merged PRs (30d)
4

Description

## About the bug

**Steps to reproduce:**
List the minimal actions needed to reproduce the behavior.

1. Create a dashboard with (a) a dashboard variable, and (b) a graph using that variable in its query.
2. Zoom into the graph to trigger a re-query of the data at finer granularity

**Expected behavior:**

The graph displays more granular data from the new query.

**Actual behavior:**

- The console shows an HTTP 400 error which suggests the variable is not being included in the API request for new data; and
- The graph fails to show more granular data since it does not have new query results (only old coarse ones from the original query)

**Visual Proof:**

Here's a dashboard graph of some query results which depend on a dashboard variable, with the time range set to the 7 days:
![image](https://github.com/influxdata/ui/assets/1887854/0a3e5c97-926a-4090-ad40-6bfadba32e88)

Here's what I see if I click-and-drag to zoom into the first ~5.5 hours of the graph; note the lack of time resolution in the data:
![image](https://github.com/influxdata/ui/assets/1887854/67702c2e-28d8-44de-815b-1003df51f14e)

In contrast, here's what I see if I manually update the time range (via the dropdown at the top right of the dashboard UI) to the same 5.5 hour window instead of using the zoom feature:
![image](https://github.com/influxdata/ui/assets/1887854/a755436a-35e3-48fb-be73-60367e4588bc)

The browser console displays a 400 error for a POST request to the `/api/v2/query?orgID=...` endpoint initiated by `query.ts:61`, and the response payload for that request contains the following JSON:

```json
{
"code": "invalid",
"message": "error @5:40-5:41: record is missing label [redacted_variable_name]"
}
```

## About your environment

**Environment info:**

Cloud version of Influx 2 (TSM), so no shell access to run the requested commands.

Contributor guide

No contributing guide indexed for this repository

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 at query.ts:61, where the zoom-triggered POST request to /api/v2/query is initiated, and reproduce the dashboard-variable case described in the issue. Done means the variable is included in the zoom re-query, the request no longer returns HTTP 400, and the graph displays more granular data.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
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.