Merge pull request #118 from degica/20240531-do-not-render-fields-if-…

…should-not Prevent rendering fields if should not; use hosted pages instead
degica · Jun 11, 2024 · f519433 · f519433
2 parents 754b41d + 8e276f7
commit f519433
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 18 deletions.
diff --git a/includes/class-wc-gateway-komoju-block.php b/includes/class-wc-gateway-komoju-block.php
@@ -68,6 +68,7 @@ public function get_payment_method_data()
             'session'        => json_encode($checkout_session),
             'paymentType'    => $this->gateway->payment_method['type_slug'],
             'locale'         => $this->gateway->locale,
+            'inlineFields'   => $this->gateway->has_fields,
         ];
     }
 }
diff --git a/includes/class-wc-gateway-komoju-single-slug.php b/includes/class-wc-gateway-komoju-single-slug.php
@@ -63,6 +63,14 @@ public function __construct($payment_method)
 
         parent::__construct();
 
+        // Gimmick -
+        // If fields should not be rendered honour user-defined descriptions only
+        // This prevents fields to be rendered if 1) the description of the corresponding payment method is empty, and either 2a) publishable key is unavailable or 2b) inline fields are opted out in payment method settings
+        // This counters a non-intuitive behaviour in WC (https://github.com/woocommerce/woocommerce/blob/5dd7713346786c5874615b34a1d56f81a29b673f/plugins/woocommerce/templates/checkout/payment-method.php#L28)
+        if (!$this->has_fields) {
+            $this->description = $this->get_option('description');
+        }
+
         $this->method_description = sprintf(
             __('%s payments powered by KOMOJU', 'komoju-woocommerce'),
             $this->default_title()

diff --git a/includes/js/komoju-checkout-blocks.js b/includes/js/komoju-checkout-blocks.js
@@ -5,16 +5,19 @@ const KomojuPaymentModule = (() => {
         let name = `${paymentMethod.id}`
         const settings = window.wc.wcSettings.getSetting(`${name}_data`, {});
 
-        const komojuFields = createElement('komoju-fields', {
-            'token': '',
-            'name': 'komoju_payment_token',
-            'komoju-api': settings.komojuApi,
-            'publishable-key': settings.publishableKey,
-            'session': settings.session,
-            'payment-type': settings.paymentType,
-            'locale': settings.locale,
-            style: { display: 'none' },
-        });
+        const komojuFields =
+            settings.inlineFields
+                ? createElement('komoju-fields', {
+                    'token': '',
+                    'name': 'komoju_payment_token',
+                    'komoju-api': settings.komojuApi,
+                    'publishable-key': settings.publishableKey,
+                    'session': settings.session,
+                    'payment-type': settings.paymentType,
+                    'locale': settings.locale,
+                    style: { display: 'none' },
+                })
+                : null;
 
         const label = createElement('div', {
             style: { display: 'block', alignItems: 'center', justifyContent: 'center', width: '100%' }
@@ -110,4 +113,4 @@ const KomojuPaymentModule = (() => {
     };
 })();
 
-KomojuPaymentModule.init();
+KomojuPaymentModule.init();
diff --git a/tests/cypress/e2e/admin.cy.js b/tests/cypress/e2e/admin.cy.js
@@ -14,13 +14,13 @@ describe('KOMOJU for WooCommerce: Admin', () => {
 
   it('lets me add and remove specialized payment gateways', () => {
     cy.setupKomoju(['konbini', 'credit_card']);
-    cy.contains('Payments').click();
+    cy.clickPaymentTab();
 
     cy.get('.form-table').should('include.text', 'Komoju - Konbini');
     cy.get('.form-table').should('include.text', 'Komoju - Credit Card');
 
     cy.setupKomoju(['paypay', 'linepay']);
-    cy.contains('Payments').click();
+    cy.clickPaymentTab();
 
     cy.get('.form-table').should('not.include.text', 'Komoju - Konbini');
     cy.get('.form-table').should('not.include.text', 'Komoju - Credit Card');

diff --git a/tests/cypress/e2e/checkout.cy.js b/tests/cypress/e2e/checkout.cy.js
@@ -10,7 +10,7 @@ describe('KOMOJU for WooCommerce: Checkout', () => {
 
   it('lets me make a payment using the specialized konbini gateway', () => {
     cy.setupKomoju(['konbini', 'credit_card']);
-    cy.contains('Payments').click();
+    cy.clickPaymentTab();
     cy.enablePaymentGateway('komoju_konbini');
     cy.goToStore();
     cy.addItemAndProceedToCheckout();
@@ -38,7 +38,7 @@ describe('KOMOJU for WooCommerce: Checkout', () => {
 
   it('lets me make a payment using the specialized credit card gateway', () => {
     cy.setupKomoju(['credit_card']);
-    cy.contains('Payments').click();
+    cy.clickPaymentTab();
     cy.enablePaymentGateway('komoju_credit_card');
     cy.contains('Save changes').click();
     cy.goToStore();
@@ -62,7 +62,7 @@ describe('KOMOJU for WooCommerce: Checkout', () => {
 
   it('lets me use the specialized WebMoney gateway, despite it being unsupported by Fields', () => {
     cy.setupKomoju(['credit_card', 'konbini', 'web_money']);
-    cy.contains('Payments').click();
+    cy.clickPaymentTab();
     cy.enablePaymentGateway('komoju_web_money');
     cy.contains('Save changes').click();
     cy.goToStore();
@@ -83,7 +83,7 @@ describe('KOMOJU for WooCommerce: Checkout', () => {
 
   it('lets me turn checkout icons on and off', () => {
     cy.setupKomoju(['konbini', 'credit_card']);
-    cy.contains('Payments').click();
+    cy.clickPaymentTab();
     cy.enablePaymentGateway('komoju_credit_card');
 
     cy.get('[data-gateway_id="komoju_credit_card"] a.button')

diff --git a/tests/cypress/support/commands.js b/tests/cypress/support/commands.js
@@ -204,4 +204,8 @@ Cypress.Commands.add('addItemAndProceedToCheckout', () => {
   cy.wait(100);
   cy.contains('Go to checkout').click();
   cy.wait(100);
-});
+});
+
+Cypress.Commands.add('clickPaymentTab', () => {
+  cy.visit('/wp-admin/admin.php?page=wc-settings&tab=checkout');
+});