https://solidus.io logo
Join Slack
Powered by
Hi everyone I’m stuck at “checkout/confirm”. I’ve...
# support
s
Hi everyone I’m stuck at “checkout/confirm”. I’ve made a payment test following the guidelines (https://stripe.com/docs/testing), but the payment_type is said to be nil. As a matter of fact, the payment form doesn’t have the payment_method(e.g. “card” or “google pay” like here https://stripe.com/docs/payments/payment-element).
Copy code
<%
  stripe_payment_method= payment.source.stripe_payment_method
  # <https://stripe.com/docs/api/payment_methods/object#payment_method_object-type>
  partial_base = "checkouts/existing_payment/stripe"
  payment_type = stripe_payment_method.type

  # Fallback on the default partial if a specialized partial is not available.
  payment_type = 'default' if lookup_context.find_all("#{partial_base}/_#{payment_type}").none?
%>

<%= render(
  "#{partial_base}/#{payment_type}",
  stripe_payment_method: stripe_payment_method,
  partial_base: partial_base,
  payment_type: payment_type
) %>

<% if current_order&.confirm? %>
  <% stripe_intent =
    SolidusStripe::PaymentIntent.prepare_for_payment(payment).stripe_intent %>

  <input
    type="hidden"
    data-controller="solidus-stripe-confirm"
    data-solidus-stripe-confirm-publishable-key-value="<%= payment.payment_method.preferred_publishable_key %>"
    data-solidus-stripe-confirm-client-secret-value="<%= stripe_intent.client_secret %>"
    data-solidus-stripe-confirm-return-url-value="<%= solidus_stripe.after_confirmation_url(payment.payment_method.slug) %>"
    data-solidus-stripe-confirm-error-base-url-value="<%= solidus_stripe.after_confirmation_url(payment.payment_method.slug, payment_intent: stripe_intent.id) %>"
    data-action="submit@window->solidus-stripe-confirm#confirm"
  >
<% end %>
Thank you !
k
Does this help?
s
Hello Kenny, I’m back ! 🙂 Hope you’re doing good ! I just read your link and couldn’t solve the problem. I try stripe in test mode with 424242442424242 so that visa is selected (we can see it on the stripe form), but the stripe payment method remains nil. I don’t get it
k
seems like you don’t have a stripe payment method configured in admin?
s
Yes I do !
Sorry my website is in french
k
This is how the 
stripe_payment_method
variable is defined. In your case it is 
nil
, that’s the reason of the failure. I would investigate if there’s something wrong with that specific payment or payment source.
does it happen at every order or just one?
s
at every order
> payment
Copy code
=> #<Spree::Payment id: 22, amount: 0.1e1, order_id: 14, source_type: "SolidusStripe::PaymentSource", source_id: 13, payment_method_id: 16, state: "processing", response_code: nil, avs_response: nil, created_at: "2023-07-18 14:01:59.069126000 +0000", updated_at: "2023-07-18 14:02:03.752910000 +0000", number: "QQ9FXZ9X", cvv_response_code: nil, cvv_response_message: nil>
> payment.source
Copy code
=> #<SolidusStripe::PaymentSource id: 13, payment_method_id: 16, stripe_payment_method_id: "", created_at: "2023-07-18 14:01:59.066251000 +0000", updated_at: "2023-07-18 14:01:59.066251000 +0000">
k
stripe_payment_method_id
is nil
that’s the issue
s
I figured out
But I have no idea how to solve this issue
k
that field is set by JS during checkout in your payment form. can you check you page and see if there is a value there before submitting the form?
s
payment.source.js:34 Uncaught TypeError: Cannot read properties of null (reading ‘style’) at HTMLInputElement.<anonymous> (payment.source.js341) at payment.source.js411
in payment.js
Copy code
const selectors = document.querySelectorAll('input[type="radio"][name="order[payments_attributes][][payment_method_id]"]');
    selectors.forEach(selector => {
      selector.addEventListener('click', () => {
        const controls = document.querySelectorAll('.payment-method-controls li');
        controls.forEach(control => control.style.display = 'block');

        if (selector.checked) {
          const selectedControl = document.querySelector(`#payment_method_${selector.value}`);
          selectedControl.style.display = 'block';
        }
      });
    });
k
where does this file come from?
s
app/javascript/checkout/payment.js
app/assets/javascript/checkout/payment.js
sorry
k
did you create it or comes from Solidus?
ah got it, you are using stripe with an old version of the Solidus Starter Frontend.
you need to apply these changes to your version to have it working: https://github.com/solidusio/solidus_starter_frontend/pull/321/files
s
ok I ll try this and come back to you
thank you !
Well, I’ve made all the changes.Still isn’t working
I’ve copy pasted everything following the payment cleanup file
OK it works now but on production, my console tells me it fails to load the solidus_stripe controller for payment and confirmation
k
which error?
s
404
k
are the instance variables with stripe credentials set in that env?
s
yes
k
you should check the actual error in the logs
s
well there is a problem with the path leading to the stimulus controller.
I especially have a problem right here:
Copy code
import { Application } from "@hotwired/stimulus"
// // // Configure Stimulus development experience
// // application.debug = false
// // window.Stimulus  = application

// // import { definitionsFromContext } from "stimulus/webpack-helpers";
import SolidusStripePaymentController from "./solidus_stripe_payment_controller";
import SolidusStripeConfirmController from "./solidus_stripe_confirm_controller";


// const application = Application.start();
// // const context = require.context("controllers", true, /.js$/);
// // application.load(definitionsFromContext(context));
const application = Application.start();
// // Load SolidusStripePayment controller
application.register("solidus-stripe-payment", SolidusStripePaymentController);
application.register("solidus-stripe-confirm", SolidusStripeConfirmController);

// // Define the import map
// const importmap = {
//     imports: {
//       // Define your JavaScript dependencies here
//       // For example:
//       // 'package-name': '/path/to/package-file.js',
//     },
//   };
  
// apply(importmap);
export {application}
it’s weird because it seems to load the stimulus solidus stripe controllers from the assets..Normally its in app/javascript/controllers
Open in Slack
PreviousNext
Powered by