diff --git a/components/community/Card.js b/components/community/Card.js index b5be16046b9..ee743c45c87 100644 --- a/components/community/Card.js +++ b/components/community/Card.js @@ -11,7 +11,7 @@ export default function SmallHomeCards({icon, tagline, taglineBg, type="large",
+ data-testid="Card-small-bg">
{icon} {tagline}
@@ -41,10 +41,10 @@ export default function SmallHomeCards({icon, tagline, taglineBg, type="large", className={`h-140 w-full shadow-xl rounded p-6 border ${ !bg && 'border-[#ad20e2]' } ${bg}`} - > + data-testid="Card-lg-bg">
+ data-testid="Card-lg-tagline"> {icon} {tagline}
@@ -62,7 +62,7 @@ export default function SmallHomeCards({icon, tagline, taglineBg, type="large",
- +
{' '} {btnText} diff --git a/components/navigation/EventFilter.js b/components/navigation/EventFilter.js index c801fb4a5ce..2ddce66b18e 100644 --- a/components/navigation/EventFilter.js +++ b/components/navigation/EventFilter.js @@ -29,9 +29,9 @@ function EventFilter({ data, setData }) { } }, [active]); return ( -
+
{filterList.map((list) => ( -
+
  • { cy.get('[data-testid="Card-desc"]').contains('Description').should('exist'); cy.get('[data-testid="Card-heading"]').should('have.class','mt-3'); cy.get('[data-testid="Card-desc"]').should('have.class','mt-2'); + cy.get('[href="/path"]').should('exist'); }); it('renders large card correctly', () => { @@ -46,6 +47,7 @@ describe('SmallHomeCards', () => { // Testing for large prop classes and styles cy.get('[data-testid="Card-heading-lg"]').contains('Heading').should('exist'); cy.get('[data-testid="Card-desc-lg"]').contains('Description').should('exist'); + cy.get('[href="/path"]').should('exist'); cy.get('[data-testid="Card-heading-lg"]').should('have.class','mt-10'); cy.get('[data-testid="Card-desc-lg"]').should('have.class','mt-6'); diff --git a/cypress/test/dashboard/GoodFirstIssuesTip.cy.js b/cypress/test/dashboard/GoodFirstIssuesTip.cy.js index 67f7f7b8862..5cca9d74e7a 100644 --- a/cypress/test/dashboard/GoodFirstIssuesTip.cy.js +++ b/cypress/test/dashboard/GoodFirstIssuesTip.cy.js @@ -8,14 +8,12 @@ describe('GoodFirstIssuesTip', () => { }); it('toggles the tip when hovering over the icon', () => { - cy.get('[data-testid="GoodFirstIssuesTip-hover-icon"]').trigger('mouseenter'); - cy.get('[data-testid="GoodFirstIssuesTip-hover-icon"]').trigger('mouseleave'); - + cy.get('[data-testid="GoodFirstIssuesTip-hover-icon"]').click({ force: true }); }); it('renders the tip content with the correct text', () => { - cy.get('[data-testid="GoodFirstIssuesTip-hover-icon"]').trigger('mouseenter'); - //checking for the available class here + cy.get('[data-testid="GoodFirstIssuesTip-hover-icon"]').click({ force: true }); + //checking for the available class here cy.get('.bg-white').should('have.css', 'visibility', 'visible'); cy.contains('Is this your first contribution?').should('exist'); diff --git a/cypress/test/dashboard/Header.cy.js b/cypress/test/dashboard/Header.cy.js index 6de218040db..9bccdae248e 100644 --- a/cypress/test/dashboard/Header.cy.js +++ b/cypress/test/dashboard/Header.cy.js @@ -22,10 +22,11 @@ describe('Header', () => { 'contain', 'Visualize our progress. Get involved.' ); - cy.get('[data-testid="Github-button"]').should('exist'); - cy.get('[data-testid="Slack-button"]').should('exist'); + cy.contains('Contribution Guide') .should('have.attr', 'href', 'https://github.com/asyncapi?type=source#-contribute-to-asyncapi') .should('have.attr', 'target', '_blank'); + cy.get('[data-testid="Button-link"]').should('exist'); + cy.get('[data-testid="Button-link"]').should('exist'); }); }); diff --git a/cypress/test/pages/community/ambassadors/index.cy.js b/cypress/test/pages/community/ambassadors/index.cy.js new file mode 100644 index 00000000000..f4818f13851 --- /dev/null +++ b/cypress/test/pages/community/ambassadors/index.cy.js @@ -0,0 +1,78 @@ +import MockApp from "../../../../utils/MockApp" +import Index from '../../../../../pages/community/ambassadors/index' +import ambassadorList from '../../../../../config/ambassador_lists.json' +import ambassadors from '../../../../../config/AMBASSADORS_MEMBERS.json' +import { addAdditionalUserInfo } from "../../../../../pages/community/ambassadors/index"; +import { sortBy } from 'lodash'; + +describe('Test for Ambassadors', () => { + beforeEach(() => { + cy.mount() + }); + + it('displays the main Ambassadors section ', () => { + cy.get('[data-testid="Ambassadors-main"]').should('exist') + cy.get('[data-testid="Ambassadors-content"]').should('exist') + cy.get('[data-testid="Ambassadors-button"]').should('exist') + cy.get(`[href="https://github.com/asyncapi/community/blob/master/AMBASSADOR_ORGANIZATION.md#are-you-interested-in-becoming-an-official-asyncapi-ambassador"]`).should('exist'); + cy.get('[data-testid="Ambassadors-Iframe"]').should('exist') + cy.get('[data-testid="Ambassadors-contributions"]').should('exist') + }); + + it('renders the ambassador list with correct data', () => { + ambassadorList.contents.forEach((link) => { + cy.get('[data-testid="Ambassadors-list"]') + .find(`img[alt="${link.title}"]`) + .should('exist') + .and('have.attr', 'src', link.icon); + + cy.get('[data-testid="Ambassadors-list"]') + .contains('h2', link.title) + .should('exist'); + + cy.get('[data-testid="Ambassadors-list"]') + .contains('p', link.details) + .should('exist'); + }); + }); + + it('renders the ambassadors with correct data', () => { + const asyncapiAmbassadors = sortBy( + ambassadors.map((user) => addAdditionalUserInfo(user)), + ['name'] + ); + cy.get('[data-testid="Ambassadors-members-main"]') + .children() + .should('have.length', asyncapiAmbassadors.length); + + asyncapiAmbassadors.forEach((ambassador) => { + cy.get('[data-testid="Ambassadors-members-details"]') + .contains('div', ambassador.name) + + cy.get('[data-testid="Ambassadors-members-img"]') + .find(`img[alt="${ambassador.name}"]`) + .should('have.attr', 'src', ambassador.img); + + cy.get('[data-testid="Ambassadors-members"]') + .contains('div', ambassador.title); + }); + }); + + it('displays the Tokens of our appreciation section with correct data', () => { + cy.get('[data-testid="Events-token"]').should('exist') + + ambassadorList.tokens.forEach((token) => { + cy.contains('.mt-20 li', token.emoji).should('exist'); + cy.contains('.mt-20 li', token.title).should('exist'); + cy.contains('.mt-20 li', token.details).should('exist'); + }); + }); + + it('displays the Become an AsyncAPI Ambassador section with correct data', () => { + cy.get('[data-testid="Events-ambassadors"]').should('exist'); + }); + + it('should display NewsletterSubscribe', () => { + cy.get('[data-testid="NewsletterSubscribe-main"]').should('exist'); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/community/dashboard.cy.js b/cypress/test/pages/community/dashboard.cy.js new file mode 100644 index 00000000000..da33c1cc006 --- /dev/null +++ b/cypress/test/pages/community/dashboard.cy.js @@ -0,0 +1,28 @@ +import MockApp from "../../../utils/MockApp"; +import DashboardHome from "../../../../pages/community/dashboard"; +import Header from "../../../../components/dashboard/Header"; +import { mount } from '@cypress/react' +describe('Integration Test for Dashboard ', () => { + + it('should filter GoodFirstIssues and check dashboard render ', () => { + mount( + + + + ); + // Click on the first filter option + cy.get(Header).should('exist') + cy.contains('AsyncAPI - Dashboard') + cy.get('[data-testid="Filters-img-container"]').click({ force: true }); + cy.get('[data-testid="Filter-menu"]').within(() => { + cy.get('[data-testid="Select-form"]').eq(0).select('asyncapi/generator', { force: true }); + cy.get('[data-testid="Select-form"]').eq(1).select('docs') + }); + //check if selected is only displayed + cy.contains('asyncapi/generator'); + cy.contains('docs') + //check if this is not selected options are not displayed + cy.should('not.contain', 'asyncapi/community'); + cy.should('not.contain', 'javascript'); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/community/events/index.cy.js b/cypress/test/pages/community/events/index.cy.js new file mode 100644 index 00000000000..6713bb8d471 --- /dev/null +++ b/cypress/test/pages/community/events/index.cy.js @@ -0,0 +1,70 @@ +import Eventindex from "../../../../../pages/community/events"; +import MockApp from "../../../../utils/MockApp"; +import meetings from '../../../../../config/meetings.json'; +import moment from 'moment'; +describe('CommunityIndexPage', () => { + beforeEach(() => { + cy.mount() + }); + + it('displays the basic Events', () => { + cy.get('[data-testid="Events-main"]').should('exist') + cy.contains('Join an AsyncAPI event from anywhere in the world.') + cy.get('[data-testid="Events-Button"]').should('exist') + cy.get(`[href="https://calendar.google.com/calendar/u/3?cid=Y19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bncm91cC5jYWxlbmRhci5nb29nbGUuY29t"]`).should('exist'); + cy.get(`[href="https://calendar.google.com/calendar/ical/c_q9tseiglomdsj6njuhvbpts11c%40group.calendar.google.com/public/basic.ics"]`).should('exist'); + cy.get('[data-testid="TextLink-href" ]').should('have.attr', 'href', 'https://github.com/asyncapi/community/blob/master/MEETINGS_ORGANIZATION.md') + }); + + it('displays recording card', () => { + cy.get('[data-testid="RecordingsCard-img"]').should('exist'); + cy.get('[data-testid="Recordings-Link"]').should('have.attr', 'href', 'https://www.youtube.com/playlist?list=PLbi1gRlP7pijRiA32SU36hD_FW-2qyPhl') + cy.get('[data-testid="Recordings-text"]').should('exist'); + }); + + it('check for Events Filters', () => { + cy.get('[data-testid="EventFilters-main"]').should('exist'); + cy.get('[data-testid="EventFilter-click"]').contains('All').click({ force: true }); + + meetings.forEach((event) => { + cy.contains(event.title).should('be.visible'); + }); + cy.get('[data-testid="EventFilter-click"]').contains('Upcoming').click({ force: true }); + + const currentDate = moment().format('YYYY-MM-DD'); + meetings.forEach((event) => { + if (moment(event.date).isAfter(currentDate)) { + cy.contains(event.title).should('be.visible'); + } + }); + + cy.get('[data-testid="EventFilter-click"]').contains('Recorded').click({ force: true }); + const currentDate1 = moment().format('YYYY-MM-DD'); + meetings.forEach((event) => { + if (moment(event.date).isBefore(currentDate1)) { + cy.contains(event.title).should('be.visible'); + } + }); + }) + + it('check for Events Post Item', () => { + cy.get('[data-testid="EventPostItem-main"]').should('exist'); + }) + + it('Community Meeting Card', () => { + cy.get('[data-testid="EventTypesCard"]').should('exist') + cy.get('[data-testid="Meeting-heading"]').should('exist') + cy.get('[ data-testid="Meeting-paragraph"]').should('exist') + cy.get('[ data-testid="Meeting-host"]').should('exist') + cy.get('[ data-testid="Meeting-link"]').should('exist') + }); + + + it('Other Meeting Cards', () => { + cy.get('[data-testid="EventTypesCard-others"]').should('exist') + cy.get('[data-testid="Meeting-heading"]').should('exist') + cy.get('[ data-testid="Meeting-paragraph"]').should('exist') + cy.get('[ data-testid="Meeting-host"]').should('exist') + cy.get('[ data-testid="Meeting-link"]').should('exist') + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/community/index.cy.js b/cypress/test/pages/community/index.cy.js new file mode 100644 index 00000000000..7eb0b28b3ff --- /dev/null +++ b/cypress/test/pages/community/index.cy.js @@ -0,0 +1,68 @@ +import MockApp from "../../../utils/MockApp"; +import CommunityIndexPage from "../../../../pages/community"; + +describe('CommunityIndexPage', () => { + beforeEach(() => { + cy.mount() + }); + + it('displays the page title & check for first Community Home Card', () => { + cy.contains('AsyncAPI Community Meetings'); + cy.get('[data-testid="CommunityIndex-HomeCard"]').should('exist') + cy.get('[data-testid="HomeCard-main"]').contains('Thanking our AsyncAPI Ambassadors') + cy.get('[data-testid="HomeCard-title"]').contains('Ambassador Programs') + cy.get(`[href="/community/ambassadors"]`).should('exist'); + cy.get('[data-testid="HomeCard-button"]').should('exist'); + cy.get(".bg-ambassador").should('exist') + }); + + it('checks for CommunityIndex Display Card', () => { + cy.get('[data-testid="CommunityIndex-IssuesCard"]').should('exist') + cy.get('[data-testid="Card-lg-bg"]').should('have.class', 'bg-code-editor-dark') + cy.get('[data-testid="Card-lg-tagline"]').should('have.class', 'bg-pink-100') + cy.get('[data-testid="Card-heading-lg"]').should('exist'); + cy.get('[data-testid="Card-desc-lg"]').should('exist'); + cy.get(`[href="/community/dashboard"]`).should('exist'); + }); + + it('should display the Newsroom Card', () => { + cy.get('[data-testid="CommunityIndex-Newsroom-Card"]').should('exist'); + cy.get('[data-testid="Card-lg-bg"]').should('have.class', 'bg-code-editor-dark'); + cy.get('[data-testid="Card-lg-tagline"]').should('have.class', 'bg-pink-100'); + cy.get('[data-testid="Card-heading-lg"]').should('exist'); + cy.get('[data-testid="Card-desc-lg"]').should('exist'); + cy.get('[href="/community/newsroom"]').should('exist'); + }); + + it('should display the Toolings Card', () => { + cy.get('[data-testid="CommunityIndex-Toolings-Card"]').should('exist'); + cy.get('[data-testid="Card-lg-tagline"]').should('exist') + cy.get('[data-testid="Card-heading-lg"]').should('exist') + cy.get('[data-testid="Card-desc-lg"]').should('exist') + cy.get('[href="/tools"]').should('exist'); + }); + + it('should display other cards correctly', () => { + cy.get('[data-testid="CommunityCards-Goals"]').should('exist'); + cy.get('[href="https://github.com/asyncapi/community/discussions/513"]').should('exist'); + cy.get('[data-testid="CommunityCards-Contributors"]').should('exist'); + cy.get('[href="https://github.com/orgs/asyncapi/discussions/593"]').should('exist'); + cy.get('[data-testid="CommunityCards-TSC"]').should('exist'); + cy.get('[href="/community/tsc"]').should('exist'); + }); + + it('should display slack card ', () => { + cy.get('[data-testid="CommunityCards-Slack"]').should('exist'); + cy.get('[data-testid="CommunityIndex-HomeCard"]').should('exist') + cy.get('[data-testid="HomeCard-main"]').contains('All community info, tracked') + cy.get('[data-testid="HomeCard-title"]').contains('AsyncAPI Slack') + cy.get(`[href="https://asyncapi.com/slack-invite"]`).should('exist'); + cy.get('[data-testid="HomeCard-button"]').should('exist'); + cy.get(".bg-channelCover").should('exist') + }); + + it('should display NewsletterSubscribe', () => { + cy.get('[data-testid="CommunityCard-subscribe"]').should('exist'); + cy.get('[data-testid="NewsletterSubscribe-main"]').should('exist'); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/community/newsroom.cy.js b/cypress/test/pages/community/newsroom.cy.js new file mode 100644 index 00000000000..b3b11e3ea5f --- /dev/null +++ b/cypress/test/pages/community/newsroom.cy.js @@ -0,0 +1,13 @@ +import MockApp from "../../../utils/MockApp"; +import { mount } from "@cypress/react"; +import NewsroomSection from '../../../../pages/community/newsroom' + +describe('Test for Newsroom Section Pages', () => { + it('renders correctly', () => { + mount( + + + + ); + }); +}); \ No newline at end of file diff --git a/cypress/test/pages/community/tsc.cy.js b/cypress/test/pages/community/tsc.cy.js new file mode 100644 index 00000000000..8b1bcdfb2df --- /dev/null +++ b/cypress/test/pages/community/tsc.cy.js @@ -0,0 +1,58 @@ +import MockApp from "../../../utils/MockApp"; +import TSC from '../../../../pages/community/tsc' + +describe('TSC', () => { + beforeEach(() => { + cy.mount() + }); + + it('displays basic TSC ', () => { + cy.get('[data-testid="TSC-content"]').should('exist'); + cy.get(`[href="https://github.com/asyncapi/community/blob/master/TSC_MEMBERSHIP.md"]`).should('exist'); + cy.get('[data-testid="TSC-Governance-Link"]').should('have.attr', 'href', 'https://github.com/asyncapi/community/blob/master/CHARTER.md') + cy.get('[data-testid="TSC-Article-Link"]').should('have.attr', 'href', 'https://www.asyncapi.com/blog/governance-motivation') + cy.get('[data-testid="NewsletterSubscribe-main"]').should('exist') + }); + + it("should display TSC members", () => { + // Check if the "Current TSC members" section is visible + cy.contains("Current TSC members").should("be.visible"); + + // Check if each TSC member card contains the required information + cy.get('[data-testid="UserInfo-list"]').each((member) => { + cy.wrap(member).within(() => { + // Check if the user's name and avatar are visible + cy.get('[data-testid="UserInfo-avatar"]').should("be.visible"); + cy.get('[data-testid="UserInfo-name"]').should("be.visible"); + + // Check if the user's work status is visible + cy.get('[data-testid="status-element"]').should("be.visible"); + + // Check if the social links are visible + cy.get('[data-testid="Social-Links"]').should("have.length.gt", 0); + cy.get('[data-testid="Repo-Links"]').should("have.length.gt", 0); + }); + }); + + }); + + it("should have valid social links", () => { + // Check if each TSC member card's social links are valid + cy.get('[data-testid="UserInfo-list"]').each((member) => { + cy.wrap(member).within(() => { + cy.get('[data-testid="Social-Links"]').each((socialLink) => { + cy.wrap(socialLink) + .should("have.attr", "href") + .and("match", /^(https?:\/\/)/); + }); + }); + }); + }); + + it('displays Question Card ', () => { + cy.get('[data-testid="Question-card"]').should('exist'); + cy.get('[data-testid="Question-card-img"]').should('exist'); + cy.get(`[href="https://github.com/asyncapi/community/blob/master/TSC_MEMBERSHIP.md"]`).should('exist'); + }); +}); + diff --git a/cypress/utils/MockApp.js b/cypress/utils/MockApp.js new file mode 100644 index 00000000000..31558164c39 --- /dev/null +++ b/cypress/utils/MockApp.js @@ -0,0 +1,33 @@ +/** + * This file is use to mock the root "_app.js" , so that cypress could directly access refs , contexts and scripts present + * in the "Head" tags , thus by wrapping up pages into MockApp we enable to cypress to access routes , and can mount the + * required pages easily. + */ + +import AppContext from "../../context/AppContext"; +import { MDXProvider } from "../../components/MDX"; +import Layout from "../../components/layout/Layout"; +import AlgoliaSearch from "../../components/AlgoliaSearch"; +import { createRouter } from "./router"; +import MockRouter from "./router"; + +import Head from "next/head"; + +export default function MockApp({ children }) { + return ( + + + + + + +
    + + {children} + +
    +     +     +     + ) +} \ No newline at end of file diff --git a/cypress/utils/router.js b/cypress/utils/router.js index a02a93219b5..f77ae5e4003 100644 --- a/cypress/utils/router.js +++ b/cypress/utils/router.js @@ -1,7 +1,12 @@ +/** + * This file is use to mock the useRouter hook from next.js which is not available otherwise in cypress and enables + * cypress to access router properties like asPath and links. + */ + import React from 'react'; import { RouterContext } from 'next/dist/shared/lib/router-context'; -const createRouter = (params) => ({ +export const createRouter = (params) => ({ route: '/', pathname: '/', query: {}, diff --git a/pages/community/ambassadors/index.js b/pages/community/ambassadors/index.js index a68f9cbd5e6..f8e5f358322 100644 --- a/pages/community/ambassadors/index.js +++ b/pages/community/ambassadors/index.js @@ -9,7 +9,7 @@ import ambassadorList from '../../../config/ambassador_lists.json' import Link from 'next/link'; -function addAdditionalUserInfo(user) { +export function addAdditionalUserInfo(user) { const userData = { ...user, }; @@ -43,9 +43,9 @@ function Index() { image={image} wide > -
    -
    -

    +
    +
    +

    Teachers. Champions.{' '} Ambassadors!

    @@ -58,7 +58,7 @@ function Index() { Become an AsyncAPI Ambassador and help the OSS community build the future of APIs. -
    +
    -
    +
    AsyncAPI Ambassador Contributions @@ -102,6 +102,7 @@ function Index() {
  • Learn and share knowledge with community members -
    +
    {asyncapiAmbassadors.map((ambassador, i) => (
    + data-testid="Ambassadors-members" + >
    -
    +
    {ambassador.name}
    -
    {ambassador.country}
    +
    {ambassador.country}
    -
    +
    {ambassador.name}
    {ambassador.bio}
    -
    +
    Twitter ↗ @@ -191,7 +194,7 @@ function Index() {
    -
    +
    Tokens of our appreciation
    -
    +
    diff --git a/pages/community/events/index.js b/pages/community/events/index.js index f6d372db1cd..c1f46e167af 100644 --- a/pages/community/events/index.js +++ b/pages/community/events/index.js @@ -1,6 +1,5 @@ /* eslint-disable react/no-unescaped-entities */ import React, { useState } from 'react'; -import moment from 'moment'; import GoogleCalendarButton from '../../../components/buttons/GoogleCalendarButton'; import ICSFileButton from '../../../components/buttons/ICSFileButton'; import Heading from '../../../components/typography/Heading'; @@ -12,13 +11,10 @@ import Meeting from '../../../components/Meeting'; import NewsletterSubscribe from '../../../components/NewsletterSubscribe'; import TextLink from '../../../components/typography/TextLink'; import meetings from '../../../config/meetings.json'; -import AnnouncementHero from '../../../components/campaigns/AnnoucementHero'; - - import Paragraph from '../../../components/typography/Paragraph'; import { getEvents } from '../../../lib/staticHelpers'; -function index() { +function Eventindex() { const image = '/img/social/community-events.webp'; const [events, setEvents] = useState(getEvents(meetings)); @@ -29,13 +25,13 @@ function index() { image={image} wide > -
    +
    -

    +

    Join an AsyncAPI event from anywhere in the world.

    -
    +
    - conf-logo -
    - Watch now + Watch now
    @@ -120,7 +116,7 @@ function index() {
    -
    +
    Event Types @@ -130,7 +126,7 @@ function index() {
    -
    +
    -
    +
    -
    +
    -
    +
    -
    -
    +
    +
    -
    +
    -
    +
    -
    +
    -
    +
    -
    +
    -
    +
    -
    +
    diff --git a/pages/community/tsc.js b/pages/community/tsc.js index c42f53b6588..6d2b0c4c72b 100644 --- a/pages/community/tsc.js +++ b/pages/community/tsc.js @@ -51,7 +51,7 @@ export default function TSC() { wide >
  • -