bug: IonRipple is no longer working v6.0.15 and later (regression)

[Nikkolas-Cage]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

doesnt show ripple on div i tried it in different os and tried uninstalling cli and the whole npm the ripple effect stopped working

Expected Behavior

show ripple

Steps to Reproduce

A plain div with a bounded ripple effect

  <button className="ion-activatable ripple-parent">
    A button with a bounded ripple effect
    <IonRippleEffect></IonRippleEffect>
  </button>

  <div className="ion-activatable ripple-parent">
    A plain div with an unbounded ripple effect
    <IonRippleEffect type="unbounded"></IonRippleEffect>
  </div>

  <button className="ion-activatable ripple-parent">
    A button with an unbounded ripple effect
    <IonRippleEffect type="unbounded"></IonRippleEffect>
  </button>
</IonContent>

Code Reproduction URL

No response

Ionic Info

Ionic:

Ionic CLI : 6.19.0 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 6.0.16

Capacitor:

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

Utility:

cordova-res : 0.15.4
native-run : 1.5.0

System:

NodeJS : v16.14.0 (/usr/local/bin/node)
npm : 8.3.1
OS : macOS Big Sur

Additional Information

No response

[Nikkolas-Cage]

After reviewing
ion-ripple-effect is not working #17477 issue
it stopped working again in this version

[SSimbah]

Even in angular it is not working

[ZaDarkSide]

I can confirm.
Affected versions are 6.0.15 - 6.0.16 last known working version is 6.0.14

[Nikkolas-Cage]

I can confirm.
Affected versions are 6.0.15 - 6.0.16 last known working version is 6.0.14

I agree, the last known version working was below 6.0.15 however it seems that even when i rollback, ion ripple is still not working i also tried vue and angular versions yesterday and it wont work, it seems that the issue is in the ionripple itself.

[robholden]

I can also confirm it's not working for me on 6.0.16, and also cannot revert it back.

For me it's also broken on the ionic framework docs site for both v5 & v6:

• v5: https://ionicframework.com/docs/v5/api/button
• v6: https://ionicframework.com/docs/api/button

[stewones]

tried everything since reverting to 6.0.0-rc.1 to running the core project locally. nothing works. there must be something really crazy going on .

Screen.Recording.2022-04-11.at.16.29.13.mov

[stewones]

alright got a workaround

"@ionic/angular": "6.0.14",
"@ionic/core": "6.0.14",

thx to @danielprrazevedo

[Nikkolas-Cage]

alright got a workaround

"@ionic/angular": "6.0.14",
"@ionic/core": "6.0.14",

thx to @danielprrazevedo

How do i make this work in ionic react

[danielprrazevedo]

@Nikkolas-Cage

For now, just try to downgrade core and react packages manually

npm install @ionic/core@6.0.14 @ionic/react@6.0.14

[Nikkolas-Cage]

@Nikkolas-Cage

For now, just try to downgrade core and react packages manually

npm install @ionic/core@6.0.14 @ionic/react@6.0.14

Great 😃👍 thanks for the immediate solution! i hope the issue will be fixed soon .