diff --git a/components/Modal.js b/components/Modal.js index 7eb425a9dd2..a7fb153c9d6 100644 --- a/components/Modal.js +++ b/components/Modal.js @@ -22,8 +22,8 @@ export default function Modal({ } return ( -
-
+
+

{title}

-
+
{children}
diff --git a/components/OpenAPIComparison.js b/components/OpenAPIComparison.js index a556c7b6a17..14cb59391a5 100644 --- a/components/OpenAPIComparison.js +++ b/components/OpenAPIComparison.js @@ -15,41 +15,41 @@ export default function OpenAPIComparison({ className = '' }) { }); return ( -
+

OpenAPI 3.0

-
setHoverState(prevState => ({ ...prevState, Info: true }))} onMouseLeave={() => setHoverState({ ...hoverState, Info: false })}> +
setHoverState(prevState => ({ ...prevState, Info: true })) } onMouseLeave={ () => setHoverState({ ...hoverState, Info: false }) } data-testid="OpenAPI-sec-info"> Info
-
setHoverState(prevState => ({ ...prevState, Servers: true }))} onMouseLeave={() => setHoverState({ ...hoverState, Servers: false })}> +
setHoverState(prevState => ({ ...prevState, Servers: true })) } onMouseLeave={ () => setHoverState({ ...hoverState, Servers: false }) } data-testid="OpenAPI-sec-servers"> Servers
Security
-
setHoverState(prevState => ({ ...prevState, Paths: true }))} onMouseLeave={() => setHoverState({ ...hoverState, Paths: false })}> +
setHoverState(prevState => ({ ...prevState, Paths: true })) } onMouseLeave={ () => setHoverState({ ...hoverState, Paths: false }) } data-testid="OpenAPI-paths"> Paths
-
{ return setHoverState(prevState => ({ ...prevState, PathItem: true })) }} onMouseLeave={() => { return setHoverState({ ...hoverState, PathItem: false }) }}> +
{ return setHoverState(prevState => ({ ...prevState, PathItem: true })) } } onMouseLeave={ () => { return setHoverState({ ...hoverState, PathItem: false }) } } data-testid="OpenAPI-path-item"> Path Item
-
setHoverState(prevState => ({ ...prevState, Summary: true }))} onMouseLeave={() => { return setHoverState({ ...hoverState, Summary: false }) }}> +
setHoverState(prevState => ({ ...prevState, Summary: true })) } onMouseLeave={ () => { return setHoverState({ ...hoverState, Summary: false }) } } data-testid="OpenAPI-summary"> Summary and description
-
setHoverState(prevState => ({ ...prevState, Operation: true }))} onMouseLeave={() => setHoverState({ ...hoverState, Operation: false })}> +
setHoverState(prevState => ({ ...prevState, Operation: true })) } onMouseLeave={ () => setHoverState({ ...hoverState, Operation: false }) } data-testid="OpenAPI-operation"> Operation (GET, PUT, POST, etc.)
-
setHoverState(prevState => ({ ...prevState, Message: true }))} onMouseLeave={() => setHoverState({ ...hoverState, Message: false })}> +
setHoverState(prevState => ({ ...prevState, Message: true })) } onMouseLeave={ () => setHoverState({ ...hoverState, Message: false }) } data-testid="OpenAPI-request"> Request
-
setHoverState(prevState => ({ ...prevState, Message: true }))} onMouseLeave={() => setHoverState({ ...hoverState, Message: false })}> +
setHoverState(prevState => ({ ...prevState, Message: true })) } onMouseLeave={ () => setHoverState({ ...hoverState, Message: false }) } data-testid="OpenAPI-responses"> Responses
@@ -60,14 +60,14 @@ export default function OpenAPIComparison({ className = '' }) {
-
setHoverState(prevState => ({ ...prevState, Tags: true }))} onMouseLeave={() => setHoverState({ Tags: false })}> +
setHoverState(prevState => ({ ...prevState, Tags: true })) } onMouseLeave={ () => setHoverState({ Tags: false }) } data-testid="OpenAPI-tags">

Tags

-
setHoverState(prevState => ({ ...prevState, External: true }))} onMouseLeave={() => setHoverState({ External: false })}> +
setHoverState(prevState => ({ ...prevState, External: true })) } onMouseLeave={ () => setHoverState({ External: false }) } data-testid="OpenAPI-external">

External Docs

