La apasionante historia de «wc-stripe-payment-request-wrapper» ¡No imaginas lo que pasó al final!

Te cuento…

¡Bienvenido a la nave del misterio!

Recientemente un cliente me avisó que le salía una especie de error extraño en las páginas de todos sus productos creados con WooCommerce, una especie de separador «- O -» extraño antes del botón de añadir al carrito.

Algo así…

Pues bien, mirando el código fuente del elemento me salía esto:

O sea, que lo que se mostraba era un ID de CSS llamado wc-stripe-payment-request-wrapper que, por completo, vendría a ser esto:

<div id=”wc-stripe-payment-request-wrapper” style=”clear:both;padding-top:1.5em;”>
<p id=”wc-stripe-payment-request-button-separator” style=”margin-top: 1.5em; text-align: center;”>— OR —</p>

Que, casi seguro, estaba generado por algún tipo de sistema de petición de pago de la plataforma de pagos Stripe.

¡Google no me quiere!

Visto el problema y culpable googleé un rato a ver si encontraba la solución, pues nunca lo había visto antes, y me encontré que era una consulta que se había realizado varias veces en los foros de soporte, pero sin recibir solución por parte del soporte del plugin, que es nada menos que este, el que se recomienda instalar en WooCommerce, dicho sea de paso de los mismos creadores de WooCommerce:

Ante tal falta de respuesta, hablando con mi cliente, en un arrojo de valor, le dije algo como «Eso va a ser una pijada, un botón que se quiere mostrar y, como no se muestra por algún motivo, lanza el texto de error».

Para más INRI el error no se mostraba en todos los navegadores, solo en Chrome, pero claro, resulta que es el navegador más extendido. Vamos, que había que arreglarlo.

Pues nunca una solución a un problema tuvo un arreglo más sencillo. ¿O no?

La(s) solución(es) «inteligentes»

Lo primero que se me ocurrió fue ocultar el error por CSS, que claro, iba a funcionar sí o sí, pero eso, como puedes imaginar, no es una solución, es ocultar el problema, como emborracharse para tapar un desamor. El desamor sigue ahí aunque no te enteras por la cogorza que llevas, que te nubla la mente y la vista.

Así que la descarté.

Para los curiosos, habría sido algo así:

#wc-stripe-payment-request-wrapper { display : none; }

Luego me dije, bueno, como esto lo carga una acción del plugin Stripe Payments Gateway, pues la desactivo.

Así que, tras revisar los archivos del plugin encontré la acción que cargaba una nueva característica de la API de peticiones de pago de Stripe, y creé esta bonita función:

add_action( 'plugins_loaded', function() {
    if ( class_exists( 'WC_Stripe_Payment_Request' ) && is_callable( array( 'WC_Stripe_Payment_Request', 'instance' ) ) ) {
        remove_action( 'woocommerce_proceed_to_checkout', array( WC_Stripe_Payment_Request::instance(), 'display_payment_request_button_html' ), 1 );
        remove_action( 'woocommerce_proceed_to_checkout', array( WC_Stripe_Payment_Request::instance(), 'display_payment_request_button_separator_html' ), 2 );
    }
}, 11 );

¿Funcionaba? Pues sí, pero seguía sin estar satisfecho, aunque ahora al menos estaba de verdad quitando el error no cargando la acción, en vez de ocultar la visualización de la misma.

La solución «tonta»

Pero, satisfecho de mi mismo como estaba, y como última opción, me dije «Fernando, ¿por qué no miras a ver qué coño es eso de los botones de peticiones de pago?» (sí, cuando hablo solo me hablo en tercera persona, estoy fatal, lo reconozco).

Y como resulta que utilizo el plugin en montones de webs me fui a los ajustes de la pasarela de pago Stripe a ver si contaba algo al respecto.

Llegado a este punto tengo que contar que este plugin me lo he traducido yo solito casi entero, y en algún momento recordaba haber traducido algo al respecto, pero … ¡son tantos plugins los que traduzco!

Pues efectivamente, resulta que en los ajustes de Stripe, en concreto en WooCommerce > Ajustes > Pagos > Stripe, casi al final de todas las posibles configuraciones hay una casilla llamada «Activa los botones de petición de pago», esta…

Por cierto, se llega así:

Efectivamente, ahí está la casilla para activar la API de peticiones de pago de Stripe, una virguería, porque si está activa y el navegador es compatible, permite a los usuarios pagar desde plataformas como Apple Pay y Chrome Payment, ahí es nada.

Justo debajo, tras activarla, puedes incluso configurar el aspecto del botón.

Y sí, al activarla – si el navegador es compatible – se muestra el famoso botón en las páginas de producto, y también el famoso «– O –», que viene a ser un texto que te da la opción entre pagar de inmediato con las susodichas plataformas, o ir al pago normal de WooCommerce.

Oye, y que si tu navegador es compatible, y el usuario tiene un sistema de pagos activo, el sistema va de coña, funciona cojonudamente.

Pero, en cuando falla algo, lo que tienes es solamente el texto ese de «- O -», así de simple.

¿Cómo lo quito entonces si el navegador o lo que sea no es compatible?

Pues mira, tan sencillo como desactivar el botón, y te ahorras la función o el ocultado por CSS que te puse arriba. Desactivas la casilla, guardas los cambios y solucionado.

Lo importante de todo, al final, es que uses el método que prefieras, desaparezca ese feo texto sin sentido si no usas las peticiones de pago de Stripe.

¡Coño, haber empezado por ahí!

¿Por qué te he contado toda esta historia para terminar diciéndote que se arregla todo con un simple clic?

Pues por dos motivos, básicamente:

  1. Que veas lo raro que funciona mi mente, y cómo una simple cuestión me lleva a horas o días de investigación. Me pasa con los clientes, me pasa con los artículos del blog. Tardo algo más pero se aprende mucho por el camino.
  2. Para que te acostumbres a buscar siempre más de una solución a los problemas, sobre todo pensando en tus clientes. No quiero decir que te vuelvas tan flipado como yo, pero sí que indagues siempre un poco más allá de lo obvio o lo fácil. Será bueno para tu cliente y bueno para ti.

 

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(12 votos, promedio: 4.8)

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

6 comentarios en “La apasionante historia de «wc-stripe-payment-request-wrapper» ¡No imaginas lo que pasó al final!”

  1. Jesus Gonzalez

    Eso pasa por tener una mente retorcida, a mi me tambien me pasa y aa muchos, empezamos a buscar la más complicada solcicion a un problema, para al final darte cuenta que era una pijada.
    Creo que nos pasa a la mayoria que nos gusta esto.
    Sigue así Fernando nos ayuda tanto con tus conocimientos como apaciguando esos pensamientos de … ¿estare un poco loco?, hablo solo, ¿sere un bicho raro?, mira que gustarme esto.

  2. Gran aporte, nunca está de más ver todas las opciones posibles y determinar cual es la que más nos conviene.
    En mi caso solo lo visualizo en dispositivos y no logro inspeccionar el botón. ¿me podrías facilitar la función para deshabilitar el botón en las paginas de productos? es decir, desactivar pago en productos y conservarlo en carrito.

    Un saludo tocayo!

  3. Tomas Moya Rodriguez

    Pues yo vengo con otra propuesta.

    Puedes dejar activado esa característica de Stripe (por lo menos en el carrito la puede usar un cliente), y dejar desactivado en las páginas de productos con este filtro:

    add_filter( ‘wc_stripe_hide_payment_request_on_product_page’, ‘__return_true’ );

    Salu2!!!

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

 

Ir arriba Ir al contenido