Merge pull request #9658 from alphagov/content-modelling/659-preview-…

…content Content modelling/ Preview content
alphagov · Nov 27, 2024 · 4ebd734 · 4ebd734
2 parents 9acdfa4 + 2396ca0
commit 4ebd734
Show file tree

Hide file tree

Showing 12 changed files with 115 additions and 19 deletions.
diff --git a/...ntent_block_manager/content_block_edition/host_content/preview_details_component.html.erb b/...ntent_block_manager/content_block_edition/host_content/preview_details_component.html.erb
@@ -0,0 +1,5 @@
+<ul class="govuk-list">
+  <% list_items.each do |item| %>
+    <li><strong><%= item[:key] %>: </strong><%= item[:value] %></li>
+  <% end %>
+</ul>
diff --git a/...nts/content_block_manager/content_block_edition/host_content/preview_details_component.rb b/...nts/content_block_manager/content_block_edition/host_content/preview_details_component.rb
@@ -0,0 +1,22 @@
+class ContentBlockManager::ContentBlockEdition::HostContent::PreviewDetailsComponent < ViewComponent::Base
+  def initialize(content_block_edition:, preview_content:)
+    @content_block_edition = content_block_edition
+    @preview_content = preview_content
+  end
+
+private
+
+  def list_items
+    [*details_items, instances_item]
+  end
+
+  def details_items
+    @content_block_edition.details.map do |key, value|
+      { key: key.humanize, value: }
+    end
+  end
+
+  def instances_item
+    { key: "Instances", value: @preview_content.instances_count }
+  end
+end
diff --git a/...r/app/controllers/content_block_manager/content_block/editions/host_content_controller.rb b/...r/app/controllers/content_block_manager/content_block/editions/host_content_controller.rb
@@ -1,7 +1,7 @@
 class ContentBlockManager::ContentBlock::Editions::HostContentController < ContentBlockManager::BaseController
   def preview
     host_content_id = params[:host_content_id]
-    content_block_edition = ContentBlockManager::ContentBlock::Edition.find(params[:id])
-    @preview_content = ContentBlockManager::GetPreviewContent.for_content_id(content_id: host_content_id, content_block_edition:)
+    @content_block_edition = ContentBlockManager::ContentBlock::Edition.find(params[:id])
+    @preview_content = ContentBlockManager::GetPreviewContent.for_content_id(content_id: host_content_id, content_block_edition: @content_block_edition)
   end
 end
diff --git a/lib/engines/content_block_manager/app/models/content_block_manager/preview_content.rb b/lib/engines/content_block_manager/app/models/content_block_manager/preview_content.rb
@@ -1,4 +1,4 @@
 module ContentBlockManager
-  class PreviewContent < Data.define(:title, :html)
+  class PreviewContent < Data.define(:title, :html, :instances_count)
   end
 end
diff --git a/lib/engines/content_block_manager/app/services/content_block_manager/get_preview_content.rb b/lib/engines/content_block_manager/app/services/content_block_manager/get_preview_content.rb
@@ -9,7 +9,7 @@ def self.for_content_id(content_id:, content_block_edition:)
     end
 
     def for_content_id
-      ContentBlockManager::PreviewContent.new(title: content_item["title"], html:)
+      ContentBlockManager::PreviewContent.new(title: content_item["title"], html:, instances_count:)
     end
 
   private
@@ -41,6 +41,7 @@ def frontend_path
     def preview_html
       uri = URI(frontend_path)
       nokogiri_html = html_snapshot_from_frontend(uri)
+      add_draft_style(nokogiri_html)
       replace_existing_content_blocks(nokogiri_html)
     end
 
@@ -69,6 +70,10 @@ def content_block_spans(nokogiri_html)
       nokogiri_html.css("span[data-content-id=\"#{@content_block_edition.document.content_id}\"]")
     end
 
+    def instances_count
+      content_block_spans(html).length
+    end
+
     ERROR_HTML = "<html><body><p>Preview not found</p></body></html>".freeze
 
     def html_snapshot_from_frontend(uri)
@@ -79,5 +84,13 @@ def html_snapshot_from_frontend(uri)
       end
       Nokogiri::HTML.parse(raw_html)
     end
+
+    def add_draft_style(nokogiri_html)
+      nokogiri_html.css("body").each do |body|
+        body["class"] ||= ""
+        body["class"] += " draft"
+      end
+      nokogiri_html
+    end
   end
 end
