I'm using an outside JS library built with Webpack and Babel. The library is self-contained and only adds a single global variable.

When this library is loaded onto a product page, the hover-over and select functionality of Magento's configurable swatches breaks.

On hover, colors/sizes still dynamically show stock. But when hovering or clicking the swatches, the following error is logged:

(Chrome) Uncaught TypeError: Cannot read property 'apply' of undefined   prototype.js:936

(Firefox) TypeError: value[method] is undefined   prototype.js:936:7

This traces to skin/frontend/rwd/default/js/configurableswatches/swatches-product.js:676:40 which is the following:

el.select('span span').invoke('update', Translator.translate(this._E.cartBtn.txt[index]));

When I try to then add the product to cart, I get messages saying "Please select a size", etc.

Is there a known problem with Prototype and Babel or Webpack that would cause this?

  • I am having this same problem 63.
    – Chris
    Apr 10 '17 at 15:41

This is not an answer, just an additional comment because the system won't let me add a comment.

I am also having a similar we want to use the Amasty Pre Order extension, and when it is enabled it throws the same errors.


We eventually determined a way to deal with this.

Here's a thread about this issue in the Babel GitHub. Based on that thread, our solution was to upgrade Magento's bundled PrototypeJS to 1.7.3, which should be a non-breaking patch. We've seen success with this multiple times.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.