bug: element of previous page still has focus (iOS only)

[eLyrin]

Prerequisites

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

Ionic Framework Version

v7.x

Current Behavior

iOS only: After routing to another page the keyboard is still open. debugging document.activeElement reveals that the ion-searchbar of the previous page still has focus:

safari in general does not seem to update the activeElement when setting display: none. What's weird to me is that in our old Ionic 5 app the bug did not happen after routing. The activeElement was correctly updated there (just like in chrome).

Did you perhaps change the focus explicitly in Ionic 5 and now rely on the browser? That would explain the difference.

Expected Behavior

if ion-router-outlet keeps the previous page alive inside the DOM, it should lose the focus.

Steps to Reproduce

1. focus the input
2. click on link
3. input of previous page still has focus

@Component({
  standalone: true,
  template: `
    <h2>focus input. then click link</h2>
    <input>
    <a routerLink="/page2">next page</a>
  `,
  imports: [RouterLink]
})
class Page1 { }

@Component({
  standalone: true,
  template: `<h2>input still has focus</h2>`
})
class Page2 { }

const routes: Routes = [
  {
    path: 'page1',
    component: Page1
  },
  {
    path: 'page2',
    component: Page2
  }
]

Code Reproduction URL

No response

Ionic Info

Ionic:

Ionic CLI : 7.1.1 Ionic Framework : @ionic/angular 7.5.0 @angular-devkit/build-angular : 16.2.10 @angular-devkit/schematics : 16.2.1 @angular/cli : 16.2.1 @ionic/angular-toolkit : 9.0.0

Capacitor:

Capacitor CLI : 4.8.1 @capacitor/android : 4.8.1 @capacitor/core : 4.8.1 @capacitor/ios : 4.8.1

Cordova:

Cordova CLI : not installed Cordova Platforms : not available Cordova Plugins : not available

Utility:

cordova-res : not installed globally native-run (update available: 2.0.0) : 1.7.4

System:

ios-sim : 8.0.2 NodeJS : v18.18.2 (/Users/entwicklerinnosoft/.nvm/versions/node/v18.18.2/bin/node) npm : 9.8.1 OS : macOS Monterey Xcode : Xcode 14.2 Build version 14C18

Additional Information

No response

[ionitron-bot[bot]]

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

[eLyrin]

found the root cause which has nothing to do with ionic. Sorry for the disturbance.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.