From 3b8f4cb6e2804843e52420df01a7f36723f51697 Mon Sep 17 00:00:00 2001
From: Lemmy Adams <103187526+lemmyadams@users.noreply.github.com>
Date: Mon, 11 Mar 2024 11:09:13 +0000
Subject: [PATCH] Chore: e2e tests on accordion component (issue/147) (#148)

* Added accordion e2e test

* Update test/e2e/accordion.cy.js

Co-authored-by: Cahir O'Doherty <41006337+cahirodoherty-learningpool@users.noreply.github.com>

* Corrected test

---------

Co-authored-by: Cahir O'Doherty <41006337+cahirodoherty-learningpool@users.noreply.github.com>
---
 test/e2e/accordion.cy.js | 45 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 test/e2e/accordion.cy.js

diff --git a/test/e2e/accordion.cy.js b/test/e2e/accordion.cy.js
new file mode 100644
index 0000000..d7c8bec
--- /dev/null
+++ b/test/e2e/accordion.cy.js
@@ -0,0 +1,45 @@
+describe('Accordion', function () {
+  function loopThroughAccordion(accordionComponent) {
+    const items = accordionComponent._items
+    cy.get('.accordion-item').should('have.length', items.length)
+    // Check each accordion item
+    items.forEach((item, index) =>  {
+      const bodyWithoutHtml = item.body.replace(/<[^>]*>/g, '')
+      // Check within the correct item so it doesn't detect visibility from other items
+      cy.get('.accordion-item').eq(index).within(() => {
+        cy.get('.accordion-item__btn.is-visited').should('not.exist')
+        cy.get('.accordion-item__body-inner').should('not.be.visible')
+        cy.get('.accordion-item__title').should('contain', item.title).click()
+        cy.get('.accordion-item__btn.is-visited').should('exist')
+        cy.get('.accordion-item__body-inner')
+          .should('be.visible')
+          .should('contain', bodyWithoutHtml)
+        cy.get('.accordion-item__title').click()
+        cy.get('.accordion-item__body-inner').should('not.be.visible')
+      })
+    })
+  }
+
+  beforeEach(function () {
+    cy.getData()
+  });
+
+  it('should display the accordion component', function () {
+    const accordionComponents = this.data.components.filter((component) => component._component === 'accordion')
+    accordionComponents.forEach((accordionComponent) => {
+      cy.visit(`/#/preview/${accordionComponent._id}`);
+      const bodyWithoutHtml = accordionComponent.body.replace(/<[^>]*>/g, '')
+
+      // Test basic accordion component
+      cy.testContainsOrNotExists('.accordion__title', accordionComponent.displayTitle)
+      cy.testContainsOrNotExists('.accordion__body', bodyWithoutHtml)
+      cy.testContainsOrNotExists('.accordion__instruction', accordionComponent.instruction)
+      
+      // Test accordion items
+      loopThroughAccordion(accordionComponent)
+
+      // Allow the component to load and run external custom tests
+      cy.wait(1000)
+    })
+  });
+});