diff --git a/app/code/Magento/Review/view/frontend/templates/review.phtml b/app/code/Magento/Review/view/frontend/templates/review.phtml index c3f64511b1512..c332a1b4c874c 100644 --- a/app/code/Magento/Review/view/frontend/templates/review.phtml +++ b/app/code/Magento/Review/view/frontend/templates/review.phtml @@ -13,7 +13,8 @@ { "*": { "Magento_Review/js/process-reviews": { - "productReviewUrl": "escapeJs($block->escapeUrl($block->getProductReviewUrl())); ?>" + "productReviewUrl": "escapeJs($block->escapeUrl($block->getProductReviewUrl())); ?>", + "reviewsTabSelector": "#tab-label-reviews" } } } diff --git a/app/code/Magento/Review/view/frontend/web/js/process-reviews.js b/app/code/Magento/Review/view/frontend/web/js/process-reviews.js index 124b59becf1cb..8ba22caf29231 100644 --- a/app/code/Magento/Review/view/frontend/web/js/process-reviews.js +++ b/app/code/Magento/Review/view/frontend/web/js/process-reviews.js @@ -11,7 +11,9 @@ define([ $.ajax({ url: url, cache: true, - dataType: 'html' + dataType: 'html', + showLoader: true, + loaderContext: $('.product.data.items') }).done(function (data) { $('#product-review-container').html(data); $('[data-role="product-review"] .pages a').each(function (index, element) { @@ -30,7 +32,17 @@ define([ } return function (config, element) { - processReviews(config.productReviewUrl); + var reviewTab = $(config.reviewsTabSelector); + var requiredReviewTabRole = 'tab'; + + if (reviewTab.attr('role') === requiredReviewTabRole && reviewTab.hasClass('active')) { + processReviews(config.productReviewUrl); + } else { + reviewTab.one('beforeOpen', function () { + processReviews(config.productReviewUrl); + }); + } + $(function () { $('.product-info-main .reviews-actions a').click(function (event) { event.preventDefault(); diff --git a/dev/tests/js/jasmine/tests/app/code/Magento/Review/view/frontend/web/js/process-review.test.js b/dev/tests/js/jasmine/tests/app/code/Magento/Review/view/frontend/web/js/process-review.test.js new file mode 100644 index 0000000000000..66c9ccccb23be --- /dev/null +++ b/dev/tests/js/jasmine/tests/app/code/Magento/Review/view/frontend/web/js/process-review.test.js @@ -0,0 +1,76 @@ +/** + * Copyright © 2016 Magento. All rights reserved. + * See COPYING.txt for license details. + */ + +/*eslint max-nested-callbacks: 0*/ +/*jscs:disable jsDoc*/ + +define([ + 'jquery', + 'Magento_Review/js/process-reviews' +], function ($, reviewProcessor) { + 'use strict'; + + describe('Test product page reviews processor', function () { + var element, + config = { + reviewsTabSelector: '#review-tab' + }; + + beforeEach(function () { + element = $(''); + + $('body').append(element); + }); + + afterEach(function () { + element.remove(); + }); + + it('Should automatically load reviews after page load if review tab is active', function () { + element.addClass('active'); + + spyOn($, 'ajax').and.callFake(function () { + var d = $.Deferred(); + + d.promise().complete = function () {}; + + return d.promise(); + }); + + reviewProcessor(config, null); + + expect($.ajax).toHaveBeenCalled(); + }); + + it('Should not automatically load reviews after page load if review tab is not active', function () { + spyOn($, 'ajax').and.callFake(function () { + var d = $.Deferred(); + + d.promise().complete = function () {}; + + return d.promise(); + }); + + reviewProcessor(config, null); + + expect($.ajax).not.toHaveBeenCalled(); + }); + + it('Should load reviews if non active review tab was opened', function () { + spyOn($, 'ajax').and.callFake(function () { + var d = $.Deferred(); + + d.promise().complete = function () {}; + + return d.promise(); + }); + + reviewProcessor(config, null); + element.trigger('beforeOpen'); + + expect($.ajax).toHaveBeenCalled(); + }); + }); +});