diff --git a/...ager/app/views/content_block_manager/content_block/editions/host_content/preview.html.erb b/...ager/app/views/content_block_manager/content_block/editions/host_content/preview.html.erb
@@ -1,11 +1,13 @@
 <% content_for :page_title, "Preview content block in host document" %>
-<% content_for :context, "Preview content block" %>
+<% content_for :context, "Preview #{@content_block_edition.block_type.humanize.downcase}" %>
 <% content_for :title, @preview_content.title %>
-<% content_for :title_margin_bottom, 0 %>
+<% content_for :title_margin_bottom, 3 %>
 
 <div class="govuk-grid-row">
   <div class="govuk-grid-column-two-thirds govuk-body govuk-!-margin-bottom-0">
-    <p><strong>Document title: </strong><%= @preview_content.title %></p>
+    <%= render(ContentBlockManager::ContentBlockEdition::HostContent::PreviewDetailsComponent.new(
+          content_block_edition: @content_block_edition,
+          preview_content: @preview_content)) %>
   </div>
 </div>
 <hr class="govuk-section-break govuk-!-margin-bottom-8 govuk-section-break--visible">

diff --git a/lib/engines/content_block_manager/features/edit_object.feature b/lib/engines/content_block_manager/features/edit_object.feature
@@ -102,4 +102,4 @@ Feature: Edit a content object
     And I fill out the form
     Then I am shown where the changes will take place
     When I click on the first host document
-    Then The preview page opens in a new tab
+    Then the preview page opens in a new tab
diff --git a/lib/engines/content_block_manager/features/step_definitions/content_block_manager_steps.rb b/lib/engines/content_block_manager/features/step_definitions/content_block_manager_steps.rb
@@ -508,15 +508,17 @@ def should_show_edit_form_for_email_address_content_block(document_title, email_
     Plek.website_root + @current_host_document["base_path"],
   ).to_return(
     status: 200,
-    body: "<h1>#{@current_host_document['title']}</h1><p>iframe preview</p>",
+    body: "<body><h1>#{@current_host_document['title']}</h1><p>iframe preview</p>#{@content_block.render}</body>",
   )
 
   click_on @current_host_document["title"]
 end
 
-Then("The preview page opens in a new tab") do
+Then("the preview page opens in a new tab") do
   page.switch_to_window(page.windows.last)
-  assert_text "Preview content block"
+  assert_text "Preview email address"
+  assert_text "Instances: 1"
+  assert_text "Email address: [email protected]"
   within_frame "preview" do
     assert_text @current_host_document["title"]
   end

diff --git a/...ager/test/components/content_block/edition/host_content/preview_details_component_test.rb b/...ager/test/components/content_block/edition/host_content/preview_details_component_test.rb
@@ -0,0 +1,21 @@
+require "test_helper"
+
+class ContentBlockManager::ContentBlockEdition::HostContent::PreviewDetailsComponentTest < ViewComponent::TestCase
+  extend Minitest::Spec::DSL
+
+  let(:content_block_edition) { build(:content_block_edition, :email_address, details: { "email_address": "[email protected]" }) }
+  let(:preview_content) { build(:preview_content, instances_count: 2) }
+
+  it "returns a list of details for preview content" do
+    render_inline(
+      ContentBlockManager::ContentBlockEdition::HostContent::PreviewDetailsComponent.new(
+        content_block_edition:,
+        preview_content:,
+      ),
+    )
+
+    assert_selector "li", count: 2
+    assert_selector "li", text: "Email address: [email protected]"
+    assert_selector "li", text: "Instances: 2"
+  end
+end
diff --git a/lib/engines/content_block_manager/test/factories/preview_content.rb b/lib/engines/content_block_manager/test/factories/preview_content.rb
@@ -2,9 +2,10 @@
   factory :preview_content, class: "ContentBlockManager::PreviewContent" do
     title { "Example Title" }
     html { "<p>Example HTML</p>" }
+    instances_count { 3 }
 
     initialize_with do
-      new(title:, html:)
+      new(title:, instances_count:, html:)
     end
   end
 end
diff --git a/lib/engines/content_block_manager/test/unit/app/models/preview_content_test.rb b/lib/engines/content_block_manager/test/unit/app/models/preview_content_test.rb
@@ -5,10 +5,12 @@ class ContentBlockManager::PreviewContentTest < ActiveSupport::TestCase
 
   let(:title) { "Ministry of Example" }
   let(:html) { "<p>Ministry of Example</p>" }
