Payment-method icon

MobilePay Web Component

Add MobilePay to an existing Web Components integration.

On this page, you can find additional configuration for adding MobilePay to your Components integration.

Before you begin

This page assumes you have already:

API reference

Select which endpoint you're integrating:

This is the default with Components v5.0.0 or later.

Parameter name Required Description
telephoneNumber If you already have your shopper's phone number, send it in the request so they no longer have to provide this later when they're redirected to MobilePay.

For a full list of optional fields that you can send for all payment methods, see /sessions.

Component configuration

Step 1: Create a DOM element

Create a DOM element on your checkout page, placing it where you want the payment method form to be rendered:

 <div id="mobilepay-container"></div>

Step 2: Create an instance of the Component

Use the create method of your AdyenCheckout instance, in this case checkout, to create the Component:

const mobilePayComponent = checkout.create('mobilepay').mount('#mobilepay-container');

Test and go live

Test MobilePay payments

Once you've set up your payment form to show MobilePay and completed your payment method integration, you can test the payment flow.

We recommend that you do a penny test using a live MobilePay account in your live Customer Area, as this is the fastest way to test your integration. If that is not possible, you can use the MobilePay test app.

Live penny test (recommended)

  1. Make sure you have access to a live MobilePay account that is coupled with a Visa, Mastercard, or Dankort account, and a valid phone number.
  2. Submit a request for MobilePay in your live Customer Area.
  3. After MobilePay is added to your Customer Area, make a payment for a minimal amount choosing MobilePay as the payment method.
  4. Check the status of the test payment in your live Customer Area > Transactions > Payments.

MobilePay test app

The MobilePay test app uses shared login credentials.

If you use the MobilePay test app, consider the following:

  • The test phone numbers are shared so all test transaction details will be visible to others. Do not include sensitive data when you make test payments.
  • If you're having issues with a test phone number, try a different number or reach out to developer@mobilepay.dk for help with the test app.
  • Only use the test app login details provided by MobilePay. For example, if you use the wrong PIN, you could block other test app users.
  • You can only use the Mastercard and Visa test cards provided in the test app. You cannot add other test cards. To test other cards, do a live penny test.
  1. Add the MobilePay payment method in your Customer Area.

  2. Download and install the MobilePay test app. Follow the instructions on the MobilePay website under the header Test app.

  3. Log in to the test app using the information provided by MobilePay. You can use one of the following phone numbers:
    Denmark:

    • +4538352308
    • +4522100649

    Finland:

    • +35827259316
    • +35859275251
    • +35837459538
    • +35881044146
  4. You can test different payment statuses with codes to test authorization using additional data.

  5. Check the status of MobilePay test payments in your Customer Area > Transactions > Payments.

Go live

Before you can accept live MobilePay payments, you need to submit a request for MobilePay in your live Customer Area.

See also