Why do ion-refresher and ion-infinite-scroll cause a scroll to top?

I have an application in ionic 5, in the mnia page I have a list with an ion-refresher and an ion-infinite-scroll working simultaneously. After updating the list with the refresher, if I reach the bottom of it, an unexpected scroll to top is triggered. How can I remove this unwanted behavior are there mechanisms by which the two components conflict?

    <ion-header>
        <lea-page-header [detailPage]="false"></lea-page-header>
    </ion-header>
    
    <ion-content>
        <!-- Header con ricerca -->
        <div class="news-list-header">
            <ion-toolbar *isLogged>
                <ion-segment (ionChange)="changeTab($event)" value="all" mode="md">
                    <ion-segment-button value="all">{{ 'newsList.allSegment' | translate }}
                    </ion-segment-button>
                    <ion-segment-button value="favorites">{{ 'newsList.favorites' | translate }}
                    </ion-segment-button>
                    <hr>
                </ion-segment>
            </ion-toolbar>
            <ion-toolbar>
                <div class="filters">
                    <form [formGroup]="filtersForm">
                        <ion-searchbar name="searchValue"
                                       formControlName="searchValue"
                                       inputmode="search"
                                       mode="ios"
                                       placeholder="{{ 'newsList.search' | translate }}"
                                       (ionClear)="removeKeyboard()"
                                       (ionCancel)="removeKeyboard()"
                                       (keyup)="onKey($event)">
                        </ion-searchbar>
                    </form>
                    <div *isLogged class="filter-btn">
                        <button class="lea-btn btn-primary ion-activatable ripple-parent" (click)="presentFilterModal()">
                            <span>
                                <ion-icon name="options-outline"></ion-icon>
                            </span>
                            <ion-ripple-effect></ion-ripple-effect>
                        </button>
                        <ion-badge *ngIf="filtersForm.get('topics').value.length > 0">
                            {{ filtersForm.get('topics').value.length }}</ion-badge>
                    </div>
                </div>
            </ion-toolbar>
        </div>
        <ion-refresher slot="fixed"
                       (ionRefresh)="doRefresh($event)">
            <ion-refresher-content></ion-refresher-content>
        </ion-refresher>
        <!-- Se non ci sono news pubbliche -->
        <div class="ion-text-center ion-margin-top" *ngIf="noPublicNews && !news.length && !filtersForm.value.searchValue">
            <ion-chip>
                <ion-label>{{ 'newsList.noPublicNews' | translate }}</ion-label>
            </ion-chip>
        </div>
        <!-- Lista news -->
        <ion-list class="news-list"
                  *ngIf="(favourite ? newsFavourite : news).length && !isSearching"
                  lines="none">
            <ion-card *ngFor="let news1 of (favourite ? newsFavourite : news); index as i"
                      (click)="forward(news1)"
                      class="news lamboNews ion-activatable ripple-parent"
                      [ngClass]="{'top-news': news1.topNews, 'blue': news1?.codTopic?.includes('CORPORATE'), 'green': news1?.codTopic?.includes('PEOPLE')}">
                <div class="image" [style.background-image]="getSafeURL(news1.rollupURL)"></div>
                <ion-card-content>
                    <div *ngIf="news1.topNews" class="date ion-text-left">
                        {{ news1.publishDate | date: 'dd MMMM yyyy'}}
                    </div>
                    <ion-chip *ngIf="!news1.topNews"
                              [ngClass]="{'blue': news1?.codTopic?.includes('CORPORATE'), 'green': news1?.codTopic?.includes('PEOPLE')}">
                        <ion-label>{{ news1.topic }}</ion-label>
                    </ion-chip>
                    <div class="title ion-text-left">
                        {{ news1.title }}
                    </div>
                    <div>
    
                    </div>
                </ion-card-content>
                <ion-toolbar>
                    <ion-chip slot="start"
                              *ngIf="news1.topNews"
                              [ngClass]="{'blue': news1?.codTopic?.includes('CORPORATE'), 'green': news1?.codTopic?.includes('PEOPLE')}">
                        <ion-label>{{ news1.topic }}</ion-label>
                    </ion-chip>
                    <div slot="start" *ngIf="!news1.topNews" class="date">
                        {{ news1.publishDate | date: 'dd MMMM yyyy'}}
                    </div>
                    <ion-buttons slot="end" *isLogged>
                        <ion-button (click)="onSetFavourite(news1)">
                            <ion-icon *ngIf="news1.favourite" name="star"></ion-icon>
                            <ion-icon *ngIf="!news1.favourite" name="star-outline"></ion-icon>
                        </ion-button>
                    </ion-buttons>
                </ion-toolbar>
                <ion-ripple-effect></ion-ripple-effect>
            </ion-card>
        </ion-list>

        <!-- Infinite scroll -->
        <ion-infinite-scroll threshold="50px" (ionInfinite)="moreNews($event)">
            <ion-infinite-scroll-content
                    loadingSpinner="bubbles"
                    [loadingText]="'infiniteScroll.moreDaraLoading' | translate">
            </ion-infinite-scroll-content>
        </ion-infinite-scroll>
    </ion-content>
    <lea-toolbar-navigation></lea-toolbar-navigation>

Unsure about the specific logic here, but it looks like you are removing the List from DOM while searching? In this moment, i would believe, the infinite-scroll is at the bottom and got triggered. Why are you removing the list from DOM every time you refresh the page?

in reality the problem occurs only the first time after the ion-refresher is activated, in the following scrolls without activating the ion-refresher the scroll to topp is not triggered

from the tests this seems to me the function that causes the problem.
When news is re-evaluated there is an instant in which the template empties and I have no elements on the page.
Also to view the new list I have to force a detectionChange, otherwise for several seconds on the page I don’t see the updated list

moreNews(event?) {
    if (event) {
        event.target.complete();
    }
    if (this.isAuthenticated) {
        if (!this.favourite && this.news.length < this.newsCounter) {
            this.page++;
            this.getNews(this.favourite).pipe(
                map(news => news.filter((localNews: any) => !this.news.map(n => n.newsId).includes(localNews.newsId))),
                map(news => ([...this.news.concat(news)]))
            ).subscribe(data => {
                this.news = data;
                this.cd.detectChanges();
            });
        } else if (this.favourite && this.newsFavourite.length < this.newsFavouriteCounter) {
            this.pageFavourite++;
            this.getNews(this.favourite).subscribe(data => {
                this.setNews(data, this.favourite);
                this.cd.detectChanges();
            });
        } else {
            if (this.online) {
                this.getOldNews();
            } else {
                this.offlineChip = true;
                setTimeout(() => {
                    this.offlineChip = false;
                }, 3000);
            }
        }
    } else {
        if (this.online) {
            if (this.totalPublicNews === this.news.length) {
                this.noMorePublicNews = true;
            } else {
                this.getPublicNews(event);
            }
        } else {
            this.offlineChip = true;
        }
    }
}

the tests were carried out only in the case managed with rxjs, in the other cases I imagine that the problem is alo the same as the logics are the same but the source of the data changes