Javascript to no longer work

[joyboy67]

Solidus Version:
3.2.0

Current behavior

First case)

To click on the cross don't remove the item

Second case)

The check box cheched ("Use Billing Address") at the checkout process adress don't hide the form and force to fill it (and the input for State is gone)

It worked fine before but not now, I think it started not working since I created a user or that I have settled the default locale on french ?

Desktop (please complete the following information):

• Rails Version : 7.0.3.1
• OS: OpenBSD 7.1 x64
• Browser: Firefox 100
• Ruby Version: 3.1.2

[jarednorman]

Please use this troubleshooting board if you are having issues and need help. We can open bug tickets once we've confirmed this is actually an issue with Solidus.

• What have you tried when debugging this?
• What's the network inspector showing? Is the JavaScript being requested at all?
• What's the console show? Are there JavaScript errors?

[jarednorman]

I'm asking about requests for JavaScript and the JavaScript console in your browser.

[joyboy67]

In the Firefox JS console :

Uncaught ReferenceError: Spree is not defined
    <anonymous> http://localhost:3000/assets/spree/frontend/solidus_starter_frontend-712b968179a499bc7b6137c5d9c80c5bcc408d45369d36180296cbcfe0272a2b.js:758

Uncaught ReferenceError: Solidus is not defined
    <anonymous> http://localhost:3000/cart:53

[joyboy67]

In the Firefox debug console

http://localhost:3000/assets/spree/frontend/solidus_starter_frontend-712b968179a499bc7b6137c5d9c80c5bcc408d45369d36180296cbcfe0272a2b.js

SolidusPaypalBraintree = {
  APPLE_PAY_API_VERSION: 1,

  config: {
    paths: {
      clientTokens: Spree.pathFor('solidus_paypal_braintree/client_token'),
      transactions: Spree.pathFor('solidus_paypal_braintree/transactions')
    },

    // Override to provide your own error messages.
    braintreeErrorHandle: function(braintreeError) {
      BraintreeError.getErrorFromSlug(braintreeError.code);
      SolidusPaypalBraintree.showError(error);
    },

    classes: {
      hostedForm: function() {
        return SolidusPaypalBraintree.HostedForm;
      },

      client: function() {
        return SolidusPaypalBraintree.Client;
      },

      paypalButton: function() {
        return SolidusPaypalBraintree.PaypalButton;
      },

      paypalMessaging: function() {
        return SolidusPaypalBraintree.PaypalMessaging;
      },

      applepayButton: function() {
        return SolidusPaypalBraintree.ApplepayButton;
      },

      venmoButton: function() {
        return SolidusPaypalBraintree.VenmoButton;
      }
    }
  },

The line 758 for the ReferenceError: Spree is not defined is clientTokens: Spree.pathFor('solidus_paypal_braintree/client_token'),

[jarednorman]

I asked three questions, but I've only really go an answer to one of them so far.

What have you tried when debugging this?

I'm looking for some context to help narrow this issue down.

What's the network inspector showing? Is the JavaScript being requested at all?

You told me about the page requests, but I want to know what JavaScript is being requested by the page and what requests are succeeding/failing.

What's the console show? Are there JavaScript errors?

The errors you posted suggest that the main JavaScript file, usually called application.js, isn't being loaded, but other assets (like the Solidus Braintree JavaScript) are. Normally the application.js is what defines the Spree global and powers the form that's not working for you.

I hope this is helpful.

[joyboy67]

What have you tried when debugging this?

Nothing, just trying to understand the Solidus's architecture and looking for the javascript files

It's a fresh installation. I just made a few changes (set default locale to french, create a new user and add solidus_braintree_paypal gem)

What's the network inspector showing? Is the JavaScript being requested at all?

The JS requests for /cart and /checkout

GET http://localhost:3000/assets/spree/frontend/solidus_starter_frontend-712b968179a499bc7b6137c5d9c80c5bcc408d45369d36180296cbcfe0272a2b.js | State = 200 | Transfer = Caching

The errors you posted suggest that the main JavaScript file, usually called application.js, isn't being loaded, but other assets (like the Solidus Braintree JavaScript) are. Normally the application.js is what defines the Spree global and powers the form that's not working for you. I hope this is helpful.

Ok, I understand a little better, it's helpful thank you. But I don't understand why the application.js isn't loaded

[joyboy67]

I just created a new instance of Solidus with the flag --skip-javascript and solidus_starter_frontend, the javascript work perfectly

I observe compared to my other instance (the one where javascript does not work) than there's no app/javascript, vendor/javascript, config/importmap.rb, the app/views/layout/application.html.erb not contain the helper<%= javascript_importmap_tags %>,

and the solidus_starter_frontend.js loaded contain the objects Spree and Solidus

https://github.com/joyboy67/debug/blob/main/assets/spree/frontend/solidus_starter_frontend-9df7ccc2d214759b32f7c4a1e61409eea9987ec376ebc7ee14fa137d611e4c69.js

EDIT:

The Javascript start to stop working after installation of the gem solidus_stripe

EDIT 2:

I added //= require jquery3 to vendor/assets/javascripts/spree/frontend/all.js now it's working