Элемент полосы не загружается на iOS, только Safari

Question

У меня возникают проблемы с загрузкой элемента pay-with-stripe btn на iOS мобильном устройстве. Он отлично работает на настольных компьютерах (и при просмотре в адаптивном режиме), а также в Brave на мобильных устройствах.

Я проверил журналы консоли при запуске симулятора iOS и увидел, что https://js.stripe.com/v3/ загружен. Код:

<h3 class="pmbx__title">Payment Information</h3>
<div ref="card" class="stripe-box"></div>
<div v-if="stripeError !== ''">{{ stripeError }}</div>
<button @click.stop.prevent="onOrder" class='pay-with-stripe btn' :disabled='!loadedStripe || disablePaying'>Pay £{{calPrice(totalPrice)}}</button>

В компоненте vue:

const url = 'https://js.stripe.com/v3/';
if (process.client) {
    if (stripeLoadStart) {
            this.loadedStripe = true;
        return;
    }
    let domElement = document.createElement('script')
    domElement.setAttribute('src', url)
    domElement.onload = () => {
        this.loadedStripe = true
        this.stripe = Stripe(this.stripeKey)
        const elements = this.stripe.elements()
        this.card = elements.create('card')
        this.card.mount(this.$refs.card)
        this.card.addEventListener('change', ({
            error
        }) => {
            this.stripeError = error ? error.message : '';
            console.log(this.stripeError)
        })
    }
    document.body.appendChild(domElement)
    stripeLoadStart = true;
}

Любая помощь приветствуется.