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

(Firefox) Unexpected horizontal scroll in shell panel after selecting combobox item and resizing panel or window #5786

Closed
mpayson opened this issue Nov 18, 2022 · 7 comments
Closed

(Firefox) Unexpected horizontal scroll in shell panel after selecting combobox item and resizing panel or window #5786

mpayson opened this issue Nov 18, 2022 · 7 comments
Assignees
@geospatialem @DitwanP
Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Online Issues logged by ArcGIS Online team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. estimate - 3 A day or two of work, likely requires updates to tests. floating ui Issues related to floating UI has workaround Issues have a workaround available in the meantime. p - low Issue is non core or affecting less that 10% of people using the library regression Issues that are caused by changes in a release, but were working before that.
Milestone
2024-11-26 - 3.0....

Comments

@mpayson
Copy link

mpayson commented Nov 18, 2022

Actual Behavior

Selecting a combobox item within a calcite shell panel then resizing that panel leads to an unexpected scroll bar that allows the user to scroll past the panel content. This only happens in Firefox. I've been able to reproduce when the user resizes the panel itself or the window (which causes the panel to resize). The scroll bar disappears when the combobox is re-opened.

Expected Behavior

No horizontal scroll bar

Reproduction Sample

https://codepen.io/mpayson/pen/YzvEJpj

Reproduction Steps

  1. Open the code pen in Firefox
  2. Make a combobox selection
  3. Drag to shrink the panel
  4. Verify the panel can now be horizontally scrolled
  5. Make another combobox selection
  6. Verify the panel can no longer be scrolled

Reproduction Version

beta.98

Relevant Info

Firefox 107.0 on Mac. Reproducible with both calcite-panel and calcite-flow-item

Screen Shot 2022-11-18 at 4 14 36 PM

Regression?

beta.97

Impact

No response

Esri team

ArcGIS Online
@mpayson mpayson added 0 - new New issues that need assignment. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. needs triage Planning workflow - pending design/dev review. labels Nov 18, 2022
@github-actions github-actions bot added the ArcGIS Online Issues logged by ArcGIS Online team members. label Nov 18, 2022
@mpayson mpayson changed the title (Firefox) Unexpected horizontal scroll in shell panel after selecting combobox item and resizing panel (Firefox) Unexpected horizontal scroll in shell panel after selecting combobox item and resizing panel or window Nov 18, 2022
@driskull
Copy link
Member

The proper way to reproduce this is to...

  1. Drag the panel to largest width.
  2. Open the combobox.
  3. Drag the panel to smallest width.
  4. Notice the scrollbar.
  5. Open the combobox.
  6. Notice the scrollbar is gone.

It seems the combobox floating-ui element is keeping its size when its no longer open and taking up horizontal space.

@geospatialem geospatialem added the regression Issues that are caused by changes in a release, but were working before that. label Feb 28, 2023
@geospatialem geospatialem added research Issues that require more in-depth research or multiple team members to resolve or make decision. 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Feb 28, 2023
@geospatialem
Copy link
Member

Research to be conducted in March to determine next steps for a fix.

@geospatialem geospatialem added the floating ui Issues related to floating UI label Feb 28, 2023
@jcfranco
Copy link
Member

Findings:

  • combobox setting min-width on the menu causes a scrollbar to appear on FF – unsetting it when closed would fix the issue.
  • dropdown shares similar logic/styling to combobox and also has the same issue – applying the same fix as combobox helps, but we would also need to tweak the width set on the content node without looking weird during transition (combobox closes immediately w/o a transition).
  • as a workaround, overlay-positioning="fixed" can be set on the combobox or dropdown

@geospatialem geospatialem added the has workaround Issues have a workaround available in the meantime. label Mar 21, 2023
@brittneytewks brittneytewks added p - low Issue is non core or affecting less that 10% of people using the library estimate - 3 A day or two of work, likely requires updates to tests. labels Mar 21, 2023
@geospatialem
Copy link
Member

Reallocated to the April release milestone. Note the above workaround in the meantime.

@geospatialem geospatialem removed the research Issues that require more in-depth research or multiple team members to resolve or make decision. label Jul 24, 2023
@jcfranco
Copy link
Member

This is fixed on next (see updated codepen). I suspect #10240 fixed it! 🎉

@jcfranco jcfranco added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Nov 13, 2024
@github-actions github-actions bot assigned geospatialem and DitwanP and unassigned jcfranco Nov 13, 2024
@github-actions GitHub Actions
Copy link
Contributor

Installed and assigned for verification.

@geospatialem geospatialem added 4 - verified Issues that have been released and confirmed resolved. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Nov 13, 2024
@geospatialem
Copy link
Member

Verified in 3.0.0-next.2 with Firefox Version 128.4.0esr 🎉

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

@geospatialem geospatialem

@DitwanP DitwanP

Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Online Issues logged by ArcGIS Online team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. estimate - 3 A day or two of work, likely requires updates to tests. floating ui Issues related to floating UI has workaround Issues have a workaround available in the meantime. p - low Issue is non core or affecting less that 10% of people using the library regression Issues that are caused by changes in a release, but were working before that.
Projects
None yet
Milestone
2024-11-26 - 3.0.0 Nov Breaking Chang...
Development

No branches or pull requests
7 participants
@jcfranco @driskull @alisonailea @geospatialem @mpayson @DitwanP @brittneytewks