From d6f12b08797192f6fcd725aee48efc817eeb3e8e Mon Sep 17 00:00:00 2001 From: Aadrika Bhargava <64789514+reachaadrika@users.noreply.github.com> Date: Wed, 16 Aug 2023 19:52:51 +0530 Subject: [PATCH] feat: add unit tests for case study card , check render of tools pages & newsletter (#2064) --- components/CaseStudyCard.js | 2 +- cypress/test/CaseStudyCard.cy.js | 23 +++++++++++++++++++ cypress/test/pages/casestudies/index.cy.js | 14 +++++++++++ cypress/test/pages/newsletter/index.cy.js | 12 ++++++++++ cypress/test/pages/tools/cli.cy.js | 12 ++++++++++ cypress/test/pages/tools/generator.cy.js | 13 +++++++++++ cypress/test/pages/tools/github-actions.cy.js | 13 +++++++++++ cypress/test/pages/tools/index.cy.js | 12 ++++++++++ cypress/test/pages/tools/modelina.cy.js | 13 +++++++++++ cypress/test/pages/tools/parsers.cy.js | 13 +++++++++++ pages/casestudies/index.js | 8 +++---- pages/tools/index.js | 2 +- 12 files changed, 131 insertions(+), 6 deletions(-) create mode 100644 cypress/test/CaseStudyCard.cy.js create mode 100644 cypress/test/pages/casestudies/index.cy.js create mode 100644 cypress/test/pages/newsletter/index.cy.js create mode 100644 cypress/test/pages/tools/cli.cy.js create mode 100644 cypress/test/pages/tools/generator.cy.js create mode 100644 cypress/test/pages/tools/github-actions.cy.js create mode 100644 cypress/test/pages/tools/index.cy.js create mode 100644 cypress/test/pages/tools/modelina.cy.js create mode 100644 cypress/test/pages/tools/parsers.cy.js diff --git a/components/CaseStudyCard.js b/components/CaseStudyCard.js index fc741b4c487..861a927ff55 100644 --- a/components/CaseStudyCard.js +++ b/components/CaseStudyCard.js @@ -10,7 +10,7 @@ export default function CaseStudyCard({
{studies.map((study, index) => ( -
+
{ + + it('renders the CaseStudyCard component with study data', () => { + mount(); + + cy.get('[data-testid="CaseStudyCard-main"]').should('have.length', CaseStudiesList.length); + + CaseStudiesList.forEach((study, index) => { + cy.get(`.rounded-md:eq(${index}) img`).should('have.attr', 'src', study.company.logo); + cy.get(`.rounded-md:eq(${index}) img`).should('have.attr', 'alt', study.company.name); + }); + }); + + it('does not render anything when studies array is empty', () => { + mount(); + + cy.get('.rounded-md').should('not.exist'); + }); +}); diff --git a/cypress/test/pages/casestudies/index.cy.js b/cypress/test/pages/casestudies/index.cy.js new file mode 100644 index 00000000000..e8907f6baad --- /dev/null +++ b/cypress/test/pages/casestudies/index.cy.js @@ -0,0 +1,14 @@ +import Casestudies from "../../../../pages/casestudies"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for Case Study Pages', () => { + it('renders correctly', () => { + mount( + + + + ); + cy.get('[data-testid="CaseStudy-main"]').should('exist'); + cy.get('[data-testid="CaseStudy-card"]').should('exist'); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/newsletter/index.cy.js b/cypress/test/pages/newsletter/index.cy.js new file mode 100644 index 00000000000..12ed809689f --- /dev/null +++ b/cypress/test/pages/newsletter/index.cy.js @@ -0,0 +1,12 @@ +import NewsletterIndexPage from "../../../../pages/newsletter"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for Newsletter', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/tools/cli.cy.js b/cypress/test/pages/tools/cli.cy.js new file mode 100644 index 00000000000..cae5430a6c7 --- /dev/null +++ b/cypress/test/pages/tools/cli.cy.js @@ -0,0 +1,12 @@ +import CliPage from "../../../../pages/tools/cli"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for cli tools ', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/tools/generator.cy.js b/cypress/test/pages/tools/generator.cy.js new file mode 100644 index 00000000000..bf3204c366f --- /dev/null +++ b/cypress/test/pages/tools/generator.cy.js @@ -0,0 +1,13 @@ + +import GeneratorPage from "../../../../pages/tools/generator"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for generator tools', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/tools/github-actions.cy.js b/cypress/test/pages/tools/github-actions.cy.js new file mode 100644 index 00000000000..3f6438cc031 --- /dev/null +++ b/cypress/test/pages/tools/github-actions.cy.js @@ -0,0 +1,13 @@ + +import GithubActionsPage from "../../../../pages/tools/github-actions"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for Github Actions ', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/tools/index.cy.js b/cypress/test/pages/tools/index.cy.js new file mode 100644 index 00000000000..2621bbb4c81 --- /dev/null +++ b/cypress/test/pages/tools/index.cy.js @@ -0,0 +1,12 @@ +import Toolsdashboard from "../../../../pages/tools"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for Tools Dashboard', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/tools/modelina.cy.js b/cypress/test/pages/tools/modelina.cy.js new file mode 100644 index 00000000000..becdc892448 --- /dev/null +++ b/cypress/test/pages/tools/modelina.cy.js @@ -0,0 +1,13 @@ + +import ModelinaPlaygroundPage from "../../../../pages/tools/modelina"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for Modelina Pages', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/tools/parsers.cy.js b/cypress/test/pages/tools/parsers.cy.js new file mode 100644 index 00000000000..657cd66fcd7 --- /dev/null +++ b/cypress/test/pages/tools/parsers.cy.js @@ -0,0 +1,13 @@ + +import ParsersPage from "../../../../pages/tools/parsers"; +import MockApp from "../../../utils/MockApp"; +import {mount} from 'cypress/react'; +describe('Test for Parsers', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/pages/casestudies/index.js b/pages/casestudies/index.js index 089ccdad575..a4f30e5995c 100644 --- a/pages/casestudies/index.js +++ b/pages/casestudies/index.js @@ -5,7 +5,7 @@ import TextLink from '../../components/typography/TextLink'; import Heading from "../../components/typography/Heading"; import CaseStudiesList from "../../config/case-studies.json"; -export default function casestudies() { +export default function Casestudies() { const description = "Learn about different case studies based on AsyncAPI spec and related tools."; const image = "/img/social/case-studies.webp"; @@ -19,13 +19,13 @@ export default function casestudies() { wide > -
+
{title} - + The best way to learn how to use AsyncAPI is not only through documentation that usually is focused on recommendations and best practices. It is also good to confront with real-life case studies that explain how people really use AsyncAPI and what are their flows. @@ -37,7 +37,7 @@ export default function casestudies() {
-
+
diff --git a/pages/tools/index.js b/pages/tools/index.js index b1015111ad7..3d0b2bd4522 100644 --- a/pages/tools/index.js +++ b/pages/tools/index.js @@ -6,7 +6,7 @@ import Paragraph from '../../components/typography/Paragraph'; import TextLink from '../../components/typography/TextLink'; import { useEffect, useState } from 'react'; -export default function toolsDashboard() { +export default function ToolsIndex() { const description = 'Tools Dashboard for AsyncAPI Initiative'; const image = '/img/social/tools-dashboard-card.webp';