Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Bug]: Extra Arrow is Visible in Tabs Component on resize #16484

Open
preetibansalui opened this issue May 16, 2024 · 1 comment
Open

[Bug]: Extra Arrow is Visible in Tabs Component on resize #16484

preetibansalui opened this issue May 16, 2024 · 1 comment
Assignees
@preetibansalui
Labels
component: tabs role: dev 🤖 severity: 2 User cannot complete task, and/or no workaround type: bug 🐛

Comments

@preetibansalui
Copy link
Contributor

preetibansalui commented May 16, 2024 •
edited by tay1orjones

Package

@carbon/react

Browser

Chrome, safari, firefox

Package version

V11.57.0

React version

No response

Description

An extra arrow is visible in Tabs component on window resize.

Screen.Recording.2024-05-16.at.6.25.09.PM.mov

Additionally there is a second related bug [1, 2] where

There is an unnecessary left arrow (nav button) that is appearing when you click on the last item of the tabs. This appears only in firefox browser.
This is reproducible in the carbon storybook playground. https://react.carbondesignsystem.com/?path=/story/components-tabs--playground

Screen.Recording.2024-05-16.at.5.00.43.PM.mov

Reproduction/example

Both are reproducible in storybook

Steps to reproduce

Resize the Tabs window to a small size so that it should display an arrow for the tabs. Now resize the window to original size, Tab will not disappear.
@preetibansalui preetibansalui added type: bug 🐛 component: tabs severity: 3 User can complete task, and/or has a workaround labels May 16, 2024
@alisonjoseph alisonjoseph added severity: 2 User cannot complete task, and/or no workaround role: dev 🤖 and removed severity: 3 User can complete task, and/or has a workaround status: needs triage 🕵️‍♀️ labels May 16, 2024
@preetibansalui preetibansalui self-assigned this May 22, 2024
@alisonjoseph
Copy link
Member

Possibly related issue reported in slack.https://ibm-studios.slack.com/archives/C2K6RFJ1G/p1717057488338139

https://stackblitz.com/edit/github-aryg3b-bah5mt?file=src%2Findex.scss,src%2FApp.jsx&preset=node=

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@preetibansalui preetibansalui

Labels
component: tabs role: dev 🤖 severity: 2 User cannot complete task, and/or no workaround type: bug 🐛
Projects
Design System
Status: ⏱ Backlog
Milestone
No milestone
Development

No branches or pull requests
2 participants
@alisonjoseph @preetibansalui