ionic-framework icon indicating copy to clipboard operation
ionic-framework copied to clipboard

bug: IonAccordion closes when clicking on content

Open DavAnaton opened this issue 1 year ago • 0 comments

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

					<IonAccordionGroup value={accordion}>
						<IonAccordion value="first">
							<IonItem
								slot="header"
								color="light"
							>
								<IonLabel>First</IonLabel>
							</IonItem>
							<div slot="content">
								// ... Code with buttons
							</div>
						</IonAccordion>
						<IonAccordion value="second">
							<IonItem
								slot="header"
								color="light"
							>
								<IonLabel>Second</IonLabel>
							</IonItem>
							<div slot="content">
								// ... Code with buttons
							</div>
						</IonAccordion>
						// ... More accordions
					</IonAccordionGroup>

When opening one of them, and clicking on the button inside, it triggers the button's action, but it also closes the accordion. After deeper investigation, it looks like this only happens when the value passed in IonAccordionGroup.value is an empty string.

Expected Behavior

The empty string should be ignored, and the code should work the same way as when the value prop is not passed in.

Steps to Reproduce

  1. Use the code provided above.
  2. Set accordion to "".
  3. Open the

Code Reproduction URL

https://stackblitz.com/edit/bcdz4j?file=src%2Fmain.tsx

Ionic Info

[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module '@capacitor/ios/package.json'

   Require stack:
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/lib/project/index.js
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/lib/index.js
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/index.js
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/bin/ionic

[WARN] Error loading @capacitor/android package.json: Error: Cannot find module '@capacitor/android/package.json'

   Require stack:
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/lib/project/index.js
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/lib/index.js
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/index.js
   - /Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

Ionic CLI : 7.2.0 (/Users/davidanaton/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli) Ionic Framework : @ionic/react 8.3.2

Capacitor:

Capacitor CLI : 6.1.2 @capacitor/android : not installed @capacitor/core : 6.1.2 @capacitor/ios : not installed

Utility:

cordova-res : 0.15.4 native-run : 2.0.1

System:

NodeJS : v20.18.0 (/Users/username/.nvm/versions/node/v20.18.0/bin/node) npm : 10.9.0 OS : macOS Unknown

Additional Information

No response

DavAnaton avatar Oct 18 '24 13:10 DavAnaton