Some Users Unable to Save Settings Due to Console Error Related to APMs

[csmcneill]

Describe the bug

Some WooCommerce Payments merchants are unable to save their settings at Payments > Settings. When they attempt to, they see an Error Saving Settings pop-up, and the following error appears in console:

{
  "code": "rest_invalid_param",
  "message": "Invalid parameter(s): enabled_payment_method_ids",
  "data": {
    "status": 400,
    "params": {
      "enabled_payment_method_ids": "enabled_payment_method_ids[1] is not one of card, bancontact, eps, giropay, ideal, sofort, sepa_debit, and p24."
    },
    "details": {
      "enabled_payment_method_ids": {
        "code": "rest_not_in_enum",
        "message": "enabled_payment_method_ids[1] is not one of card, bancontact, eps, giropay, ideal, sofort, sepa_debit, and p24.",
        "data": null
      }
    }
  }
}

Only merchants utilizing UPE are affected.

To Reproduce

We've been unable to reproduce this so far.

Workaround

Disabling UPE and re-enabling again fixes the issue.

Additional context

Affected merchants so far:

• 5607423-zen
• 5607722-zen
• 5608298-zen
• 5608374-zen

[johndcoy]

5606978-zen

Unlike the workaround above, this user had UPE disabled. I've asked them to enable and disable it to see if that helps.

[anant1811]

5608374-zen

Update: the workaround worked for the customer in this one.

[RadoslavGeorgiev]

I tried reproducing this myself, but couldn't. I'll keep the issue in triage state, and every clue would be useful in the meantime.

The AJAX call to save the settings could be very useful. If there is a tech-savvy user, or you get access to the admin, please (ask them to) do the following:

1. Open dev tools (Command + Option + I on Mac)
2. Go to the network tab
3. Clear it
4. Try saving the settings
5. Copy the request as cURL, and share it.

Here is how the request would look like: https://d.pr/i/goMlcr

[kalessil]

I was able to reproduce it, it's related to Stripe Link:

Key steps:

• enable Stripe Link while UPE is enabled
• disable UPE
• refresh the settings page and try saving them

[kalessil]

@dpaun1985 can you look into it, please?

[kalessil]