-  let(:preview_content) { build(:preview_content, title:, html:) }
+  let(:instances_count) { "2" }
+  let(:preview_content) { build(:preview_content, title:, instances_count:, html:) }
 
-  it "returns title and html" do
+  it "returns title, html and instances count" do
     assert_equal preview_content.title, title
     assert_equal preview_content.html, html
+    assert_equal preview_content.instances_count, instances_count
   end
 end
diff --git a/lib/engines/content_block_manager/test/unit/app/services/get_preview_content_test.rb b/lib/engines/content_block_manager/test/unit/app/services/get_preview_content_test.rb
@@ -10,7 +10,7 @@ class ContentBlockManager::GetPreviewContentTest < ActiveSupport::TestCase
   let(:host_base_path) { "/test" }
   let(:uri_mock) { mock }
   let(:fake_frontend_response) do
-    "<body><p>test</p><span class=\"content-embed content-embed__content_block_email_address\" data-content-block=\"\" data-document-type=\"content_block_email_address\" data-content-id=\"#{preview_content_id}\">[email protected]</span></body>"
+    "<body class=\"govuk-body\"><p>test</p><span class=\"content-embed content-embed__content_block_email_address\" data-content-block=\"\" data-document-type=\"content_block_email_address\" data-content-id=\"#{preview_content_id}\">[email protected]</span></body>"
   end
   let(:block_render) do
     "<span class=\"content-embed content-embed__content_block_email_address\" data-content-block=\"\" data-document-type=\"content_block_email_address\" data-content-id=\"#{preview_content_id}\">[email protected]</span>"
@@ -19,10 +19,10 @@ class ContentBlockManager::GetPreviewContentTest < ActiveSupport::TestCase
     "<span class=\"content-embed content-embed__content_block_email_address\" data-content-block=\"\" data-document-type=\"content_block_email_address\" data-content-id=\"#{preview_content_id}\" style=\"background-color: yellow;\">[email protected]</span>"
   end
   let(:expected_html) do
-    "<body><p>test</p>#{block_render_with_style}</body>"
+    "<body class=\"govuk-body draft\"><p>test</p>#{block_render_with_style}</body>"
   end
   let(:error_html) do
-    "<html><body><p>Preview not found</p></body></html>"
+    "<html><body class=\" draft\"><p>Preview not found</p></body></html>"
   end
   let(:document) do
     build(:content_block_document, :email_address, content_id: preview_content_id)
@@ -37,12 +37,11 @@ class ContentBlockManager::GetPreviewContentTest < ActiveSupport::TestCase
       block_to_preview.expects(:render).returns(block_render)
     end
 
-    it "returns the title and preview HTML for a document" do
+    it "returns the title of host document" do
       Net::HTTP.expects(:get).with(URI(Plek.website_root + host_base_path)).returns(fake_frontend_response)
 
       expected_content = {
         title: host_title,
-        html: Nokogiri::HTML.parse(expected_html),
       }
 
       actual_content = ContentBlockManager::GetPreviewContent.for_content_id(
@@ -51,6 +50,35 @@ class ContentBlockManager::GetPreviewContentTest < ActiveSupport::TestCase
       )
 
       assert_equal expected_content[:title], actual_content.title
+    end
+
+    it "returns the count of instances" do
+      Net::HTTP.expects(:get).with(URI(Plek.website_root + host_base_path)).returns(fake_frontend_response)
+
+      expected_content = {
+        instances_count: 1,
+      }
+
+      actual_content = ContentBlockManager::GetPreviewContent.for_content_id(
+        content_id: host_content_id,
+        content_block_edition: block_to_preview,
+      )
+
+      assert_equal expected_content[:instances_count], actual_content.instances_count
+    end
+
+    it "returns the preview html" do
+      Net::HTTP.expects(:get).with(URI(Plek.website_root + host_base_path)).returns(fake_frontend_response)
+
+      expected_content = {
+        html: Nokogiri::HTML.parse(expected_html),
+      }
+
+      actual_content = ContentBlockManager::GetPreviewContent.for_content_id(
+        content_id: host_content_id,
+        content_block_edition: block_to_preview,
+      )
+
       assert_equal expected_content[:html].to_s, actual_content.html.to_s
     end