ionic-framework: bug: ionRefresh emits object typed as RefresherEventDetail but actually emits RefresherCustomEvent

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
• v7.x
• Nightly

Current Behavior

The tsx to ion-refresher specifies it emits RefresherEventDetails: @Event() ionRefresh!: EventEmitter<RefresherEventDetail>;

this exposes the complete method to the user to complete the refreshing.

So this would mean something like this needs to work:

(pseudo code) on:ionRefresh={refresher} where refresher would be like function refresher(ev:RefresherEventDetails) {.. ev.complete() }

This code complies to typings, but will give a runtime error as the correct way is ev.target.complete().

But that that will give a typings error in the IDE.

Changing to function refresher(ev: RefresherCustomEvent) {.. ev.target.complete() } will fix this, but gives IDE errors because of type mismatch.

The workaround is to remove typings or use any keyword.

Notably the docs state that you must use complete() where the code example say target.complete(). So if you take things very literally, it could become confusing and error prone.

(meaning you need to bind to the ion-refresher component and then call its complete() method)

(take the event object and call ev.target.complete().

So possibly a documentation improvement (happy to do PR) but maybe a code fix in refresher.tsx?

Expected Behavior

No runtime issue when calling ev.complete() or no typings error when using type on the ionRefresh event.

Steps to Reproduce

See above

Code Reproduction URL

None available - the code examples on ion-refresher have the issue

Ionic Info

Occurs in angular project: Ionic:

Ionic CLI : 6.20.6 (C:\Users\xxxx\AppData\Roaming\npm\node_modules@ionic\cli) Ionic Framework : @ionic/angular 6.5.2 @angular-devkit/build-angular : 15.1.4 @angular-devkit/schematics : 15.1.4 @angular/cli : 15.1.4 @ionic/angular-toolkit : 6.1.0

Capacitor:

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

Utility:

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

System:

NodeJS : v16.14.2 (C:\Program Files\nodejs\node.exe) npm : 8.10.0 OS : Windows 10

And also ionic svelte (no ionic info)

Additional Information

https://discordapp.com/channels/520266681499779082/1049388501629681675/1072243939635122187

https://github.com/ionic-team/ionic-framework/issues/20221