You are viewing a plain text version of this content. The canonical link for it is here.

Posted to notifications@superset.apache.org by "venkateshwaracholan (via GitHub)" <gi...@apache.org> on 2026/03/22 10:49:21 UTC

[I] Unexpected focus outline (blue border) on Filter Badge popover [superset]

venkateshwaracholan opened a new issue, #38789:
URL: https://github.com/apache/superset/issues/38789

### Bug description
After page refresh, when hovering over the Filter Badge (indicator showing the count of applied filters) on a dashboard chart, a default blue focus outline appears around the popover container. This visual artifact is inconsistent with the rest of the Superset UI.

### How to reproduce the bug
1. Open a dashboard with filters and apply filters.
2. Refresh the page
3. Hover over the Filter Badge (the "1" or "2" icon next to the filter funnel).
4. Observe the blue border appearing around the "Applied filters" popover.

### Screenshots/recordings
[Paste your video or image here]

### Superset version
master / latest-dev

### Python version
3.9

### Node version
16

### Browser
Chrome

### Additional context
No response

### Checklist
- [x] I have searched Superset docs and Slack and didn't find a solution to my problem.
- [x] I have searched the GitHub issue tracker and didn't find a similar bug report.
- [x] I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.

--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

Re: [I] Unexpected focus outline (blue border) on Filter Badge popover [superset]

Posted by "rusackas (via GitHub)" <gi...@apache.org>.

rusackas closed issue #38789: Unexpected focus outline (blue border) on Filter Badge popover
URL: https://github.com/apache/superset/issues/38789


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

Re: [I] Unexpected focus outline (blue border) on Filter Badge popover [superset]

Posted by "hainenber (via GitHub)" <gi...@apache.org>.

hainenber commented on issue #38789:
URL: https://github.com/apache/superset/issues/38789#issuecomment-4106480065

   @fowlerp397-tech please refrain from these comments. Very Clawd-like and non-constructive to the issue nor fix.


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

Re: [I] Unexpected focus outline (blue border) on Filter Badge popover [superset]

Posted by "dosubot[bot] (via GitHub)" <gi...@apache.org>.

