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.

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

Setting overflow: auto without a media query to fix resizable pane bug. #2685

Merged
merged 9 commits into from
Dec 19, 2022

Conversation

radglob
Copy link
Contributor

@radglob radglob commented Dec 12, 2022

This basically reverts the work in #2606. Setting overflow: auto inside of a media query seemed to fix an issue where scrolling panes would be hard to use on mobile as you would have a scrolling container within another scrolling container. Changing this back to not use a media query seems to have the desired behavior without breaking resizable panes.

Closes #2684.

Screenshots

Please provide before/after screenshots for any visual changes

Merge checklist

  • Added/updated tests
  • Added/updated documentation
  • Tested in Chrome
  • Tested in Firefox
  • Tested in Safari
  • Tested in Edge

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

@changeset-bot
Copy link

changeset-bot bot commented Dec 12, 2022

🦋 Changeset detected

Latest commit: 26d2501

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/react Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions
Copy link
Contributor

github-actions bot commented Dec 12, 2022

size-limit report 📦

Path Size
dist/browser.esm.js 84.09 KB (+0.02% 🔺)
dist/browser.umd.js 84.74 KB (+0.02% 🔺)

@radglob radglob temporarily deployed to github-pages December 12, 2022 19:44 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 12, 2022 19:44 Inactive
@radglob radglob marked this pull request as ready for review December 12, 2022 19:45
@radglob radglob requested review from a team and langermank December 12, 2022 19:45
@radglob radglob temporarily deployed to github-pages December 12, 2022 19:51 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 12, 2022 19:51 Inactive
@mattcosta7
Copy link
Collaborator

mattcosta7 commented Dec 12, 2022

While we're here, can we add any tests to avoid regressing the resizable pane again in the future?

@radglob radglob temporarily deployed to github-pages December 12, 2022 20:06 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 12, 2022 20:07 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 13, 2022 15:15 Inactive
@radglob radglob temporarily deployed to github-pages December 13, 2022 15:20 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 13, 2022 15:20 Inactive
@radglob radglob force-pushed the bugfix/fix-splitpane-resizing branch from 1e1eb12 to a251e0e Compare December 13, 2022 15:30
@radglob radglob temporarily deployed to github-pages December 13, 2022 15:36 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 13, 2022 15:36 Inactive
Comment on lines +196 to +198
fireEvent.mouseDown(divider)
fireEvent.mouseMove(divider)
fireEvent.mouseUp(divider)
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't a perfect test. I'm not sure how to configure this to move the divider a specific amount. However, as is, this does change the --pane-width value. fireEvent.click doesn't do that, so I think this is testing what we want.

@radglob radglob temporarily deployed to github-pages December 13, 2022 18:27 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 13, 2022 18:28 Inactive
@radglob radglob temporarily deployed to github-pages December 19, 2022 15:04 — with GitHub Actions Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 19, 2022 15:05 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-2685 December 19, 2022 15:06 Inactive
@radglob radglob merged commit 3a8bb76 into main Dec 19, 2022
@radglob radglob deleted the bugfix/fix-splitpane-resizing branch December 19, 2022 16:45
@primer-css primer-css mentioned this pull request Dec 19, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

SplitPane resizing broken in 35.15.1
3 participants