Bugs primer/react

[hardihardi]

Description

Here are some of the recent bugs reported in the primer/react repository:

1. Button: Spinner displays twice when count property is set and loading is true

   • Description: When the Button component's loading property is set to true and the count property is also provided, the spinner icon is displayed twice on the button.
   • Created: 1 day ago
   • Link: #5600

2. UnderlineNav items collapse into more menu when wrapped with a flex

   • Description: When UnderlineNav is placed into a flex container, items are collapsed into the menu even though there is enough space.
   • Created: 23 February 2024
   • Link: #4297

3. Sub-component pattern causes an error when used in React Server Components

   • Description: When using a component that has a sub-component pattern, like PageLayout, it cannot be used in a React Server Component due to a module error.
   • Created: 07 March 2024
   • Link: #4368

4. Dialog V2 does not work when stacked over Overlays or other components using useOnClickOutside

   • Description: The new draft Dialog component does not use useOnClickOutside, causing issues when stacked over Overlay or similar components.
   • Created: 03 February 2023
   • Link: #2857

5. Stack does not properly forward ref

   • Description: Stack appears to accept a ref prop based on the TypeScript types, but this ref is not actually bound to the underlying element.
   • Created: 43 days ago
   • Link: #5446

6. ActionMenu.Anchor should only accept button

   • Description: ActionMenu.Anchor can be used incorrectly, leading to inaccessible HTML and focus issues.
   • Created: 35 days ago
   • Link: #5477

7. SelectPanel bug when we have a static items list inside the same component

   • Description: SelectPanel works buggy when we have a static items list inside the same component.
   • Created: 10 July 2024
   • Link: #4732

8. AutoComplete when nested in a dialog can run into z-index/dom ordering issues

   • Description: When an AutoComplete is nested in a dialog, it can run into z-index or DOM ordering issues where the input is behind the dialog/modal.
   • Created: 07 March 2023
   • Link: #2995

9. SelectPanel inside Dialog v2 footer incorrectly chooses its anchor side on opening

   • Description: SelectPanel inside the Dialog V2 footer does not correctly pick the direction to open in, leading to the panel opening off the page downwards.
   • Created: 08 November 2023
   • Link: #3919

10. Tooltip is misplaced when it is rendered on a dialog

    • Description: When using Dialog 2, if the first interactive item that receives focus uses Tooltip, the tooltip appears misplaced.
    • Created: 11 July 2024
    • Link: #4734

Steps to reproduce

1. Environment Setup:

   • Operating System: Specify the OS and its version (e.g., Windows 10, macOS Monterey, Ubuntu 20.04).
   • Software Version: Specify the version of the software where the issue occurs (e.g., v1.2.3).
   • Dependencies: List any relevant dependencies or libraries and their versions (e.g., Node.js v14.17.0, Python 3.9.6).

2. Preconditions:

   • Describe any preconditions that must be met before starting the reproduction steps (e.g., "User must be logged in," "A specific feature must be enabled").

3. Steps to Reproduce:

   • Provide a step-by-step list of actions to take to reproduce the issue.
     1. Step 1: Open the application and navigate to the login page.
     2. Step 2: Enter a valid username and password and click the "Login" button.
     3. Step 3: Navigate to the "Profile" section from the main menu.
     4. Step 4: Click the "Edit Profile" button.
     5. Step 5: Change the "Email" field to an invalid email address and click "Save."

4. Expected Result:

   • Describe what you expect to happen after performing the reproduction steps (e.g., "The application should display a validation error message for the email field").

5. Actual Result:

   • Describe what actually happens when the reproduction steps are followed (e.g., "The application accepts the invalid email address and displays a success message").

6. Additional Information:

   • Include any additional information that might be relevant, such as screenshots, error logs, or network requests.

Version

v35.2.0

Browser

No response

[joshblack]

Hi there! 👋 Going to close this issue out since it seems like what it's referencing all have issues already created 👍