html class generation from payment processor type (machine) name (was "Display issues")

[yashodha]

There is a display issue with the payment processor selector for Credit Card payment.

The issue seems to be with the new version of CiviCRM that is adding a class "name of payment processor" in the code when there was only the class "crm-form-radio" before.
For Paypal, it's adding a class "payment_processor_paypal_standard" where all spaces in processor name have been replaced with underscoress, which is fine.
But for iATS 1st pay, the system is not adding underscores to the payment processor name when adding the class, which creates all these useless classes including the "card" class, when really it should be "payment_processor_iats_payments_1stpay_credit_card"

See attached files to compare

Older version

Latest version

[yashodha]

This results in display issues in Wordpress

I think this is because the name is spaced instead of underscored like others

[yashodha]

@adixon @KarinG thoughts?

[adixon]

Fascinating, and a new issue to me. What version(s) of civicrm/iats are you using here?

[yashodha]

@adixon

CiviCRM : 5.28.1
iATS : 1.7.4

[KarinG]

I'm seeing this with legacy and on CiviCRM 5.35.2 as well. It's not causing any problems on this site (Drupal).

[yashodha]

@KarinG This causes problems in wordpress not drupal.

[adixon]

I'm not convinced this is an iATS extension issue. Although all the examples you're listing have machine names that can just be used as a class, that's not part of the requirements/contract of the payment processor machine name.

If I'm correct, it's a wordpress-civicrm issue that it's not converting the names to be "class safe".

Happy to be corrected ...

[yashodha]

@adixon @KarinG

FYI : am seeing the css issue on D9 as well now. (culprit is same having card as class)

[adixon]

That doesn't seem like quite the same issue - but in any case, it's not extension specific right?

[philmb]

Just setting up iATS for the first time, and I confirm that this is an issue with Joomla, not just WP. Display on the site shows exactly like yashodha's image above where the radio button input is displayed above its label due to .card class display=block

Joomla! 3.9.24, Civi 5.39.0, iATS extension 1.7.4

[adixon]

Hey @philmb - I wonder if I need to be more clear? This issue is about the generation of html by civicrm (in combination with it's CMS). It appears that some of that html generation is making an assumption about the machine name of processors as "class safe", which is not correct. It shows up for IATS because iATS (unlike most core processors) has a space in it's machine name. It's not an iATS issue, or something that can even be corrected within the extension. I can leave this issue open for others, but there's nothing I can do to fix your issue within the extension code.

In order to fix it, please post (referring to this issue) in the civicrm-joomla issue queue, here:

https://lab.civicrm.org/dev/joomla/-/issues

[adixon]

I'm wrong! It's a CiviCRM Core issue from this commit:

civicrm/civicrm-core@1421b01

which was part of this PR

civicrm/civicrm-core#16595

Thanks for your persistence ...

[yashodha]

@adixon will you be filing a ticket for the same?

[adixon]

This was fixed in core a few weeks ago.

civicrm/civicrm-core#22760