From 51594e7d461922bd6a7d2d7828d641c1a5613e2a Mon Sep 17 00:00:00 2001
From: Tom Byers <tombaromba@gmail.com>
Date: Fri, 11 Feb 2022 15:10:23 +0000
Subject: [PATCH] Add test for changes to component HTML on start

The updateContent JS was changed in this commit so
the replacement of the original HTML (with GOVUK
modules data-attributes) was moved into the start
method rather than being a slightly odd side
effect of the render function diffing:

https://github.com/alphagov/notifications-admin/pull/4155/commits/476ed1593cb1e438dc7b7d2a509c54c6f3fef8ff

This adds a test to make it more clear this
happens, as requested in this comment:

https://github.com/alphagov/notifications-admin/pull/4155#discussion_r804689618
---
 tests/javascripts/updateContent.test.js | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/tests/javascripts/updateContent.test.js b/tests/javascripts/updateContent.test.js
index aff63d767..6923105a9 100644
--- a/tests/javascripts/updateContent.test.js
+++ b/tests/javascripts/updateContent.test.js
@@ -94,7 +94,7 @@ describe('Update content', () => {
         </div>`;
 
 
-      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}" aria-live="polite">
+      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}">
                           ${HTMLString}
                           </div>`;
 
@@ -105,6 +105,15 @@ describe('Update content', () => {
 
     });
 
+    test("It should replace the original HTML with that of the partial, to match that returned from AJAX responses", () => {
+
+      // start the module
+      window.GOVUK.modules.start();
+
+      expect(document.querySelector('.ajax-block-container').parentNode.hasAttribute('data-resource')).toBe(false);
+
+    });
+
     test("It should make requests to the URL specified in the data-resource attribute", () => {
 
       // start the module
@@ -302,7 +311,7 @@ describe('Update content', () => {
         }
       ]);
 
-      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}" aria-live="polite">
+      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}">
                           ${HTMLString}
                           </div>`;
 
@@ -336,7 +345,7 @@ describe('Update content', () => {
         }
       ]);
 
-      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}" aria-live="polite">
+      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}">
                           ${HTMLString}
                           </div>`;
 
@@ -401,7 +410,7 @@ describe('Update content', () => {
         }
       ]);
 
-      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}" aria-live="polite">
+      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}">
                           ${HTMLString}
                           </div>`;
 
@@ -447,7 +456,7 @@ describe('Update content', () => {
         }
       ]);
 
-      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}" aria-live="polite">
+      initialHTMLString = `<div data-module="update-content" data-resource="${resourceURL}" data-key="${updateKey}">
                           ${HTMLString}
                           </div>`;