Merge pull request #10538 from jibees/10537-shopfront-product-description-is-too-long

Shopfront: Force product description to be on one line

app/services/content_scrubber.rb

@@ -10,6 +10,14 @@ class ContentScrubber < Rails::Html::PermitScrubber
     self.attributes = ALLOWED_ATTRIBUTES
   end
 
+  def scrub(node)
+    if node.name == 'p' && (node.children.empty? || node.text.blank?)
+      node.remove
+    else
+      super
+    end
+  end
+
   def skip_node?(node)
     node.text?
   end

app/views/shop/products/_summary.html.haml

@@ -9,7 +9,7 @@
     %h3
       %a{"ng-click" => "triggerProductModal()", href: 'javascript:void(0)'}
         %span{"ng-bind" => "::product.name"}
-    %p.product-description{ng: {"bind-html": "::product.description_html", click: "triggerProductModal()", show: "product.description_html.length"}}
+    .product-description{ng: {"bind-html": "::product.description_html", click: "triggerProductModal()", show: "product.description_html.length"}}
     .product-producer
       = t :products_from
       %span

app/webpacker/css/darkswarm/_shop-product-rows.scss

@@ -149,6 +149,15 @@
             text-overflow: ellipsis;
             margin-bottom: 0.75rem;
             cursor: pointer;
+            // Force product description to be on one line
+            // and truncate with ellipsis
+            display: -webkit-box;
+            -webkit-line-clamp: 1;
+            -webkit-box-orient: vertical;
+            overflow: hidden; 
+            // line-clamp is not supported in Safari
+            line-height: 1rem;
+            height: 1.75rem;
           }
 
           .product-properties {

spec/services/content_sanitizer_spec.rb

@@ -53,5 +53,9 @@ describe ContentSanitizer do
     it "echos nil if given nil" do
       expect(service.sanitize_content(nil)).to be(nil)
     end
+
+    it "removes empty <p> tags and keeps non-empty ones" do
+      expect(service.sanitize_content("<p> </p><p></p><p><b></b><p>hello</p><p></p><p>world!</p>")).to eq("<p>hello</p><p>world!</p>")
+    end
   end
 end