-
setHoverState(prevState => ({ ...prevState, Components: true }))} onMouseLeave={() => setHoverState({ Components: false })}> +
setHoverState(prevState => ({ ...prevState, Components: true })) } onMouseLeave={ () => setHoverState({ Components: false }) } data-testid="OpenAPI-components"> Components
@@ -101,32 +101,32 @@ export default function OpenAPIComparison({ className = '' }) {

AsyncAPI 2.0

-
setHoverState(prevState => ({ ...prevState, Info: true }))} onMouseLeave={() => setHoverState({ Info: false })}> +
setHoverState(prevState => ({ ...prevState, Info: true })) } onMouseLeave={ () => setHoverState({ Info: false }) }> Info
-
setHoverState(prevState => ({ ...prevState, Servers: true }))} onMouseLeave={() => setHoverState({ Servers: false })}> +
setHoverState(prevState => ({ ...prevState, Servers: true })) } onMouseLeave={ () => setHoverState({ Servers: false }) }> Servers (hosts + security)
-
setHoverState(prevState => ({ ...prevState, Paths: true }))} onMouseLeave={() => setHoverState({ Paths: false })}> +
setHoverState(prevState => ({ ...prevState, Paths: true })) } onMouseLeave={ () => setHoverState({ Paths: false }) }> Channel
-
setHoverState(prevState => ({ ...prevState, PathItem: true }))} onMouseLeave={() => setHoverState({ PathItem: false })}> +
setHoverState(prevState => ({ ...prevState, PathItem: true })) } onMouseLeave={ () => setHoverState({ PathItem: false }) }> Channel Item
-
setHoverState(prevState => ({ ...prevState, Operation: true }))} onMouseLeave={() => setHoverState({ Operation: false })}> +
setHoverState(prevState => ({ ...prevState, Operation: true })) } onMouseLeave={ () => setHoverState({ Operation: false }) }> Operation (Publish and Subscribe)
-
setHoverState(prevState => ({ ...prevState, Summary: true }))} onMouseLeave={() => setHoverState({ Summary: false })} > +
setHoverState(prevState => ({ ...prevState, Summary: true })) } onMouseLeave={ () => setHoverState({ Summary: false }) } > Summary, description, tags, etc.
-
setHoverState(prevState => ({ ...prevState, Message: true }))} onMouseLeave={() => setHoverState({ Message: false })}> +
setHoverState(prevState => ({ ...prevState, Message: true })) } onMouseLeave={ () => setHoverState({ Message: false }) }> Message
@@ -150,14 +150,14 @@ export default function OpenAPIComparison({ className = '' }) {
-
setHoverState(prevState => ({ ...prevState, Tags: true }))} onMouseLeave={() => setHoverState({ Tags: false })}> +
setHoverState(prevState => ({ ...prevState, Tags: true })) } onMouseLeave={ () => setHoverState({ Tags: false }) }>

Tags

-
setHoverState(prevState => ({ ...prevState, External: true }))} onMouseLeave={() => setHoverState({ External: false })}> +
setHoverState(prevState => ({ ...prevState, External: true })) } onMouseLeave={ () => setHoverState({ External: false }) }>

External Docs

