Magento2: JS error on product page Cannot read property 'oldPrice' of undefined

[katesuykovskaya]

Preconditions

1. M 2.1.3

Steps to reproduce

1. Create conf. product on 2 swatch attributes (for ex. color and size) with assigned simple products
2. upload gallery to first simple product (will be needed to test gallery reload)
3. go to product page, click on 1st swatch

Expected result

1. gallery of first simple product should be loaded

Actual result

1. JS error
   Trace:
   swatch-renderer.js:694 Uncaught TypeError: Cannot read property 'oldPrice' of undefined
   at $.(anonymous function).(anonymous function)._UpdatePrice (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/Magento_Swatches/js/swatch-renderer.js:694:23)
   at $.(anonymous function).(anonymous function)._UpdatePrice (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/jquery/jquery-ui.js:402:25)
   at $.(anonymous function).(anonymous function)._OnClick (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/Magento_Swatches/js/swatch-renderer.js:532:25)
   at $.(anonymous function).(anonymous function)._OnClick (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/jquery/jquery-ui.js:402:25)
   at HTMLDivElement. (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/Magento_Swatches/js/swatch-renderer.js:482:32)
   at HTMLDivElement.dispatch (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/jquery.js:4624:9)
   at HTMLDivElement.elemData.handle (http://magento213.loc/pub/static/version1482569607/frontend/Magento/luma/en_US/jquery.js:4292:28)
   
2. Notes:
   2.1. if I click on next swatch (color), error is not occurred (in other words when all options/swatches are chosen)
   2.2. there was no such error on 2.1.2

[ashsmith]

I'm also getting this after upgrading a client from 2.1.2 to 2.1.3.

From playing around a light bit of debugging, I've found the following lines were introduced in 2.1.3, and is where the error comes from. result is undefined when these lines are executed.

if (result.oldPrice.amount !== result.finalPrice.amount) {
    $(this.options.slyOldPriceSelector).show();
} else {
    $(this.options.slyOldPriceSelector).hide();
}

Taking a look a what result is:

result = $widget.options.jsonConfig.optionPrices[_.findKey($widget.options.jsonConfig.index, options)];

Now, the reason why this returns undefined is because none of the options match $widget.options.jsonConfig.index. This is because (in my case) there was one option not yet selected. options looks like this: {187: undefined, 191: "1443"}. Whereas, it is expected for both items to have values.

My (current) solution, to get around this, is to override in the theme, and abort before code mentioned above is executed. Which looks like this:

if (!result) {
    return;
}

if (result.oldPrice.amount !== result.finalPrice.amount) {
    $(this.options.slyOldPriceSelector).show();
} else {
    $(this.options.slyOldPriceSelector).hide();
}

Of course, this means the state of this.options.slyOldPriceSelector is never changed, which in my use case, as it stands is fine.

This is specific commit, which includes links to the github tickets it was resolving: https://github.com/magento/magento2/commit/eb2ec29a03e2d7cb6adde7c0c01efa06d9b53d47

[ghost]

@ashsmith workaround did the job for me.

[petterkj]

Confirmed. 2.1.4.

2 user selectable attributes.

In my case, Color (swatch) size (dropdown).

If you only select swatch, JS error (and product image does not change)...

BUT if you select dropdown AND then swatch, no JS error.. And it changes product image..

Tested in environment: production.

[mcspronko]

Can't reproduce on current magento:develop branch.

[slayerbleast]

Installed a fresh magento 2.1.5 via bitnami VM magento stack, with sample data:

[martynshanks]

Same issue Magento 2.1.5 download from Github

adding the code snippet about worked for me too
/vendor/magento/module-swatches/view/frontend/web/js (line 714)

` if (!result) {
return;
}

        if (result.oldPrice.amount !== result.finalPrice.amount) {
            $(this.options.slyOldPriceSelector).show();
        } else {
            $(this.options.slyOldPriceSelector).hide();
        }`

[thdoan]

We just upgraded to v2.1.5 and can still reproduce this issue.

[refaelgold]

Same here 👎

[blizam]

same issue... just posting so I can watch this issue

Also, this is ALWAYS an issue in Configurable products where no attribute can be defaulted thus all options have no values on page load

[thdoan]

Another quick fix:

        if (result && result.oldPrice.amount !== result.finalPrice.amount) {
            $(this.options.slyOldPriceSelector).show();
        } else {
            $(this.options.slyOldPriceSelector).hide();
        }

[blizam]

I tested https://github.com/crantron/magento2/commit/a84852b057577a802067411ec5a4c967cfe24125 and the price is not updating as options are selected/even after all options are selected... I have both swatches and normal dropdown attributes on my configurable product

EDIT: it was a by-product of me moving the product.info.price element to a different area of the page... would by nice if the JS worked for changing the price regardless of where the price is rendered... though it does occur to me that form elements might not work so well outside the form :)

[LCIJJ]

Confirming this issue still occurs on 2.1.6, environment: default.

Clicking color swatch doesn't update product image. It's not until after clicking the size, associated product image updates. Using Chrome developer console, JS error (Uncaught TypeError: Cannot read property 'oldPrice' of undefined) triggers each time a swatch is clicked. See screenshot for full error>>> https://www.screencast.com/t/fXpFIEo4

Posting to follow.

[vkranjith]

Hi Magento Team,
I would like to work on it.

[dreamworkers]

Hi, @OZZlE and I will work on it.

[dreamworkers]

Fixed with: https://github.com/magento/magento2/commit/269c2154db82e2c3a19f8ba9a36e9b249a745998

[okorshenko]

@dreamworkers thank you for research. Could you please apply the fix 269c215 (which was done for develop branch) for 2.1-develop branch, verify it and create Pull Request to 2.1-develop branch

Thank you

[ihor-sviziev]

Looks like this issue was already fixed in develop & 2.1-develop branches. I think we need to close it.

[okorshenko]

@ihor-sviziev thank you for your comment

[magento-team]

Internal ticket to track issue progress: MAGETWO-69541