-
-
Notifications
You must be signed in to change notification settings - Fork 632
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: adding unit tests for InlineHelp ,MacWindow , Newsletter , Prof…
…ile ,Remember and Warning components (#1827) Co-authored-by: akshatnema <[email protected]>%0ACo-authored-by: Akshat Nema <[email protected]>
- Loading branch information
1 parent
bd4504a
commit 277288d
Showing
12 changed files
with
199 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| import React from 'react'; | ||
| import { mount } from 'cypress/react'; | ||
| import InlineHelp from '../../components/InlineHelp'; | ||
|
|
||
| describe('InlineHelp', () => { | ||
| it('toggles help text visibility on click and hover', () => { | ||
| const text = 'Helpful information'; | ||
| mount(<InlineHelp text={ text } />); | ||
| cy.get('[data-testid="InlineHelp"]').should('not.exist'); | ||
| // Click on the question mark icon to show text | ||
| cy.get('[data-testid="InlineHelp-icon"]').click(); | ||
| // Click on the question mark icon again to hide text | ||
| cy.get('[data-testid="InlineHelp-icon"]').click(); | ||
| // Hover the question mark icon to show text | ||
| cy.get('[data-testid="InlineHelp-icon"]').trigger('mouseover'); | ||
| // Move the cursor away from the question mark icon to hide text | ||
| cy.get('[data-testid="InlineHelp-icon"]').trigger('mouseout'); | ||
|
|
||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| import React from 'react'; | ||
| import { mount } from 'cypress/react'; | ||
| import MacWindow from '../../components/MacWindow'; | ||
|
|
||
| describe('MacWindow Component', () => { | ||
| it('renders the component props', () => { | ||
| const className = 'bg-code-editor-dark h-full border-gray-800 border shadow-lg transition-all duration-500 ease-in-out'; | ||
| const contentClassName = "text-left text-white text-sm font-mono font-medium transition-all duration-500 ease-in-out break-words md:min-h-108"; | ||
| const title="asyncapi.yaml"; | ||
| const children = 'This is the children component for testing can be replaced'; | ||
| mount( | ||
| <MacWindow | ||
| className={className} | ||
| contentClassName={contentClassName} | ||
| title={title} | ||
| > | ||
| {children} | ||
| </MacWindow> | ||
| ); | ||
| cy.get('[data-testid="MacWindow-main"]') | ||
| .should('have.class', className) | ||
| .within(() => { | ||
| cy.get('[data-testid="MacWindow-div"]').should('exist'); | ||
|
|
||
| cy.get('[data-testid="MacWindow-div"]').within(() => { | ||
| cy.get('div').should('have.length', 3); | ||
| }); | ||
| cy.get('[data-testid="MacWindow-title-div"]') | ||
| .should('exist') | ||
| .and('have.attr', 'title', title) | ||
| .and('have.text', title); | ||
| cy.get('[data-testid="MacWindow-title-center"]').should('exist').and('have.length', 1); | ||
| }); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| import React from 'react'; | ||
| import { mount } from 'cypress/react'; | ||
| import NewsletterSubscribe from '../../components/NewsletterSubscribe'; | ||
|
|
||
| describe('NewsletterSubscribe Component', () => { | ||
| it('renders the component with default props', () => { | ||
| mount(<NewsletterSubscribe />); | ||
|
|
||
| cy.get('[data-testid="NewsletterSubscribe-main"]').should('exist'); | ||
| cy.get('[data-testid="NewsletterSubscribe-text-input"]').type("name"); | ||
| cy.get('[data-testid="NewsletterSubscribe-email-input"]').type("[email protected]") | ||
| cy.get('form[name="form 1"]').should('exist'); | ||
| cy.get('input[name="type"]').should('exist'); | ||
| cy.get('input[name="name"]').should('exist'); | ||
| cy.get('input[name="email"]').should('exist'); | ||
|
|
||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| import React from 'react'; | ||
| import { mount } from 'cypress/react'; | ||
| import Profile from '../../components/Profile'; | ||
| describe('Profile Component', () => { | ||
| it('renders null when profiles array is empty', () => { | ||
| const props = { | ||
| profiles: [], | ||
| className: 'my-profiles', | ||
| }; | ||
| mount(<Profile {...props} />); | ||
| cy.get('[data-testid="Profiles-div"]').should('not.exist'); | ||
| }); | ||
|
|
||
| it('renders profile links and names when profiles array is not empty', () => { | ||
| const profiles = [ | ||
| { | ||
| name: 'Alejandra Quetzalli', | ||
| avatar: 'https://avatars.githubusercontent.com/alequetzalli', | ||
| link: 'https://github.com/alequetzalli' | ||
| }, | ||
| { | ||
| name: 'Azeez Elegbede', | ||
| avatar: 'https://avatars.githubusercontent.com/acethecreator', | ||
| link: 'https://github.com/acethecreator' | ||
| } | ||
| ]; | ||
| const props = { | ||
| profiles, | ||
| className: 'my-profiles', | ||
| }; | ||
| mount(<Profile {...props} />); | ||
| cy.get('[data-testid="Profiles-main"]').find('[data-testid="Profiles-link"]').should('have.length', profiles.length) | ||
| .each(($profileLink, index) => { | ||
| const profile = profiles[index]; | ||
| cy.wrap($profileLink) | ||
| .should('have.attr', 'href', profile.link) | ||
| .find('img') | ||
| .should('have.attr', 'src', profile.avatar) | ||
| .should('have.attr', 'alt', profile.name) | ||
| .siblings('.text-sm') | ||
| .should('have.text', profile.name); | ||
| }); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,42 @@ | ||
| import React from 'react'; | ||
| import { mount } from 'cypress/react'; | ||
| import Remember from '../../components/Remember'; | ||
| import LightBulb from '../../components/icons/LightBulb'; | ||
| describe('Remember Component', () => { | ||
| it('renders the component with the provided title and children', () => { | ||
| const title = 'Remember This'; | ||
| const className = 'remember'; | ||
| const children = <div data-testid="Remember-children">Remember content</div>; | ||
| mount( | ||
| <Remember title={title} className={className}> | ||
| {children} | ||
| </Remember> | ||
| ); | ||
| cy.get('[data-testid="Remember-main"]') | ||
| .should('exist') | ||
| .within(() => { | ||
| cy.get('[data-testid="Remember-heading"]') | ||
| .should('have.length', 1) | ||
| .within(() => { | ||
| cy.get(LightBulb).should('exist'); | ||
| cy.contains('[data-testid="Remember-title"]', title).should('exist'); | ||
| }); | ||
|
|
||
| cy.get('[data-testid="Remember-children"]').should('exist'); | ||
| }); | ||
| }); | ||
|
|
||
| it('renders the component with default title and no children', () => { | ||
| const className = 'remember'; | ||
| mount(<Remember className={className} />); | ||
| cy.get('[data-testid="Remember-main"]') | ||
| .should('exist') | ||
| .within(() => { | ||
| cy.get('[data-testid="Remember-heading"]').should('have.length', 1).within(() => { | ||
| cy.get(LightBulb).should('exist'); | ||
| cy.contains('[data-testid="Remember-title"]', 'Remember').should('exist'); | ||
| }); | ||
| cy.get('[data-testid="Remember-children"]').should('not.exist'); | ||
| }); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| import React from 'react'; | ||
| import { mount } from 'cypress/react'; | ||
| import Warning from '../../components/Warning'; | ||
| import IconExclamation from '../../components/icons/Exclamation'; | ||
|
|
||
| describe('Warning Component', () => { | ||
| it('renders the component with the provided title and description', () => { | ||
| const className = 'my-warning'; | ||
| const title = 'Warning Title'; | ||
| const description = 'Warning description text'; | ||
| mount( | ||
| <Warning className={className} title={title} description={description} /> | ||
| ); | ||
| cy.get('[data-testid="Warning-main"]') | ||
| .should('exist') | ||
| .within(() => { | ||
| cy.get(IconExclamation).should('exist'); | ||
| cy.contains('[data-testid="Warning-title"]', title).should('exist'); | ||
| cy.contains('[data-testid="Warning-description"]', description).should('exist'); | ||
| }); | ||
| }); | ||
| }); |