-
setHoverState(prevState => ({ ...prevState, Components: true }))} onMouseLeave={() => setHoverState({ Components: false })}> +
setHoverState(prevState => ({ ...prevState, Components: true })) } onMouseLeave={ () => setHoverState({ Components: false }) }> Components
diff --git a/components/campaigns/AnnoucementHero.js b/components/campaigns/AnnoucementHero.js index 88928285b52..81fce0c2c54 100644 --- a/components/campaigns/AnnoucementHero.js +++ b/components/campaigns/AnnoucementHero.js @@ -28,15 +28,15 @@ export default function AnnouncementHero({ className = '', small = false, hideVi
+ typeStyle="heading-lg" > AsyncAPI Conf on Tour 2023 +
diff --git a/components/campaigns/AnnouncementRamainingDays.js b/components/campaigns/AnnouncementRamainingDays.js index df521333ad2..7584dbc6e79 100644 --- a/components/campaigns/AnnouncementRamainingDays.js +++ b/components/campaigns/AnnouncementRamainingDays.js @@ -17,7 +17,7 @@ export default function AnnouncementRemainingDays({ dateTime, eventName }) { } return ( - + {text} until {eventName} ) diff --git a/components/campaigns/Banner.js b/components/campaigns/Banner.js index 1942a7f28d5..28e309ce9ef 100644 --- a/components/campaigns/Banner.js +++ b/components/campaigns/Banner.js @@ -19,8 +19,8 @@ export default function Banner({}) { } return ( -
-
+
+

@@ -37,7 +37,7 @@ export default function Banner({}) {

-
- - + +
-
+
- + {post.authors.map((author, index) => author.link ? { e.stopPropagation() }} target="_blank" rel="noreferrer">{author.name} : author.name).reduce((prev, curr) => [prev, ' & ', curr])} - diff --git a/components/newsroom/Newsroom.js b/components/newsroom/Newsroom.js index 59f9ef9f29b..6d8a64bd134 100644 --- a/components/newsroom/Newsroom.js +++ b/components/newsroom/Newsroom.js @@ -10,7 +10,7 @@ import TextLink from '../typography/TextLink' export default function Newsroom() { return ( <> -
+
-
+
From the blog @@ -33,14 +33,14 @@ export default function Newsroom() { Check out these articles written by community members -
+
Read all blog posts
-
+
@@ -55,7 +55,7 @@ export default function Newsroom() { Read about what people are
saying about AsyncAPI -
+
Follow us on Twitter @@ -72,7 +72,7 @@ export default function Newsroom() {
-
+
Watch our latest videos and live streams on the AsyncAPI YouTube channel -
+
Visit our YouTube channel diff --git a/components/newsroom/NewsroomArticle.js b/components/newsroom/NewsroomArticle.js index c85d4631e7f..6e75beaba0b 100644 --- a/components/newsroom/NewsroomArticle.js +++ b/components/newsroom/NewsroomArticle.js @@ -5,27 +5,28 @@ import articlesData from '../../config/articles.json'; export default function NewsroomArticle() { return ( ); } diff --git a/components/newsroom/NewsroomBlogPosts.js b/components/newsroom/NewsroomBlogPosts.js index ed2fc1dc07b..d4f10d8564d 100644 --- a/components/newsroom/NewsroomBlogPosts.js +++ b/components/newsroom/NewsroomBlogPosts.js @@ -27,7 +27,7 @@ export default function NewsroomBlogPosts() { const buttonClass = 'shadow-md rounded border mx-2 mb-2 focus:outline-none'; return ( -
+
- -
diff --git a/components/newsroom/NewsroomSection.js b/components/newsroom/NewsroomSection.js index c3d75b3693a..e37658f715c 100644 --- a/components/newsroom/NewsroomSection.js +++ b/components/newsroom/NewsroomSection.js @@ -18,21 +18,21 @@ export default function NewsroomSection() { .slice(0, 1); return (
-
+
-
+
Latest news and blogs Welcome to our Newsroom section. Here, you'll get latest information about our blogs, articles, announcements and Youtube live-streams. Let's get upto date with the recent activities in the organization. -
-
diff --git a/components/newsroom/NewsroomYoutube.js b/components/newsroom/NewsroomYoutube.js index d3c17f1545f..e3530d1942f 100644 --- a/components/newsroom/NewsroomYoutube.js +++ b/components/newsroom/NewsroomYoutube.js @@ -17,7 +17,7 @@ export default function NewsroomYoutube({ className = '' }) { const buttonClass = 'shadow-md rounded border mx-2 mb-2 focus:outline-none'; return ( -
+
- -
diff --git a/components/newsroom/YouTubeCard.js b/components/newsroom/YouTubeCard.js index bf890438e83..4eb8eb35c44 100644 --- a/components/newsroom/YouTubeCard.js +++ b/components/newsroom/YouTubeCard.js @@ -9,13 +9,13 @@ export default function YouTubeCard({ video }) {
  • - video -
    +
    {video.title} diff --git a/cypress/test/AlgoliaSearch.cy.js b/cypress/test/AlgoliaSearch.cy.js new file mode 100644 index 00000000000..21d2654a6d2 --- /dev/null +++ b/cypress/test/AlgoliaSearch.cy.js @@ -0,0 +1,27 @@ +import { mount } from 'cypress/react' +import AlgoliaSearch from '../../components/AlgoliaSearch' +import { SearchButton } from '../../components/AlgoliaSearch'; +import { DocSearchModal } from '@docsearch/react' + +describe('AlgoliaSearch component', () => { + it('renders without errors', () => { + mount( + + Search + + ) + }) + + it('performs search for a specific page', () => { + mount( + + Open Search + + ); + cy.get('button').click(); // Open the search modal + cy.get('input[placeholder="Search resources"]').type('welcome') + cy.should('have.value', 'welcome') + // Check if the docsearch-list element contains the text 'Welcome' + cy.get('#docsearch-list').contains('Welcome') + }); +}); \ No newline at end of file diff --git a/cypress/test/ComponentName.cy.js b/cypress/test/ComponentName.cy.js deleted file mode 100644 index 86b150606a2..00000000000 --- a/cypress/test/ComponentName.cy.js +++ /dev/null @@ -1,5 +0,0 @@ -describe('ComponentName.cy.js', () => { - it('playground', () => { - // cy.mount() - }) -}) \ No newline at end of file diff --git a/cypress/test/GeneratorInstallation.cy.js b/cypress/test/GeneratorInstallation.cy.js new file mode 100644 index 00000000000..0428284badf --- /dev/null +++ b/cypress/test/GeneratorInstallation.cy.js @@ -0,0 +1,8 @@ +import { mount } from 'cypress/react'; +import GeneratorInstallation from '../../components/GeneratorInstallation'; + +describe('GeneratorInstallation', () => { + it('renders without errors', () => { + mount(); + }); +}); \ No newline at end of file diff --git a/cypress/test/OpenAPIComparison.cy.js b/cypress/test/OpenAPIComparison.cy.js new file mode 100644 index 00000000000..86de5e2dd51 --- /dev/null +++ b/cypress/test/OpenAPIComparison.cy.js @@ -0,0 +1,57 @@ +import { mount } from '@cypress/react' +import OpenAPIComparison from '../../components/OpenAPIComparison' + +describe('OpenAPIComparison', () => { + it('renders without errors', () => { + mount(); + + }); + + it('changes background color on hover', () => { + mount(); + + // Hover over the "Info" element + cy.contains('Info').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-sec-info"]').should('exist'); + + // Hover over the "Servers" element + cy.contains('Servers').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-sec-servers"]').should('exist'); + + // Hover over the "Paths" element + cy.contains('Paths').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-paths"]').should('exist'); + + // Hover over the "Path Item" element + cy.contains('Path Item').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-path-item"]').should('exist'); + + // Hover over the "Summary and description" element + cy.contains('Summary and description').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-summary"]').should('exist'); + + // Hover over the "Operation (GET, PUT, POST, etc.)" element + cy.contains('Operation (GET, PUT, POST, etc.)').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-operation"]').should('exist'); + + // Hover over the "Request" element + cy.contains('Request').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-request"]').should('exist'); + + // Hover over the "Responses" element + cy.contains('Responses').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-responses"]').should('exist'); + + // Hover over the "Tags" element + cy.contains('Tags').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-tags"]').should('exist'); + + // Hover over the "External Docs" element + cy.contains('External Docs').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-external"]').should('exist'); + + // Hover over the "Components" element + cy.contains('Components').trigger('mouseover'); + cy.get('[data-testid="OpenAPI-components"]').should('exist'); + }); +}); diff --git a/cypress/test/campaignTests/AnnouncementHero.cy.js b/cypress/test/campaignTests/AnnouncementHero.cy.js new file mode 100644 index 00000000000..d2eeb1ddeba --- /dev/null +++ b/cypress/test/campaignTests/AnnouncementHero.cy.js @@ -0,0 +1,55 @@ +import React from 'react'; +import { mount } from '@cypress/react'; +import AnnouncementHero from '../../../components/campaigns/AnnoucementHero'; +beforeEach(() => { + mount(); +}); + + +describe('AnnouncementHero Component', () => { + it('should render the component when the date is within the valid range', () => { + // Set the current date to May + const mockDate = new Date('2023-05-01T00:00:00Z'); + cy.clock(mockDate.getTime()); + // Assert that the component is rendered + //check for background color + cy.get('[data-testid="AnnouncementHero-main-div"]').should('have.class', 'bg-gray-50'); + }); + + it('should display the correct event information', () => { + const mockDate = new Date('2023-05-01T00:00:00Z'); + cy.clock(mockDate.getTime()); + // Assert the event details + cy.get('[data-testid="AnnouncementHero-main-div"]').contains('AsyncAPI Conf on Tour 2023').should('exist'); + cy.get('[data-testid="AnnouncementHero-main-div"]').contains('London Edition').should('exist'); + cy.get('[data-testid="AnnouncementHero-main-div"]').contains('20th of September, 2023 | London, UK').should('exist'); + cy.contains('Submit a session').should('exist'); + }); + + it('should have a link to submit a session', () => { + const mockDate = new Date('2023-05-01T00:00:00Z'); + cy.clock(mockDate.getTime()); + // Assert the link + cy.get('[data-testid="AnnouncementHero-submit-session"]').should('have.attr', 'href', 'https://conference.asyncapi.com/') + .should('have.attr', 'target', '_blank') + .contains('Submit a session'); + }); + //check if announcement rendered is small or large . + it('should render a small announcement when "small" prop is true', () => { + const mockDate = new Date('2023-05-01T00:00:00Z'); + cy.clock(mockDate.getTime()); + + mount(); + + cy.get('[data-testid="AnnouncementHero-main-div"]').should('have.class', 'mb-4'); + }); + + it('should render a large announcement when "small" prop is false', () => { + const mockDate = new Date('2023-05-01T00:00:00Z'); + cy.clock(mockDate.getTime()); + + mount(); + + cy.get('[data-testid="AnnouncementHero-main-div"]').should('have.class', 'mx-3 mt-3 p-3 mb-6'); + }); +}); diff --git a/cypress/test/campaignTests/AnnouncementRemainingDays.cy.js b/cypress/test/campaignTests/AnnouncementRemainingDays.cy.js new file mode 100644 index 00000000000..783788c6214 --- /dev/null +++ b/cypress/test/campaignTests/AnnouncementRemainingDays.cy.js @@ -0,0 +1,38 @@ +import moment from 'moment'; +import { mount } from '@cypress/react'; +import AnnouncementRemainingDays from '../../../components/campaigns/AnnouncementRamainingDays'; + +describe('AnnouncementRemainingDays', () => { + it('displays correct countdown text', () => { + const dateTime = moment().add(2, 'days').toISOString(); // Set the dateTime value as desired + const eventName = 'Your Event'; // Set the eventName as desired + + mount(); + + const date = moment(dateTime); + const now = moment(); + const days = date.diff(now, 'days'); + + let text; + if (days >= 1) { + text = `${days} ${days === 1 ? 'day' : 'days'}`; + } else { + const hours = date.diff(now, 'hours'); + if (hours > 1) { + text = 'A few hours'; + } else { + const minutes = date.diff(now, 'minutes'); + if (minutes > 1) { + text = 'A few minutes'; + } + } + } + + cy.get('[data-testid="AnnouncementRemainingDays-text"]').should('have.text', `${text} until ${eventName}`); + + //check class font-extrabold + cy.get('[data-testid="AnnouncementRemainingDays-text"]').should('have.class', 'font-extrabold'); + }); +}); + +/// Make sure to adjust the dateTime and eventName variables as needed for your specific testcase \ No newline at end of file diff --git a/cypress/test/campaignTests/Banner.cy.js b/cypress/test/campaignTests/Banner.cy.js new file mode 100644 index 00000000000..670384d7bf9 --- /dev/null +++ b/cypress/test/campaignTests/Banner.cy.js @@ -0,0 +1,50 @@ +import React from 'react'; +import { mount } from '@cypress/react'; +import Banner from '../../../components/campaigns/Banner'; + +describe('Banner Component', () => { + it('should not render the banner when the date is not within the valid range', () => { + const today = new Date(); + const [day, month, year] = [today.getUTCDate(), today.getUTCMonth(), today.getUTCFullYear()]; + if (year > 2022 || month !== 10 || day < 6) { + mount(); + cy.get('[data-testid="Banner-main-div"]').should('not.exist'); + + } else { + mount(); + cy.get('[data-testid="Banner-main-div"]').should('be.visible'); + + } + }); + + it('should render the banner when the date is within the valid range', () => { + const mockDate = new Date(2021, 10, 12).getTime(); + cy.clock(mockDate); + mount(); + cy.get('[data-testid="Banner-main-div"]').should('be.visible'); + }); + + it('should display the correct message when the date is within the valid range', () => { + const mockDate = new Date(2021, 10, 12).getTime(); + cy.clock(mockDate); + mount(); + cy.contains('.font-medium', 'AsyncAPI Conference 2022 has ended').should('be.visible'); + }); + + it('should have a link to the recordings playlist', () => { + const mockDate = new Date(2021, 10, 12).getTime(); + cy.clock(mockDate); + mount(); + cy.get('[data-testid="Banner-link"]') + .should('have.attr', 'href', 'https://www.youtube.com/playlist?list=PLbi1gRlP7pijRiA32SU36hD_FW-2qyPhl') + .should('have.attr', 'target', '_blank') + .should('have.attr', 'rel', 'noopener noreferrer'); + }); + + it('should have the max-w-screen-xl class in the div element', () => { + const mockDate = new Date(2021, 10, 12).getTime(); + cy.clock(mockDate); + mount(); + cy.get('.max-w-screen-xl').should('exist'); + }); +}); diff --git a/cypress/test/mockData/blogmockData.js b/cypress/test/mockData/blogmockData.js new file mode 100644 index 00000000000..4b1f28eb65f --- /dev/null +++ b/cypress/test/mockData/blogmockData.js @@ -0,0 +1,250 @@ +export const post = { + "title": "Awesome 2020 and What Can Get Better In 2021", + "date": "2020-12-23T05:00:00.000Z", + "type": "Communication", + "tags": [ + "Project Status" + ], + "cover": "/img/posts/2020-summary/cover.webp", + "authors": [ + { + "name": "Lukasz Gornicki", + "photo": "/img/avatars/lpgornicki.webp", + "link": "https://twitter.com/derberq", + "byline": "AsyncAPI Maintainer and Dev Comm Keeper" + } + ], + "excerpt": "Fuck you COVID-19, AsyncAPI Community is stronger than you think. See the growth of AsyncAPI in 2020 in hard numbers. How we compare to 2019?", + "toc": [ + { + "content": "Important moments", + "slug": "important-moments", + "lvl": 2, + "i": 0, + "seen": 0 + }, + { + "content": "Slack", + "slug": "slack", + "lvl": 2, + "i": 1, + "seen": 0 + }, + { + "content": "Numbers getting high", + "slug": "numbers-getting-high", + "lvl": 3, + "i": 2, + "seen": 0 + }, + { + "content": "Most present companies", + "slug": "most-present-companies", + "lvl": 3, + "i": 3, + "seen": 0 + }, + { + "content": "What's next with Slack", + "slug": "whats-next-with-slack", + "lvl": 3, + "i": 4, + "seen": 0 + }, + { + "content": "LinkedIn", + "slug": "linkedin", + "lvl": 2, + "i": 5, + "seen": 0 + }, + { + "content": "Followers and impressions", + "slug": "followers-and-impressions", + "lvl": 3, + "i": 6, + "seen": 0 + }, + { + "content": "Sponsored marketing", + "slug": "sponsored-marketing", + "lvl": 3, + "i": 7, + "seen": 0 + }, + { + "content": "What's next with LinkedIn", + "slug": "whats-next-with-linkedin", + "lvl": 3, + "i": 8, + "seen": 0 + }, + { + "content": "Google Analytics", + "slug": "google-analytics", + "lvl": 2, + "i": 9, + "seen": 0 + }, + { + "content": "Traffic got much higher", + "slug": "traffic-got-much-higher", + "lvl": 3, + "i": 10, + "seen": 0 + }, + { + "content": "Top referring channels", + "slug": "top-referring-channels", + "lvl": 3, + "i": 11, + "seen": 0 + }, + { + "content": "Top blog posts", + "slug": "top-blog-posts", + "lvl": 3, + "i": 12, + "seen": 0 + }, + { + "content": "What's next with the website", + "slug": "whats-next-with-the-website", + "lvl": 3, + "i": 13, + "seen": 0 + }, + { + "content": "Twitter", + "slug": "twitter", + "lvl": 2, + "i": 14, + "seen": 0 + }, + { + "content": "Paid marketing", + "slug": "paid-marketing", + "lvl": 3, + "i": 15, + "seen": 0 + }, + { + "content": "Top tweets", + "slug": "top-tweets", + "lvl": 3, + "i": 16, + "seen": 0 + }, + { + "content": "What's next with Twitter", + "slug": "whats-next-with-twitter", + "lvl": 3, + "i": 17, + "seen": 0 + }, + { + "content": "GitHub", + "slug": "github", + "lvl": 2, + "i": 18, + "seen": 0 + }, + { + "content": "Most popular repositories", + "slug": "most-popular-repositories", + "lvl": 3, + "i": 19, + "seen": 0 + }, + { + "content": "Traffic growth", + "slug": "traffic-growth", + "lvl": 3, + "i": 20, + "seen": 0 + }, + { + "content": "What's next with GitHub", + "slug": "whats-next-with-github", + "lvl": 3, + "i": 21, + "seen": 0 + }, + { + "content": "npm", + "slug": "npm", + "lvl": 2, + "i": 22, + "seen": 0 + }, + { + "content": "Top packages", + "slug": "top-packages", + "lvl": 3, + "i": 23, + "seen": 0 + }, + { + "content": "What's next with npm", + "slug": "whats-next-with-npm", + "lvl": 3, + "i": 24, + "seen": 0 + }, + { + "content": "YouTube", + "slug": "youtube", + "lvl": 2, + "i": 25, + "seen": 0 + }, + { + "content": "Watch time goes crazy", + "slug": "watch-time-goes-crazy", + "lvl": 3, + "i": 26, + "seen": 0 + }, + { + "content": "Most popular videos", + "slug": "most-popular-videos", + "lvl": 3, + "i": 27, + "seen": 0 + }, + { + "content": "What's next with YouTube", + "slug": "whats-next-with-youtube", + "lvl": 3, + "i": 28, + "seen": 0 + }, + { + "content": "Open Collective", + "slug": "open-collective", + "lvl": 2, + "i": 29, + "seen": 0 + }, + { + "content": "Ultimate questions - how many people use the spec?", + "slug": "ultimate-questions---how-many-people-use-the-spec", + "lvl": 2, + "i": 30, + "seen": 0 + }, + { + "content": "Final words", + "slug": "final-words", + "lvl": 2, + "i": 31, + "seen": 0 + } + ], + "readingTime": 18, + "sectionSlug": "/blog", + "sectionWeight": 0, + "id": "pages/blog/2020-summary.md", + "isIndex": false, + "slug": "/blog/2020-summary" +} \ No newline at end of file diff --git a/cypress/test/newsroom/FeaturedBlogItem.cy.js b/cypress/test/newsroom/FeaturedBlogItem.cy.js new file mode 100644 index 00000000000..ba7a7362ee2 --- /dev/null +++ b/cypress/test/newsroom/FeaturedBlogItem.cy.js @@ -0,0 +1,18 @@ +import { mount } from 'cypress/react' +import FeaturedBlogPost from '../../../components/newsroom/FeaturedBlogPost' +import { post } from '../mockData/blogmockData'; +describe('Features Component', () => { + it('renders without errors', () => { + mount(); + cy.get('[data-testid="FeaturedBlogPostItem-Link"]').should('have.attr', 'href', post.slug) + cy.get('[data-testid="FeaturedBlogPostItem-Img"]').should('have.attr', 'src', post.cover) + cy.get('[data-testid="FeaturedBlogPost-type"]').should('exist', post.type) + cy.get('[data-testid="FeaturedBlog-title"]').should('exist',post.title); + post.authors.forEach(author => { + cy.get('[data-testid="FeaturedBlogPost-AuthorName"]').should('exist',author.name) + }) + cy.get('[data-testid="FeaturedBlog-Authorimg"]').should('exist', post.authors) + cy.get('[data-testid="FeaturedBlogPost-date"]').should('exist', post.date) + cy.get('[data-testid="FeaturedBlogPost-RT"]').should('exist', post.readingTime) + }); +}); diff --git a/cypress/test/newsroom/Newsroom.cy.js b/cypress/test/newsroom/Newsroom.cy.js new file mode 100644 index 00000000000..6764307f6a0 --- /dev/null +++ b/cypress/test/newsroom/Newsroom.cy.js @@ -0,0 +1,24 @@ +import { mount } from 'cypress/react' +import Newsroom from '../../../components/newsroom/Newsroom' +const newsroomHeadings = ["Latest Updates","From the blog"] +describe('Newsroom Component', () => { + beforeEach(() => { + mount(); + }); + + it('renders without errors', () => { + cy.get('[data-testid="Newsroom-main"]').contains(newsroomHeadings[0]) + cy.get('[data-testid="Newsroom-sub-div"]').contains(newsroomHeadings[1]) + cy.get('[data-testid="Newsroom-Blog"]').should('exist') + }); + + it('checks link href', () => { + cy.get('[data-testid="Newsroom-Blog-Link"]').find('a').should('have.attr', 'href', '/blog') // Check the blog href attribute + cy.get('[ data-testid="Newsroom-Twitter-Link"]').find('a').should('have.attr', 'href', 'https://twitter.com/AsyncAPISpec') //check twitter + cy.get('[data-testid="Newsroom-Youtube"]').find('a').should('have.attr', 'href', 'https://www.youtube.com/c/AsyncAPI') //check youtube link + }); + + it('checks TwitterTimelineEmbed', () => { + cy.get('[data-testid="Newsroom-Twitter"]').should('exist'); // data-test was not working + }); +}); diff --git a/cypress/test/newsroom/NewsroomArticle.cy.js b/cypress/test/newsroom/NewsroomArticle.cy.js new file mode 100644 index 00000000000..bda9ddeff1a --- /dev/null +++ b/cypress/test/newsroom/NewsroomArticle.cy.js @@ -0,0 +1,14 @@ +import { mount } from 'cypress/react' +import NewsroomArticle from '../../../components/newsroom/NewsroomArticle' +import articlesData from '../../../config/articles.json' + +describe('Newsroom Article Component', () => { + it('renders without errors', () => { + mount(); + articlesData.forEach((article, index) => { + cy.get(`[data-testid="NewsroomArticle-${ index }"]`).should('have.attr', 'href', article.url); + cy.get(`[data-testid="NewsroomArticle-${ index }"]`).should('contain.text', article.title); + cy.get(`[data-testid="NewsroomArticle-${ index }"]`).should('contain.text', article.publishDate); + }); + }); +}); \ No newline at end of file diff --git a/cypress/test/newsroom/NewsroomBlogPost.cy.js b/cypress/test/newsroom/NewsroomBlogPost.cy.js new file mode 100644 index 00000000000..26f40c45aec --- /dev/null +++ b/cypress/test/newsroom/NewsroomBlogPost.cy.js @@ -0,0 +1,30 @@ +import { mount } from 'cypress/react' +import NewsroomBlogPosts from '../../../components/newsroom/NewsroomBlogPosts'; + +describe('Newsroom Article Component', () => { + beforeEach(() => { + mount(); + }); + + it('renders without errors', () => { + + }); + it('checks if swiper component is present', () => { + cy.get('[data-testid="NewsroomBlog-main-div"]').should('exist') + + }); + it('checks if the first slide is active', () => { + cy.get('.swiper-slide-active').should('exist') + }); + + it('checks if the second slide is active after clicking next', () => { + cy.get('[data-testid="Blog-Next-button"]').click({force: true }) + cy.get('.swiper-slide-active').should('exist') + }); + + it('slides to the previous slide', () => { + cy.get('[data-testid="Blog-Prev-button"]').click({force: true }) + cy.get('.swiper-slide-active').should('exist') + }); +}); + diff --git a/cypress/test/newsroom/NewsroomSection.cy.js b/cypress/test/newsroom/NewsroomSection.cy.js new file mode 100644 index 00000000000..a7d5b451de5 --- /dev/null +++ b/cypress/test/newsroom/NewsroomSection.cy.js @@ -0,0 +1,19 @@ +import { mount } from 'cypress/react' +import NewsroomSection from '../../../components/newsroom/NewsroomSection'; +const newsroom = ["Latest news and blogs"] +describe('Newsroom Section Component', () => { + beforeEach(() => { + mount(); + }); + + it('renders without errors', () => {}); + + it('check if Features Blog Post exists', () => { + cy.get('[data-testid="NewsroomSection-Featured"]').should('exist'); + }); + + it('check content of Newsroom component', () => { + cy.get('[data-testid="NewsroomSection-main"]').contains(newsroom[0]); + }) +}); + diff --git a/cypress/test/newsroom/NewsroomYoutube.cy.js b/cypress/test/newsroom/NewsroomYoutube.cy.js new file mode 100644 index 00000000000..21ffaee96bc --- /dev/null +++ b/cypress/test/newsroom/NewsroomYoutube.cy.js @@ -0,0 +1,27 @@ +import { mount } from 'cypress/react' +import NewsroomYoutube from '../../../components/newsroom/NewsroomYoutube'; + +describe('Newsroom Youtube', () => { + beforeEach(() => { + mount(); + }); + + it('renders without errors', () => {}); + + it('checks if swiper component is present', () => { + cy.get('[ data-testid="NewsroomYoutube-main"]').should('exist') + }); + + it('checks if the first slide is active', () => { + cy.get('.swiper-slide-active').should('exist') + }); + + it('slides to the next slide', () => { + cy.get('[data-testid="Youtube-Next-button"]').click({force: true }) + cy.get('.swiper-slide-active').should('exist') + }); + + it('slides to the previous slide', () => { + cy.get('[data-testid="Youtube-Prev-button"]').click({force: true }) + }); +}); \ No newline at end of file diff --git a/cypress/test/newsroom/YoutubeCard.cy.js b/cypress/test/newsroom/YoutubeCard.cy.js new file mode 100644 index 00000000000..130a200bd0a --- /dev/null +++ b/cypress/test/newsroom/YoutubeCard.cy.js @@ -0,0 +1,17 @@ +import { mount } from '@cypress/react' +import YouTubeCard from '../../../components/newsroom/YouTubeCard' + +const video = { + "image_url": "https://i.ytimg.com/vi/EvC2PZXEM0M/hqdefault.jpg", + "title": "Community Meeting, Tuesday June 27th 2023", + "description": "https://github.com/asyncapi/community/issues/762.", + "videoId": "EvC2PZXEM0M" +} + +describe('Youtube Card Component', () => { + it('renders without errors', () => { + mount(); + cy.get('[data-testid="YoutubeCard-main"]').contains(video.title); + cy.get('[data-testid="YoutubeCard-main"]').contains(video.description); + }); +}); \ No newline at end of file diff --git a/cypress/test/newsroom/swiper.cy.js b/cypress/test/newsroom/swiper.cy.js new file mode 100644 index 00000000000..e000cadd018 --- /dev/null +++ b/cypress/test/newsroom/swiper.cy.js @@ -0,0 +1,14 @@ +import { checkLastSnapIndex } from '../../../components/newsroom/swiper'; + +describe('checkLastSnapIndex', () => { + it('should check the last snap index correctly for different viewport widths', () => { + cy.viewport(1280, 720); // Set the viewport width to 1280px + const isLastSnapIndex1 = checkLastSnapIndex(3); + expect(isLastSnapIndex1).to.be.false; + + cy.viewport(640, 480); // Set the viewport width to 640px + const isLastSnapIndex2 = checkLastSnapIndex(4); + expect(isLastSnapIndex2).to.be.true; + }); + }); +