magento2: Configurable product with swatches, doesn't show tier pricing when clicking edit in cart OR when active swatch set with url hash

Preconditions (*)

1. Magento 2.3.5

Steps to reproduce (*)

1. Create a configurable product with swatch options
2. Add tier prices to one of the options
3. Go to configurable product PDP
4. Select the tier price product
5. Add the product to cart
6. Click on edit button from mini cart/ cart page
7. Check the tier price is not shown on edit product page
8. Load the page with #attribute_id=value_id to preset the swatch value

Expected result (*)

1. Tier price block should show

Actual result (*)

1. Tier price does not show

Solution (*)

The issue lies in file; /vendor/magento/module-swatches/view/base/web/js/swatch-renderer.js

The function _UpdatePrice: function () { has a dependency on if this.options.tierPriceTemplate being defined on hashed options being set on load, which it isnt.

Here’s the change to ensure it gets defined;

Before:

_UpdatePrice: function () {
        var $widget = this,
            $product = $widget.element.parents($widget.options.selectorProduct),
            $productPrice = $product.find(this.options.selectorProductPrice),
            result = $widget._getNewPrices(),
            tierPriceHtml,
            isShow;

        $productPrice.trigger(
            'updatePrice',
            {
                'prices': $widget._getPrices(result, $productPrice.priceBox('option').prices)
            }
        );

        isShow = typeof result != 'undefined' && result.oldPrice.amount !== result.finalPrice.amount;

        $product.find(this.options.slyOldPriceSelector)[isShow ? 'show' : 'hide']();

        if (typeof result != 'undefined' && result.tierPrices && result.tierPrices.length) {
            if (this.options.tierPriceTemplate) {
                tierPriceHtml = mageTemplate(
                    this.options.tierPriceTemplate,
                    {
                        'tierPrices': result.tierPrices,
                        '$t': $t,
                        'currencyFormat': this.options.jsonConfig.currencyFormat,
                        'priceUtils': priceUtils
                    }
                );
                $(this.options.tierPriceBlockSelector).html(tierPriceHtml).show();
            } 

After;

_UpdatePrice: function () {
        var $widget = this,
            $product = $widget.element.parents($widget.options.selectorProduct),
            $productPrice = $product.find(this.options.selectorProductPrice),
            result = $widget._getNewPrices(),
            tierPriceHtml,
            isShow;

        $productPrice.trigger(
            'updatePrice',
            {
                'prices': $widget._getPrices(result, $productPrice.priceBox('option').prices)
            }
        );

        isShow = typeof result != 'undefined' && result.oldPrice.amount !== result.finalPrice.amount;

        $product.find(this.options.slyOldPriceSelector)[isShow ? 'show' : 'hide']();

        if (typeof result != 'undefined' && result.tierPrices && result.tierPrices.length) {
            // ADDED HERE
            if (this.options.tierPriceTemplate = $(this.options.tierPriceTemplateSelector).html()) {
                tierPriceHtml = mageTemplate(
                    this.options.tierPriceTemplate,
                    {
                        'tierPrices': result.tierPrices,
                        '$t': $t,
                        'currencyFormat': this.options.jsonConfig.currencyFormat,
                        'priceUtils': priceUtils
                    }
                );
                $(this.options.tierPriceBlockSelector).html(tierPriceHtml).show();
            }

Additional information more detailed steps and screens #28270 (Comment)