Ionic-framework: Ionic RC5: after Toast is closed the popover stop to work.

[marcusvbp]

Ionic version: (check one with "x")
[ ] 1.x
[x] 2.x

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
Hi, after I updated my project to RC5, the popover works as expected. But after the app show a Toast message, the popover component don't open anymore (all popovers has this bug).

I make a video of this issue: https://www.youtube.com/watch?v=qU04pLt4sxg

[manucorporat]

I can't reproduce it, I wonder if some of your code is causing this issue because toast + popover is working for me.

[marcusvbp]

Hi, thank you for your reply.

Later I will post the code here (I am on mobile phone)

[marcusvbp]

Hello,

I put the relevant code here: https://bitbucket.org/snippets/marcusvbp/jpBjq

Thanks.

[Chris1234567899]

Similar issue here, Happens to me after keyboard was opened. I think this might as well be your issue (the keyboard - not the toast) as the screen size changes.

Turns out the popover is actually opened but it is misplaced and outside of the device screen, so not visible.

[vzharkov]

i have the same issue. If some keyboard was showed once, popovers does not shows (have wrong size and position).

[vzharkov]

it is a serious bug. popover does not work any more in RC5.

[vzharkov]

I think, this issue is a duplicate of the https://github.com/driftyco/ionic/issues/10014 issue

[marcusvbp]

that's right, it's related to keyboard, not the Toast Component.

[pwespi]

A temporary fix that worked for me is in the project folder in node_modules\ionic-angular\components\popover\popover-transitions.js to replace this.plt.width() with window.innerWidth and this.plt.height() with window.innerHeight (they appear twice). Then run ionic run android --prod again.

[jgw96]

Hello everyone! I am going to close this issue as a duplicate of https://github.com/driftyco/ionic/issues/9727 for now. The underlying bug with measuring orientation and the height and width of the viewport are discussed there and are currently being fixed. Thanks!

[Chris1234567899]

A temporary workaround that helped me, is setting the popover position to absolute and define it.
Like this: add css class to popover

let popover = this.popoverCtrl.create(ReportPopover,{data:this.data},{cssClass:"report-list"}); popover.present();

and in the css write something like:

.report-list{ .popover-content{ width:80%; padding:5px; margin:auto!important; position:absolute; top:10%!important; } }

You have to write it in the popover-content class which overwrites the original. And don't pass in the event in present() as this seems to be an issue as well.

That does not solve the bug but at least you can continue working meanwhile...

[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.