[v4-beta.15] Toast middle = top

[peterpeterparker]

Bug Report

Ionic Info

Ionic v4-beta.15

Describe the Bug
It looks like the toast "middle" is actually displayed at the top.

Steps to Reproduce

1. Go to documentation https://beta.ionicframework.com/docs/api/toast
2. Click on 'Show toast middle'

P.S.: I observe the same behavior with my app

Expected Behavior
Toast middle = middle of the screen

Additional Context
Not sure but it might happens since beta.15 only

[brandyscarney]

Thank you for the issue! I am able to reproduce this.

Note to team: I had to downgrade to beta.11 in order to see toast working properly. The style for top is not being applied from here:

const topPosition = Math.floor(
  baseEl.clientHeight / 2 - wrapperEle.clientHeight / 2
);
wrapperEle.style.top = `${topPosition}px`;
wrapperAnimation.fromTo('opacity', 0.01, 1);

This is because baseEl is being read in as a shadow root. cc @manucorporat

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