fix(heatmap): correct tooltip axis value lookup and percentage calculations and add tests

[yousoph]

↪️ Re-points #38522 onto my own fork so the review fixes could be pushed directly. Original review discussion (thanks @rusackas, @msyavuz, @sadpandajoe) lives on #38522; this PR carries all four requested fixes.

User description

SUMMARY

Fixes the heatmap tooltip so it displays actual axis values (e.g., "Monday", "Morning") instead of numeric indices (0, 1, 2...), corrects the tooltip percentage calculation, and adds comprehensive regression tests.

Context: After PR #36302 changed the heatmap data structure to use axis indices for proper sorting, the tooltip formatter was not updated to look up actual values from the sorted arrays. This caused tooltips to display raw indices instead of formatted axis labels.

What this PR does:

• Fixes the tooltip formatter to look up actual x/y values from the sorted axis arrays instead of rendering raw indices
• Corrects the tooltip percentage calculation by keying calculateTotals off the query colnames (the real column names present in the data) instead of getColumnLabel(...) — the old keying produced NaN percentages whenever the derived label diverged from the data columns (notably array groupby)
• Adds 5 test cases covering different tooltip scenarios
• Ensures tooltips display actual axis values, not numeric indices
• Verifies tooltip behavior with different sort orders (alphabetical asc/desc, value-based asc/desc)
• Tests percentage calculations use actual values when normalizeAcross is enabled
• Validates tooltip handling of numeric axes

Why these tests matter:
These tests prevent future regressions by verifying the tooltip formatter correctly:

1. Looks up actual x/y values from sortedXAxisValues and sortedYAxisValues arrays
2. Uses actual values (not indices) for percentage calculations in totals.x[xValue] and totals.y[yValue]
3. Handles different data types (strings, numbers) and sort configurations

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

N/A — the change affects tooltip text/percentage values (indices → axis labels, NaN% → correct %), which are covered by the added regression tests.

TESTING INSTRUCTIONS

1. Run the heatmap tooltip tests:

   cd superset-frontend
   npm test -- transformProps.test.ts
   
   

---

CodeAnt-AI Description

Fix heatmap tooltip to show actual axis labels and correct percentage calculations

What Changed

• Tooltip displays actual x/y axis values (e.g., "Monday", "11") instead of numeric indices
• Percentage shown in tooltip uses the real axis totals (not indices) when normalization is enabled
• Added tests covering alphabetical and value-based sorting, numeric axes, and percentage/normalization cases to prevent regressions

Impact

✅ Clearer heatmap tooltips
✅ Correct heatmap percentage values
✅ Fewer tooltip regressions

💡 Usage Guide

Checking Your Pull Request

Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.

Talking to CodeAnt AI

Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:

@codeant-ai ask: Your question here

This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.

Example

@codeant-ai ask: Can you suggest a safer alternative to storing this secret?

Preserve Org Learnings with CodeAnt

You can record team preferences so CodeAnt AI applies them in future reviews. Reply directly to the specific CodeAnt AI suggestion (in the same thread) and replace "Your feedback here" with your input:

@codeant-ai: Your feedback here

This helps CodeAnt AI learn and adapt to your team's coding style and standards.

Example

@codeant-ai: Do not flag unused imports.

Retrigger review

Ask CodeAnt AI to review the PR again, by typing:

@codeant-ai: review

Check Your Repository Health

To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.

[bito-code-review]

Code Review Agent Run #3b73db

Actionable Suggestions - 0

Review Details

• Files reviewed - 2 · Commit Range: c131dd2..a1d5921

  • superset-frontend/plugins/plugin-chart-echarts/src/Heatmap/transformProps.ts
  • superset-frontend/plugins/plugin-chart-echarts/test/Heatmap/transformProps.test.ts
• Files skipped - 0
• Tools

  • Whispers (Secret Scanner) - ✔︎ Successful
  • Detect-secrets (Secret Scanner) - ✔︎ Successful
  • Eslint (Linter) - ✔︎ Successful

---

Bito Usage Guide

Commands

Type the following command in the pull request comment and save the comment.

• /review - Manually triggers a full AI review.

• /pause - Pauses automatic reviews on this pull request.

• /resume - Resumes automatic reviews.

• /resolve - Marks all Bito-posted review comments as resolved.

• /abort - Cancels all in-progress reviews.

Refer to the documentation for additional commands.

Configuration

This repository uses Superset You can customize the agent settings here or contact your Bito workspace admin at evan@preset.io.

Documentation & Help

• Customize agent settings
• Review rules
• General documentation
• FAQ

AI Code Review powered by

[netlify]

✅ Deploy Preview for superset-docs-preview ready!

Name	Link
🔨 Latest commit	b693859
🔍 Latest deploy log	https://app.netlify.com/projects/superset-docs-preview/deploys/6a5030123456ce000849481f
😎 Deploy Preview	https://deploy-preview-41864--superset-docs-preview.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[codeant-ai-for-open-source]

