Ion-list font size not working right on orientation change for iPhone

Bug Report

Ionic version:

[x] 4.x

Current behavior: I have 3 lists wrapped in swiper slides. On changing orientation from portrait to landscape font-size of ion-item in ion-list is increased. But on changing the orientation back to portrait still large font size is used.

Using swiper module https://github.com/nolimits4web/Swiper instead of ion-slide

Expected behavior: Font-size should come back to the right size on changing orientation.

Steps to reproduce:

Related code:

<div class="swiper-wrapper">
            <div class="swiper-slide imagery-swiper">
                  <ion-searchbar @ionInput="filterAvwx = $event.target.value"></ion-searchbar>
                  <ion-list>
                          <ion-item v-for="(tab, tabindex) in filteredItems" :key="tabindex" class="item-icon-right" v-on:click="selectTab(tab)" v-if="tab.t && (tab.c || tab.i)">
                              <ion-label>
                                  <span v-html="highlight(tab, filterAvwx)"></span>
                              </ion-label>
                              <ion-icon name="arrow-forward" slot="end" mode="ios" v-if="tab.c"></ion-icon>
                          </ion-item>
                      </ion-list>
            </div>
            <div class="swiper-slide  imagery-swiper">
                <ion-list>
                  <ion-item v-for="(subtabgroup, subtabgroupindex) in avwxServiceRef.selectedTab.c" :key="subtabgroupindex" v-show="subtabgroup.t" class="item-icon-right" v-on:click="selectSubtabGroup(subtabgroup)">
                            <ion-label>
                                <span v-html="highlight(subtabgroup, filterAvwx)"></span>
                            </ion-label>
                            <ion-icon name="arrow-forward" mode="ios" slot="end" v-if="subtabgroup.c"></ion-icon>
                        </ion-item>
                </ion-list>
            </div>
</div>

Other information: Maybe this is because I am wrapping ion-list inside swiper module, but why would using swiper div has any effect on font-size of ion-list.

1. Initially it looks ike this in landcape

2. On moving it to Portrait fontsize increases as desired.

3. Changing back to landscape.

Ionic info:

"@ionic/core": "4.0.0-rc.0",
		"@ionic/vue": "0.0.1",

[schontz]

StackOverflow to the rescue:

html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

[stripathix]

@manucorporat here is the sample app in which we can reproduce this issue. Go to preference page.

https://github.com/stripathix/ionic-vue

1. Initially it looks like this

2. On orientation change it font size changes

3. Again on orientation change font stays same as in (2)

*Note: This issue occurs only if you run app on device or simulator on browser this issue does not occur. So please run this in simulator iPhone 8. I am using capacitor for packaging.