Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: adding unit tests for button component #1818

Merged
merged 22 commits into from
Jul 12, 2023

Conversation

reachaadrika
Copy link
Contributor

Description

  • Buttons , is one of the most basic functionality required for a component , In AsyncAPI there is a main Button component and it is reused in multiple other Buttons in the website with different hrefs and texts . Thus I have written an extensive test for the main Button component and for other components I have checked href and required associated text on them .

For the Main Button component I have included following tests :

  1. renders a button without href
  2. renders a button with href
  3. renders a small button
  4. renders a button with custom class

image

Other Button files here are as follows :

  1. GithubButton
  2. SubscribeButton
  3. YoutubeButton
  4. DocsButton
  5. SlackButton
  6. GoogleCalendarButton & others

For these components the tests that I have included are as follows :

  1. renders correctly with default props
  2. renders correctly with custom props

Related issue(s)
fixes #1730

@netlify
Copy link

netlify bot commented Jun 21, 2023

Deploy Preview for asyncapi-website ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit c2ef256
🔍 Latest deploy log https://app.netlify.com/sites/asyncapi-website/deploys/64ae926586f3700008353aef
😎 Deploy Preview https://deploy-preview-1818--asyncapi-website.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@github-actions
Copy link

github-actions bot commented Jun 21, 2023

⚡️ Lighthouse report for the changes in this PR:

Category Score
🟠 Performance 54
🟢 Accessibility 98
🟢 Best practices 100
🟢 SEO 100
🔴 PWA 30

Lighthouse ran on https://deploy-preview-1818--asyncapi-website.netlify.app/

);
cy.contains('Custom Text').should('be.visible');
cy.get('[ data-testid="Button-link"]').should('have.attr', 'href', customHref);
cy.get('[ data-testid="Button-link"]').should('have.attr', 'target', '_self');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why are you adding space here? between [ data-test @reachaadrika
Please install a formatter extension in your vscode

fix this space issue with all over places

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed

Copy link
Member

@imabp imabp left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

minor space related issue, fix this and we can merge then

@akshatnema akshatnema added the gsoc This label should be used for issues or discussions related to ideas for Google Summer of Code label Jun 27, 2023
@reachaadrika
Copy link
Contributor Author

@reachaadrika Kindly update the PR title related to changes inside PR

It has button testcases only

Comment on lines 10 to 15
<GoogleCalendarButton
text="Custom Text"
href={customHref}
target="_self"
iconPosition="right"
/>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You have mounted wrong component inside ICSFileButton.cy.js test file.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

cypress/test/buttons/SubscribeButton.cy.js Outdated Show resolved Hide resolved
cypress/test/buttons/YoutubeButton.cy.js Outdated Show resolved Hide resolved
@@ -0,0 +1,48 @@
import React from 'react';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Rename this file to Button.cy.js.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

cy.get('[data-testid="Button-main"]').should('have.attr', 'type', type);
cy.get('[data-testid="Button-link"]').should('not.exist');
});

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add a case for testing if icon is not present in Button component.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

@reachaadrika
Copy link
Contributor Author

/rtm

@asyncapi-bot asyncapi-bot merged commit 3360e15 into asyncapi:master Jul 12, 2023
17 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
gsoc This label should be used for issues or discussions related to ideas for Google Summer of Code ready-to-merge
Projects
None yet
Development

Successfully merging this pull request may close these issues.

add unit tests for the 'buttons' component
4 participants