ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.14k stars 13.51k forks source link

bug: Opening and closing a modal breaks IonSplitPane #19259

Closed ebk46 closed 5 years ago

ebk46 commented 5 years ago

Bug Report

Ionic version: [x] 4.8.0 (ionic/react@4.8.0.rc-1)

Current behavior: When a modal is opened from a menu inside IonSplitPane, the IonSplitPane component breaks if you manipulate the window size. Essentially the content in the left pane seems to be offset by the width of the menu. Difficult to explain, so see the stackblitz below.

Expected behavior: The component should not break.

Steps to reproduce:

  1. Start a page in small size so the IonMenu is collapsed
  2. Open the left menu and click something it it to open a modal
  3. Close the IonModal and collapse the IonMenu
  4. Make the browser size larger so the IonMenu becomes visible
  5. You should now clearly see the bug in the IonMenu

Related code: https://stackblitz.com/edit/ionic-v4-react-splitpane-bug

Other information:

Ionic info:

Ionic:

   Ionic CLI       : 5.2.6 (/Users/evan/.config/yarn/global/node_modules/ionic)
   Ionic Framework : @ionic/react 4.8.0-rc.1

Capacitor:

   Capacitor CLI   : 1.1.1
   @capacitor/core : 1.1.1

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v12.6.0 (/usr/local/Cellar/node/12.6.0/bin/node)
   npm    : not installed
   OS     : macOS High Sierra
liamdebeasi commented 5 years ago

Thanks for the issue. This issue has been fixed and will be available in the next release of Ionic.

ionitron-bot[bot] commented 5 years ago

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.