dosubot[bot] commented on issue #38789:
URL: https://github.com/apache/superset/issues/38789#issuecomment-4105994950

   <!-- Answer -->
   This issue is likely related to the popover container itself rather than the `FilterItem` styled component, which [explicitly removes focus outlines](https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx#L81-L88) with `outline: none`, `border: none`, and Firefox-specific handling.
   
   The blue focus outline you're seeing may be coming from:
   1. The Ant Design `Popover` component used in [`DetailsPanelPopover`](https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx) - global AntD styles might be applying focus outlines
   2. Browser default focus styles on the popover's container element that aren't being overridden
   
   Worth noting: [Issue #38727](https://github.com/apache/superset/issues/38727) reported a similar visual regression on this same popover (transparent background), which was traced to the Ant Design token theme migration in PR #34732. The blue outline you're experiencing could stem from the same migration.
   
   The relevant files to investigate are:
   - `superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx` - popover implementation
   - `superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx` - styled components
   
   You might be able to fix this by adding explicit focus/outline styles to the popover's overlay or content container.
   
   
   <!-- Dosu Comment Footer -->
   *To reply, just mention [@dosu](https://go.dosu.dev/dosubot?utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=brand-link).*
   
   ---
   <sup>How did I do? [Good](https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=great_response&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-great_response) | [Irrelevant](https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=irrelevant_answer&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-irrelevant_answer) | [Incorrect](https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=incorrect_sources&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-incorrect_sources) | [Verbose](https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=too_verbose&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-too_verbose) | [Hallucination](https://app.dosu.dev/response-feedback/812a0e53-2b3d
 -4967-8ee2-28baba05a5f8?feedback_type=hallucination&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-hallucination) | [Report 🐛](https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=bug_report&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-bug_report) | [Other](https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=other&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-other)</sup>
   
   [![Chat with Dosu](https://dosu.dev/dosu-chat-badge.svg)](https://app.dosu.dev/a28d3c7e-a9d3-459e-9fb6-3a6f9ff4f357/ask?utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=chat-badge)&nbsp;[![Open in Cursor](https://dosu.dev/dosu-in-cursor.svg)](https://cursor.com/link/prompt?text=This%20issue%20is%20likely%20related%20to%20the%20popover%20container%20itself%20rather%20than%20the%20%60FilterItem%60%20styled%20component%2C%20which%20%5Bexplicitly%20removes%20focus%20outlines%5D%28https%3A//github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx%23L81-L88%29%20with%20%60outline%3A%20none%60%2C%20%60border%3A%20none%60%2C%20and%20Firefox-specific%20handling.%0A%0AThe%20blue%20focus%20outline%20you%27re%20seeing%20may%20be%20coming%20from%3A%0A1.%20The%20Ant%20Design%20%60Popover%60%20component%20used%20in%20%5B%60DetailsPanelPopover%60%5D%28https%3A//github.com/apache/su
 perset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx%29%20-%20global%20AntD%20styles%20might%20be%20applying%20focus%20outlines%0A2.%20Browser%20default%20focus%20styles%20on%20the%20popover%27s%20container%20element%20that%20aren%27t%20being%20overridden%0A%0AWorth%20noting%3A%20%5BIssue%20%2338727%5D%28https%3A//github.com/apache/superset/issues/38727%29%20reported%20a%20similar%20visual%20regression%20on%20this%20same%20popover%20%28transparent%20background%29%2C%20which%20was%20traced%20to%20the%20Ant%20Design%20token%20theme%20migration%20in%20PR%20%2334732.%20The%20blue%20outline%20you%27re%20experiencing%20could%20stem%20from%20the%20same%20migration.%0A%0AThe%20relevant%20files%20to%20investigate%20are%3A%0A-%20%60superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx%60%20-%20popover%20implementation%0A-%20%60superset-frontend/src/dashboard/components/FiltersBadge/Styles.t
 sx%60%20-%20styled%20components%0A%0AYou%20might%20be%20able%20to%20fix%20this%20by%20adding%20explicit%20focus/outline%20styles%20to%20the%20popover%27s%20overlay%20or%20content%20container.)&nbsp;[![Join Discord](https://img.shields.io/badge/join-5865F2?logo=discord&logoColor=white&label=)](https://go.dosu.dev/discord-bot?utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=join-discord)&nbsp;[![Share on X](https://img.shields.io/badge/X-share-black)](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/apache/superset/issues/38789)


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

Re: [I] Unexpected focus outline (blue border) on Filter Badge popover [superset]

Posted by "fowlerp397-tech (via GitHub)" <gi...@apache.org>.

fowlerp397-tech commented on issue #38789:
URL: https://github.com/apache/superset/issues/38789#issuecomment-4106403286

   Noticed the blue focus outline around the 'Applied filters' popover after
   page refresh. This doesn’t match the usual Superset UI. Any suggestions on
   fixing the focus styling? @superset-dev
   
   On Sun, Mar 22, 2026, 5:55 AM dosubot[bot] ***@***.***> wrote:
   
   > *dosubot[bot]* left a comment (apache/superset#38789)
   > <https://github.com/apache/superset/issues/38789#issuecomment-4105994950>
   >
   > This issue is likely related to the popover container itself rather than
   > the FilterItem styled component, which explicitly removes focus outlines
   > <https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx#L81-L88>
   > with outline: none, border: none, and Firefox-specific handling.
   >
   > The blue focus outline you're seeing may be coming from:
   >
   >    1. The Ant Design Popover component used in DetailsPanelPopover
   >    <https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx>
   >    - global AntD styles might be applying focus outlines
   >    2. Browser default focus styles on the popover's container element
   >    that aren't being overridden
   >
   > Worth noting: Issue #38727
   > <https://github.com/apache/superset/issues/38727> reported a similar
   > visual regression on this same popover (transparent background), which was
   > traced to the Ant Design token theme migration in PR #34732
   > <https://github.com/apache/superset/pull/34732>. The blue outline you're
   > experiencing could stem from the same migration.
   >
   > The relevant files to investigate are:
   >
   >    -
   >    superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx
   >    - popover implementation
   >    - superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx -
   >    styled components
   >
   > You might be able to fix this by adding explicit focus/outline styles to
   > the popover's overlay or content container.
   >
   > *To reply, just mention @dosu
   > <https://go.dosu.dev/dosubot?utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=brand-link>.*
   > ------------------------------
   >
   > How did I do? Good
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=great_response&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-great_response>
   > | Irrelevant
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=irrelevant_answer&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-irrelevant_answer>
   > | Incorrect
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=incorrect_sources&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-incorrect_sources>
   > | Verbose
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=too_verbose&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-too_verbose>
   > | Hallucination
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=hallucination&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-hallucination>
   > | Report 🐛
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=bug_report&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-bug_report>
   > | Other
   > <https://app.dosu.dev/response-feedback/812a0e53-2b3d-4967-8ee2-28baba05a5f8?feedback_type=other&utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=feedback-other>
   >
   > [image: Chat with Dosu]
   > <https://app.dosu.dev/a28d3c7e-a9d3-459e-9fb6-3a6f9ff4f357/ask?utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=chat-badge>
   >  [image: Open in Cursor]
   > <https://cursor.com/link/prompt?text=This%20issue%20is%20likely%20related%20to%20the%20popover%20container%20itself%20rather%20than%20the%20%60FilterItem%60%20styled%20component%2C%20which%20%5Bexplicitly%20removes%20focus%20outlines%5D%28https%3A//github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx%23L81-L88%29%20with%20%60outline%3A%20none%60%2C%20%60border%3A%20none%60%2C%20and%20Firefox-specific%20handling.%0A%0AThe%20blue%20focus%20outline%20you%27re%20seeing%20may%20be%20coming%20from%3A%0A1.%20The%20Ant%20Design%20%60Popover%60%20component%20used%20in%20%5B%60DetailsPanelPopover%60%5D%28https%3A//github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx%29%20-%20global%20AntD%20styles%20might%20be%20applying%20focus%20outlines%0A2.%20Browser%20default%20focus%20styles%20on%20the%20popover%27s%
 20container%20element%20that%20aren%27t%20being%20overridden%0A%0AWorth%20noting%3A%20%5BIssue%20%2338727%5D%28https%3A//github.com/apache/superset/issues/38727%29%20reported%20a%20similar%20visual%20regression%20on%20this%20same%20popover%20%28transparent%20background%29%2C%20which%20was%20traced%20to%20the%20Ant%20Design%20token%20theme%20migration%20in%20PR%20%2334732.%20The%20blue%20outline%20you%27re%20experiencing%20could%20stem%20from%20the%20same%20migration.%0A%0AThe%20relevant%20files%20to%20investigate%20are%3A%0A-%20%60superset-frontend/src/dashboard/components/FiltersBadge/DetailsPanel/index.tsx%60%20-%20popover%20implementation%0A-%20%60superset-frontend/src/dashboard/components/FiltersBadge/Styles.tsx%60%20-%20styled%20components%0A%0AYou%20might%20be%20able%20to%20fix%20this%20by%20adding%20explicit%20focus/outline%20styles%20to%20the%20popover%27s%20overlay%20or%20content%20container.>
   >  [image: Join Discord]
   > <https://go.dosu.dev/discord-bot?utm_source=github&utm_medium=bot-comment&utm_campaign=github-assistant&utm_content=join-discord>
   >  [image: Share on X]
   > <https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/apache/superset/issues/38789>
   >
   > —
   > Reply to this email directly, view it on GitHub
   > <https://github.com/apache/superset/issues/38789?email_source=notifications&email_token=B72HASJVTUGM4AXP5XVKC2T4R7BAHA5CNFSNUABFM5UWIORPF5TWS5BNNB2WEL2JONZXKZKDN5WW2ZLOOQXTIMJQGU4TSNBZGUYKM4TFMFZW63VKON2WE43DOJUWEZLEUVSXMZLOOSWGM33PORSXEX3DNRUWG2Y#issuecomment-4105994950>,
   > or unsubscribe
   > <https://github.com/notifications/unsubscribe-auth/B72HASNPJVBOUPNJB3W7ED34R7BAHAVCNFSM6AAAAACW2UBZP2VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHM2DCMBVHE4TIOJVGA>
   > .
   > You are receiving this because you are subscribed to this thread.Message
   > ID: ***@***.***>
   >
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org