Suggestion: Replace this any cast on the tooltip option with a concrete tooltip/options type so formatter is accessed through typed properties. [custom_rule]

Severity Level: Minor ⚠️

Why it matters? 🤔

The file still casts result.echartOptions.tooltip to any before accessing formatter, which directly violates the no-any-types rule for changed TypeScript code.

Rule source 📖

.cursor/rules/dev-standard.mdc (line 16)

(Use Cmd/Ctrl + Click for best experience)

Prompt for AI Agent 🤖

This is a comment left during a code review.

**Path:** superset-frontend/plugins/plugin-chart-echarts/test/Heatmap/transformProps.test.ts
**Line:** 370:370
**Comment:**
	*Custom Rule: Replace this `any` cast on the tooltip option with a concrete tooltip/options type so `formatter` is accessed through typed properties.

Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise.
Once fix is implemented, also check other comments on the same PR, and ask user if the user wants to fix the rest of the comments as well. if said yes, then fetch all the comments validate the correctness and implement a minimal fix

👍 | 👎

[codeant-ai-for-open-source]

Suggestion: Remove the any cast here and type the tooltip object explicitly to keep the formatter access type-safe. [custom_rule]

Severity Level: Minor ⚠️

Why it matters? 🤔

The code uses an any cast on the tooltip object in new test logic, so the suggestion correctly identifies a real violation of the no-any-types rule.

Rule source 📖

.cursor/rules/dev-standard.mdc (line 16)

(Use Cmd/Ctrl + Click for best experience)

Prompt for AI Agent 🤖

This is a comment left during a code review.

**Path:** superset-frontend/plugins/plugin-chart-echarts/test/Heatmap/transformProps.test.ts
**Line:** 454:454
**Comment:**
	*Custom Rule: Remove the `any` cast here and type the tooltip object explicitly to keep the formatter access type-safe.

Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise.
Once fix is implemented, also check other comments on the same PR, and ask user if the user wants to fix the rest of the comments as well. if said yes, then fetch all the comments validate the correctness and implement a minimal fix

👍 | 👎

[codeant-ai-for-open-source]

Suggestion: Use a concrete tooltip/options type instead of casting to any before accessing formatter. [custom_rule]

Severity Level: Minor ⚠️

Why it matters? 🤔

This line also casts to any in TypeScript test code, which is exactly what the no-any-types rule flags.

Rule source 📖

.cursor/rules/dev-standard.mdc (line 16)

(Use Cmd/Ctrl + Click for best experience)

Prompt for AI Agent 🤖

This is a comment left during a code review.

**Path:** superset-frontend/plugins/plugin-chart-echarts/test/Heatmap/transformProps.test.ts
**Line:** 477:477
**Comment:**
	*Custom Rule: Use a concrete tooltip/options type instead of casting to `any` before accessing `formatter`.

Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise.
Once fix is implemented, also check other comments on the same PR, and ask user if the user wants to fix the rest of the comments as well. if said yes, then fetch all the comments validate the correctness and implement a minimal fix

👍 | 👎

[codeant-ai-for-open-source]

Suggestion: Avoid casting chartProps to any; define the correct chart props/query data type and update colnames through typed fields. [custom_rule]

Severity Level: Minor ⚠️

Why it matters? 🤔

The mutation explicitly casts chartProps to any, so this is a genuine instance of prohibited any usage in changed TypeScript code.

Rule source 📖

.cursor/rules/dev-standard.mdc (line 16)

(Use Cmd/Ctrl + Click for best experience)

Prompt for AI Agent 🤖

This is a comment left during a code review.

**Path:** superset-frontend/plugins/plugin-chart-echarts/test/Heatmap/transformProps.test.ts
**Line:** 508:508
**Comment:**
	*Custom Rule: Avoid casting `chartProps` to `any`; define the correct chart props/query data type and update `colnames` through typed fields.

Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise.
Once fix is implemented, also check other comments on the same PR, and ask user if the user wants to fix the rest of the comments as well. if said yes, then fetch all the comments validate the correctness and implement a minimal fix

👍 | 👎

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 64.63%. Comparing base (1fd43ff) to head (b693859).
⚠️ Report is 224 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master   #41864      +/-   ##
==========================================
+ Coverage   64.57%   64.63%   +0.06%     
==========================================
  Files        2713     2712       -1     
  Lines      151269   151142     -127     
  Branches    34793    34761      -32     
==========================================
+ Hits        97684    97697      +13     
+ Misses      51760    51622     -138     
+ Partials     1825     1823       -2     

Flag	Coverage Δ
javascript	69.83% <ø> (+0.05%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[rusackas]

Thanks for carrying this back over from #38522 with the fixes @msyavuz and I flagged. Diff looks right to me, xAxisColumnName/yAxisColumnName line up with what's already in the file. Let's merge if the bots are all happy.

[rusackas]

Happy to go through bot stuff if you'd like a hand getting this across the finish line.