Stripe Element: keyboard bug with iOS

@hudi wrote:

Stripe introduced a new way to collect credit cards information named Stripe Elements.
Roughly speaking, it consists on letting Stripe propose an UI for collecting credit cards.

For now, it works perfectly, except I found a very annoying bug, in iOS only:
When focusing the credit card number, a keyboard appears (seems to be the native one), then it is replaced by the ionic one 0,5 second after, as showed bellowed:

IMG_4841.PNG750x1334 67.7 KB

IMG_4842.PNG750x1334 66.4 KB

That would not be a problem usually.
But then, if I press “back” button, I go to the previous page but the keyboard stays! Even if I close the keyboard, it will reopen forever as soon as I go to a new page, or if I open the menu… my UI is broken.

I have the intuition there is a conflict between the ionic keyboard triggered on any input, and the native keyboard triggered by Stripe code.
But due to the nature of stripe Elements, I can’t control the content of the form, I only have pretty much this in the html code:

<form action="/charge" method="post" id="payment-form">
      <div class="form-row">
          <div id="card-element">
            <!-- a Stripe Element will be inserted here. -->
          </div>

      ....
</form>

Any idea how to try to debug this?
Do you think I could tell to Ionic not to trigger the keyboard?

Thanks a lot.
Notes : I’m using ionic-angular 3.7.1

Posts: 1

Participants: 1

Read full topic