From 3df3966668dd194fe2c29ecc06c411a674b739e9 Mon Sep 17 00:00:00 2001
From: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com>
Date: Tue, 19 Jan 2021 13:58:18 +0200
Subject: [PATCH] BCTHEME-327: PDP - Empty "Description" is Hiding All Tabs
 When in Tab View (#1947)

---
 CHANGELOG.md                                  |  1 +
 .../components/products/description-tabs.html | 36 ++++++++++---------
 .../components/products/description.html      | 10 +++---
 .../components/products/product-view.html     | 16 ++++-----
 4 files changed, 34 insertions(+), 29 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 77a783d264..175e5cd1ee 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,7 @@
 # Changelog
 
 ## Draft
+- PDP - Fixed Empty "Description" Hiding All Tabs When in Tab View. [#1947](https://github.com/bigcommerce/cornerstone/pull/1947)
 - Added custom event for product price change on PDP page. [#1948](https://github.com/bigcommerce/cornerstone/pull/1948)
 - Fixed announcement of subscription message. [#1952](https://github.com/bigcommerce/cornerstone/pull/1952)
 - Error message on PLPs not announced by screen reader. [#1956](https://github.com/bigcommerce/cornerstone/pull/1956)
diff --git a/templates/components/products/description-tabs.html b/templates/components/products/description-tabs.html
index b7bc602e6d..5c22ab9312 100644
--- a/templates/components/products/description-tabs.html
+++ b/templates/components/products/description-tabs.html
@@ -1,9 +1,11 @@
 <ul class="tabs" data-tab>
-    <li class="tab is-active">
-        <a class="tab-title" href="#tab-description">{{lang 'products.description'}}</a>
-    </li>
+    {{#if product.description}}
+        <li class="tab is-active">
+            <a class="tab-title" href="#tab-description">{{lang 'products.description'}}</a>
+        </li>
+    {{/if}}
     {{#if product.warranty}}
-        <li class="tab">
+        <li class="tab {{#unless product.description}}is-active{{/unless}}">
             <a class="tab-title" href="#tab-warranty">{{lang 'products.warranty'}}</a>
         </li>
     {{/if}}
@@ -19,15 +21,17 @@
     {{/all}}
 </ul>
 <div class="tabs-contents">
-    <div class="tab-content is-active" id="tab-description">
-        {{{product.description}}}
-    </div>
-   {{#if product.warranty}}
-       <div class="tab-content" id="tab-warranty">
-           {{{product.warranty}}}
-       </div>
-   {{/if}}
-   {{#all product.custom_fields theme_settings.show_custom_fields_tabs}}
+    {{#if product.description}}
+        <div class="tab-content is-active" id="tab-description">
+            {{{product.description}}}
+        </div>
+    {{/if}}
+    {{#if product.warranty}}
+        <div class="tab-content {{#unless product.description}}is-active{{/unless}}" id="tab-warranty">
+            {{{product.warranty}}}
+        </div>
+    {{/if}}
+    {{#all product.custom_fields theme_settings.show_custom_fields_tabs}}
       <div class="tab-content" id="tab-{{dashcase (lowercase (sanitize theme_settings.pdp-custom-fields-tab-label))}}">
          <dl class="productView-info">
             {{#each product.custom_fields}}
@@ -36,10 +40,10 @@
             {{/each}}
          </dl>
       </div>
-   {{/all}}
-   {{#all settings.show_product_reviews theme_settings.show_product_reviews}}
+    {{/all}}
+    {{#all settings.show_product_reviews theme_settings.show_product_reviews}}
        <div class="tab-content" id="tab-reviews">
            {{> components/products/reviews reviews=product.reviews product=product urls=urls}}
        </div>
-   {{/all}}
+    {{/all}}
 </div>
diff --git a/templates/components/products/description.html b/templates/components/products/description.html
index 047dfa1484..48cea6aecd 100644
--- a/templates/components/products/description.html
+++ b/templates/components/products/description.html
@@ -1,7 +1,9 @@
-<p class="productView-title">{{lang 'products.description'}}</p>
-<div class="productView-description" {{#if settings.data_tag_enabled}} data-event-type="product" {{/if}}>
-    {{{product.description}}}
-</div>
+{{#if product.description}}
+    <p class="productView-title">{{lang 'products.description'}}</p>
+    <div class="productView-description" {{#if settings.data_tag_enabled}} data-event-type="product" {{/if}}>
+        {{{product.description}}}
+    </div>
+{{/if}}
 
 {{#if product.warranty}}
     <p class="productView-title">{{lang 'products.warranty'}}</p>
diff --git a/templates/components/products/product-view.html b/templates/components/products/product-view.html
index 9bfb82eeaf..a3c9b2c951 100644
--- a/templates/components/products/product-view.html
+++ b/templates/components/products/product-view.html
@@ -250,15 +250,13 @@ <h2 class="productView-brand"{{#if schema}} itemprop="brand" itemscope itemtype=
         {{/unless}}
     </section>
 
-    {{#if product.description}}
-        <article class="productView-description"{{#if schema}} itemprop="description"{{/if}}>
-            {{#if theme_settings.show_product_details_tabs}}
-                {{> components/products/description-tabs}}
-            {{else}}
-                {{> components/products/description}}
-            {{/if}}
-        </article>
-    {{/if}}
+    <article class="productView-description"{{#if schema}} itemprop="description"{{/if}}>
+        {{#if theme_settings.show_product_details_tabs}}
+            {{> components/products/description-tabs}}
+        {{else}}
+            {{> components/products/description}}
+        {{/if}}
+    </article>
 </div>
 
 <div id="previewModal" class="modal modal--large" data-reveal>