It might be related to the fact that this fallback is used for available payment methods when UPE is disabled (it's the only card in the fallback).

And this is relevant to other payment methods:

[dpaun1985]

It's not really link related. I don't have much experience with UPE. Perhaps, can someone else handle this ?

[thisissandip]

Another one: 37293230-hc

The workaround worked for this customer.

[rossviviano]

Another one - 5615729-zen

[solstudioim]

Same one: 5615379-zd-woothemes

[kaushikasomaiya]

5642371-zen, shared workaround.

[nicdwilson]

5643953-zen

[kaushikasomaiya]

5645691-zen

[maxlaf]

5673133-zen

[nicdwilson]

5675573-zen, disabling UPE and re-enabling worked

[kaushikasomaiya]

5687271-zen (Workaround worked.) 5701591-zen (Workaround worked.) 5703065-zen (Shared workaround.)

[ericfri]

5710627-zen

[jaxr]

5720149-zen - shared workaround

[namiokuzono]

5722358-zen

[WillBrubaker]

5725783-zen

[kaushikasomaiya]

5732931-zen - Shared workaround.

[ericfri]

5736858-zen

[paulostp]

5727445-zen

[fashuvo]

So far, I am unable to reproduce the issue by following these steps described above. @RadoslavGeorgiev and @achyuthajoy were unable to reproduce this as well.

Currently, I am checking with @csmcneill to check if any of the HE's were able to replicate the issue.

[csmcneill]

No HEs have been able to reproduce the issue yet AFAIK. Asked for assistance in p1669698401852279-slack-C3NCP7ZJ6

[csmcneill]

I can only slightly reproduce this issue, but it may or may not be related.

Steps:

1. Create a new WCPay account located outside of the US.
2. Install version 4.7.2 of WCPay.
3. Activate UPE.
4. Activate Stripe Link.
5. Update to 4.8.0 or later (non-US accounts cannot enable Stripe Link in 4.8.0+)
6. Try to save WCPay settings.

The error on the front-end is similar, but the console error is different:

POST https://example.com/wp-json/wc/v3/payments/settings?_locale=user 400

In this instance, disabling UPE and re-enabling it resolves the issue.

[CGA8C]

5749030-zd

[maxlaf]

@csmcneill I was able to replicate this with 1 minor adjustment to your steps:

3. Activate UPE. Select 1 alternative payment method to enable it. 3a. Deactivate the APM that was just enabled.
4. Activate Stripe Link

All other steps were the same.

Error was thrown:

I'm not sure if the adjustment I made is actually necessary to replicate this. It may play a role, because if no other APMs are enabled, then Link is in index [1] in the enabled_payment_method_ids array. But, the POST request you saw also threw a 400, which may have had the same error?

[shaunkuschel]

5772228-zen

[nicdwilson]

5697395-zen

[AashikP]

Another report in 5778646-zen. Issue was fixed once they deactivated and then re-enabled early payments.

[rossviviano]

Another one in 38164990-hc

[rashedripon]

5797927-zen suggested the workaround.

[namiokuzono]

5799922-zen

AT site: I have tried the workaround, but the workaround did not work on this case. There seems to be bigger issue to this one but cannot identify what is going on currently (their account is restricted and do not receive 2FA etc). In other words, this case may be experiencing the same symptoms of this very issue, but it could be that the issue is separate from this very GH issue.

cURL copied and pasted below:

curl 'https://[redacted].org/wp-json/wc/v3/payments/settings?_locale=user' -X POST -H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:108.0) Gecko/20100101 Firefox/108.0' -H 'Accept: application/json, */*;q=0.1' -H 'Accept-Language: en-US,en;q=0.5' -H 'Accept-Encoding: gzip, deflate, br' -H 'Referer: https://pachamamart.org/wp-admin/admin.php?page=wc-settings&tab=checkout&section=woocommerce_payments' -H 'X-WP-Nonce: e9c7245cd7' -H 'Content-Type: application/json' -H 'Origin: https://pachamamart.org' -H 'Connection: keep-alive' -H 'Cookie: wordpress_test_cookie=WP%20Cookie%20check; _wpcomsh_support_session_detected=true; wordpress_logged_in_287c31e2e7a129c5f3eda2917c96e199=pachamamart%7C1671400873%7CP4GK9lhcoWOaqGjjLUCeLRbtZmEGBG38X6uDIkLXTI1%7C6a94314463a1867d8cbd3f08b9e2e27851ce037a8d745fa9bf28438b6e76509d; tk_ai=woo%3AXASsM4mj%2Bi9SBoaLJmOUiNHS; wp-settings-81943860=libraryContent%3Dbrowse%26post_dfw%3Doff%26hidetb%3D1%26imgsize%3Dfull%26align%3Dcenter%26urlbutton%3Dpost%26posts_list_mode%3Dlist%26editor%3Dtinymce%26advImgDetails%3Dshow%26editor_plain_text_paste_warning%3D1%26mfold%3Do; wp-settings-time-81943860=1671397274; tk_qs=; __ssid=9743a082473b99d2374fa2465bf5957; __stripe_mid=f97a8e5f-f76f-461f-a5d4-0d8bd2c3f05a956af2; __stripe_sid=af30992a-a247-4177-adcb-fdbf7a576f3750624f' -H 'Sec-Fetch-Dest: empty' -H 'Sec-Fetch-Mode: cors' -H 'Sec-Fetch-Site: same-origin' -H 'TE: trailers' --data-raw '{"enabled_payment_method_ids":["card"],"available_payment_method_ids":["card"],"payment_method_statuses":{"acss_debit_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"affirm_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"afterpay_clearpay_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"bancontact_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"card_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"eps_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"giropay_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"ideal_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"klarna":{"status":"unrequested","requirements":["legal_entity.type"]},"link_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"p24_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"sepa_debit_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"sofort_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.dob.day","representative.dob.month","representative.dob.year","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]},"tax_reporting_us_1099_k":{"status":"unrequested","requirements":[]},"tax_reporting_us_1099_misc":{"status":"unrequested","requirements":[]},"transfers":{"status":"unrequested","requirements":["business_type","tos_acceptance.date","tos_acceptance.ip"]},"us_bank_account_ach_payments":{"status":"unrequested","requirements":["business_profile.mcc","business_type","representative.first_name","representative.last_name","tos_acceptance.date","tos_acceptance.ip"]}},"is_wcpay_enabled":true,"is_manual_capture_enabled":false,"is_test_mode_enabled":false,"is_dev_mode_enabled":false,"is_multi_currency_enabled":true,"is_client_secret_encryption_enabled":false,"is_wcpay_subscriptions_enabled":true,"is_wcpay_subscriptions_eligible":true,"is_subscriptions_plugin_active":false,"account_statement_descriptor":"PACHAMAMART.ORG","account_business_name":"PachaMamArt","account_business_url":"https://pachamamart.org","account_business_support_address":[],"account_business_support_email":"","account_business_support_phone":"","account_branding_logo":"","account_branding_icon":"","account_branding_primary_color":"","account_branding_secondary_color":"","is_payment_request_enabled":true,"is_debug_log_enabled":true,"payment_request_enabled_locations":["product","cart","checkout"],"payment_request_button_size":"default","payment_request_button_type":"buy","payment_request_button_theme":"dark","is_saved_cards_enabled":true,"is_card_present_eligible":true,"is_platform_checkout_enabled":false,"platform_checkout_custom_message":"","platform_checkout_store_logo":"","platform_checkout_enabled_locations":[],"platform_checkout_button_size":"default","platform_checkout_button_type":"default","platform_checkout_button_theme":"dark","deposit_schedule_interval":"daily","deposit_schedule_monthly_anchor":null,"deposit_schedule_weekly_anchor":"","deposit_delay_days":2,"deposit_status":"disabled","deposit_completed_waiting_period":false}'

UPDATE — Got clarification that this specific case probably belongs to the other issue here: https://github.com/Automattic/woocommerce-payments/issues/5275

[nawaz0705]

Another report in 5821339-zen

[WillBrubaker]

23671870-hc

[csmcneill]

@fashuvo What is the status on this issue? I know that it was initially planned to be resolved in 5.1.0, but we haven't seen any progress since @maxlaf and I did some digging into how to reproduce.

@deepakpathania This issue was assigned to Foysal prior to the split of some teams. Should this be assigned to a different engineer, or would this issue still fall under Harmony's scope?

[nagpai]

I used my local development setup for WC Pay client and was able to reliably reproduce the issue with these steps:

1. Make sure your site is connected to a US account and it has Link enabled within Payments > Setttings > Express Checkouts
2. Switch the site to a UK based account ( I have not yet tried with other countries. Chose UK since I saw most cases involving UK users ) . - Update: able to replicate with a Netherlands account too.
3. Browse to WCPay Dev plugin settings and clear account cache.
4. Browse to Payments > Settings. Notice that Link does not show up.
5. Try clicking save ( either with or without changes )
6. You will notice Error saving settings.

I will take a deeper look tomorrow to check what is happening.

cc @kalessil

[csmcneill]

Updated the title (again) to try to create some more clarity. Some HEs were confusing #5275 with this issue.

[nagpai]

Some notes as I dig deeper:

On replicating the issue as per the steps in my earlier, comment, I took a closer look at the request payload, within the Network tab of the browser inspector. I noticed that link appeared as a method in enabled_payment_method_ids whereas, it was not visible in available_payment_method_ids , hence we see the error - enabled_payment_method_ids[1] is not one of card, bancontact, eps, giropay, ideal, sofort, sepa_debit, and p24.

Here is my screenshot ( similar to what @nicdwilson and @kalessil shared )

Ideally, we shouldn't be seeing link within enabled_payment_method_ids for a non-us merchant. In my simulated case, i forced it by having a US account with link enabled before switching to UK account. The Link method continued to haunt, and resulted in the same error when we try to save the settings.

For real non-US merchants though, how is it that we are seeing link enabled? The clue lies in a recent issue where Link method was seen enabled for non-US merchants. Context :

• paJDYF-6BT-p2 - specifically - paJDYF-6BT-p2#comment-15429
• Related issue

• There was a fix issued that took care to hide Link for customers of non-us merchants in checkout.

  However, if non-us merchants enabled Link during the time it was unintentionally available, and did not change it before it was removed - They would continue to have link within enabled_payment_method_ids thereby seeing this error. It gets cleared if the UPE methods are disabled and enabled.

From what I see and understand, the issue will not happen with new accounts, or those that already had Link disabled.

[kalessil]

@nagpai, thanks for looking into it. In a nutshell, we have a faulty/corrupted state in the enabled payment methods option.

I drafted a potential fix as a starting point for you, please push it forward further. You might come up with better ideas, don't hesitate to bring them into a discussion.

[ryanr14]

Via 5855210-zen we've tried to disable UPE but get a new error.

Image link: https://d.pr/i/J1by2x

Image link: https://d.pr/i/rWF4P1

Within the settings it says, There was an error rendering this view. Please contact support for assistance if the problem persists. TypeError: e.filter is not a function

In my console this is the complete error.

    at Qu (settings.js?ver=5.2.1:2:264438)
    at ct (react-dom.min.js?ver=17.0.1:9:43430)
    at os (react-dom.min.js?ver=17.0.1:9:111136)
    at Ur (react-dom.min.js?ver=17.0.1:9:77643)
    at Ir (react-dom.min.js?ver=17.0.1:9:77571)
    at Dr (react-dom.min.js?ver=17.0.1:9:77434)
    at Pr (react-dom.min.js?ver=17.0.1:9:74429)
    at react-dom.min.js?ver=17.0.1:9:30173
    at unstable_runWithPriority (react.min.js?ver=17.0.1:9:7431)
    at xn (react-dom.min.js?ver=17.0.1:9:29950)```

[csmcneill]

@ryanr14 I think that this is a different issue.

[ryanr14]

Thanks @csmcneill , it could certainly be. In the ticket I've asked them to try a conflict test and update things just to be sure. I'll make a new issue if this keeps happening for them. I can't replicate.

[nagpai]

@ryanr14 - Very likely some plugin conflict, since I seem to see this error on their site, where both the invalid properties seem to be saved as simply Array instead of the actual array with values.

{
    "code": "rest_invalid_param",
    "message": "Invalid parameter(s): enabled_payment_method_ids, payment_request_enabled_locations",
    "data": {
        "status": 400,
        "params": {
            "enabled_payment_method_ids": "enabled_payment_method_ids[0] is not one of card, bancontact, eps, giropay, ideal, sofort, sepa_debit, p24, and link.",
            "payment_request_enabled_locations": "payment_request_enabled_locations[0] is not one of product, cart, and checkout."
        },
        "details": {
            "enabled_payment_method_ids": {
                "code": "rest_not_in_enum",
                "message": "enabled_payment_method_ids[0] is not one of card, bancontact, eps, giropay, ideal, sofort, sepa_debit, p24, and link.",
                "data": null
            },
            "payment_request_enabled_locations": {
                "code": "rest_not_in_enum",
                "message": "payment_request_enabled_locations[0] is not one of product, cart, and checkout.",
                "data": null
            }
        }
    }
}

[ryanr14]

Thanks for that @nagpai, could you teach me where you are seeing these two areas in the screenshots above? Just to be sure I understand. Thanks!

[nagpai]

Happy to share, @ryanr14 !

How I got the request payload screenshot. (the screenshot to the bottom of my last reply)

1. Open the browser inspector and keep the Network tab on

2. Click the save changes button and watch the events within Network tab. You may filter out only Fetch/XHR events

   

3. Click on the settings?_locale=user on the left side to check its details. ( or the event that shows in red font as failing )

4. Click the payload tab, and you will be able to see the request payload object

Normally, you should see an actual array content instead of just Array

For seeing the response error details

Click the Response tab to the right of the Payload tab within Network section of browser tools. You will find it there.

I hope this is helpful 👍

[nagpai]

@csmcneill PR is merged with trunk and should be available in the next release 🙌