bug: ion-popover keyboardClose not working

Bug Report

Ionic version: [x] 5.1

Current behavior: When presenting a popover through code using the prop keyboardClose: false, when the popover is presented the keyboard closes anyways. This didn’t happen in Ionic 5.0.7 .

Expected behavior: The presentation of the popover should not hide the keyboard

Steps to reproduce: Modal presented inside with an inputChange from a text area. When the condition to present the popover is met, create a popover, the keyboard should not be hidden and the content of the popover changes dynamically through a service.

Related code: This is how I create the popover.

 this.suggestionPopover = await this.popoverController.create({
          component: SuggestionPopoverComponent,
          componentProps: {
            mode
          },
          event,
          translucent: true,
          showBackdrop: false,
          keyboardClose: false
        });

The complete function:

async inputTextArea(event) {
    let mode = '';
    let splitted = this.postComment.split('#');
    if (splitted[splitted.length - 1].includes(' ') || splitted.length === 1) {
      splitted = this.postComment.split('@');
      if (splitted[splitted.length - 1].includes(' ') || splitted.length === 1) {
        mode = '';
      } else {
        mode = 'user';
      }
    } else {
      mode = 'hashtag';
    }

    if (mode === '') {
      if (this.suggestionPopover) {
        await this.suggestionPopover.dismiss();
        this.suggestionPopover = null;
      }
      return;
    } else {
      if (!this.suggestionPopover) {
        this.suggestionPopover = await this.popoverController.create({
          component: SuggestionPopoverComponent,
          componentProps: {
            mode
          },
          event,
          translucent: true,
          showBackdrop: false,
          keyboardClose: false
        });
        if (mode === 'hashtag') {
          this.suggestionPopover.onDidDismiss().then((suggestionSelected) => {
            if (suggestionSelected.data.hashtag) {
              // tslint:disable-next-line:no-shadowed-variable
              const splitted = this.postComment.split('#');
              let comment = '';
              splitted[splitted.length - 1] = suggestionSelected.data.hashtag;
              this.hashtags.push(suggestionSelected.data);

              for (let i = 0; i < splitted.length; i++ ) {
                if (i !== 0) {
                  comment = comment + '#';
                }
                comment = comment + splitted[i];
              }

              this.postComment = comment;
              this.modelTextarea.setFocus();
            }
          });
        } else if (mode === 'user') {
          this.suggestionPopover.onDidDismiss().then((suggestionSelected) => {
            if (suggestionSelected.data.username) {
              // tslint:disable-next-line:no-shadowed-variable
              const splitted = this.postComment.split('@');
              let comment = '';
              splitted[splitted.length - 1] = suggestionSelected.data.username;
              this.tags.push(suggestionSelected.data);

              for (let i = 0; i < splitted.length; i++ ) {
                if (i !== 0) {
                  comment = comment + '@';
                }
                comment = comment + splitted[i];
              }

              this.postComment = comment;
              this.modelTextarea.setFocus();
            }
          });
        }
      }

      if (mode === 'hashtag') {
        const subs  = this.hashtagsService.findhasthagInDB(splitted[splitted.length - 1]).subscribe(values => {
          this.hashtagsService.hashtagSuggestions = values;
          subs.unsubscribe();
        }, error => {
          // TODO: Catch error
        });
      } else if (mode === 'user') {
        const subs  = this.userService.searchUser(splitted[splitted.length - 1]).subscribe(values => {
          this.userService.usersSuggestions = values;
          subs.unsubscribe ();
        }, error => {
          // TODO: Catch error
        });
      }

      await this.suggestionPopover.present();
    }
  }

The popover component:

import {Component, Input, OnInit} from '@angular/core';
import {HashtagsService} from '@services/hashtags.service';
import {PopoverController} from '@ionic/angular';
import {UserService} from '@services/user.service';

@Component({
  selector: 'app-suggestion-popover',
  templateUrl: './suggestion-popover.component.html',
  styleUrls: ['./suggestion-popover.component.scss'],
})
export class SuggestionPopoverComponent implements OnInit {
  @Input() mode: string;

  constructor(public hashtagsService: HashtagsService, private popoverController: PopoverController, public userService: UserService) { }

  ngOnInit() {}

  selectHashtag(hashtag: any) {
    this.popoverController.dismiss(hashtag);
  }

  selectUser(user: any) {
    this.popoverController.dismiss(user);
  }

}

Other information:

I uploaded a zip file with two videos, the code is exactly the same, just changing the version of ionic to 5.0.7 and the property works, in 5.1.0 the keyboard is hidden no matter the keyboardClose value.

Ionic info:

nic:

   Ionic CLI                     : 6.8.0 (/usr/local/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.1.0
   @angular-devkit/build-angular : 0.901.4
   @angular-devkit/schematics    : 9.1.4
   @angular/cli                  : 9.1.4
   @ionic/angular-toolkit        : 2.2.0

Capacitor:

   Capacitor CLI   : 2.1.0
   @capacitor/core : 2.1.0

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0, ios 5.1.1
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 25 other plugins)

Utility:

   cordova-res                          : not installed
   native-run (update available: 1.0.0) : 0.3.0

System:

   ios-deploy : 1.9.4
   ios-sim    : 8.0.2
   NodeJS     : v12.16.1 (/usr/local/Cellar/node@12/12.16.1/bin/node)
   npm        : 6.13.4
   OS         : macOS Catalina
   Xcode      : Xcode 11.4.1 Build version 11E503a

[videos.zip](https://github.com/ionic-team/ionic/files/4595501/videos.zip)

[ikerllorens]

Thanks @liamdebeasi ! I confirm it works on iOS and Android as intended. Is this safe to use in production use? Or is there an ETA for this version? Its to know to rollback to 5.0.7 or use this version in the meanwhile.

[liamdebeasi]

Thanks for the issue. Can you try the following dev build and let me know if it resolves the issue?

npm i @ionic/[e-mail]62023