Weird question mark in url when I change page using this.router.navigateByUrl or this.router.navigate

Question

Using Angular 12 I'm trying to do a simple navigation using this.router.navigateByUrl or this.router.navigate. I don't know why but in one case, after the navigation, a question mark comes up at the end of the url and it fires the refresh of the page.

Here the button that fires the method on template .html

<ng-template #topbarActions>
      <button mat-icon-button color="accent" grid-topbar-action (click)="addNewProductConversion()"
        [matTooltip]="'create' | translate">
        <mat-icon svgIcon="plus-box-outline" style="transform: scale(1.25);"></mat-icon>
      </button>
</ng-template>

Here the method with the navigateByUrl in it .ts

addNewProductConversion(): void {
  this.router.navigateByUrl(`/product/conversion/add/${this.productId}`);
}

Here the routing.module.ts

{ path: 'conversion/add/:id', component: ProductConversionEditComponent }

The navigation move to the right page, but the question mark comes up during a second and refresh the page. After a second question mark disappears