-
-
Notifications
You must be signed in to change notification settings - Fork 765
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 dashboard folder #1735
Conversation
✅ Deploy Preview for asyncapi-website ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
⚡️ Lighthouse report for the changes in this PR:
Lighthouse ran on https://deploy-preview-1735--asyncapi-website.netlify.app/ |
// Select a specific repository | ||
cy.get('select[name="selectedRepo"]').select('Repository 1'); | ||
// Assert that the table displays the filtered issues | ||
cy.get(Table).should('contain', 'Repository 3'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If repository 1 is selected, then why are we checking for Repository 3 to exist in the render.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done the required changes in current commit .
<Filters | ||
className="test-class" | ||
issues={[]} | ||
setSelectedRepo={() => {}} | ||
allIssues={[]} | ||
setSelectedArea={() => {}} | ||
selectedArea="" | ||
selectedRepo="" | ||
/> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Test for filters shouldn't be tested only for it's existence, it's important that we should test it's functionality too by passing correct attributes inside it.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done the required changes in current commit .
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
Co-authored-by: Akshat Nema <76521428+akshatnema@users.noreply.github.com>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Update the file names of test files to Filters.cy.js
, Row.cy.js
and Table.cy.js
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also update the file name to Header.cy.js
/rtm |
Description
Dashboard Component of the website mainly houses for the main 2 sections "GoodFirstIssues" and the issues that are trending the most . Along with this it has mini sub components within itself that culminate together to make the Dashboard component . These components are as follows :
Header : Header component has 3 major links , to contribution guide , AsyncAPI github , and the slack community link , along with that it houses the heading Dashboard with it . The major things that need to be tested were that all 3 links are opened in new tab , heading is displayed and all the buttons and links are in place and open to new tabs . I have wrapped up all these tests and assertions in a single test "renders header correctly " so that we could also see what the component looks like in the test runner too .
![image](https://private-user-images.githubusercontent.com/64789514/242389126-8a226319-cc0d-4999-bda2-90c1a1ed2ecf.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5MDE4ODcsIm5iZiI6MTczODkwMTU4NywicGF0aCI6Ii82NDc4OTUxNC8yNDIzODkxMjYtOGEyMjYzMTktY2MwZC00OTk5LWJkYTItOTBjMWExZWQyZWNmLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDA0MTMwN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTZjMzExZTI2YzY3N2FhNmY0ODY2NzZiYmU4NTQxMDc0YTU4ZDE4NjAwZDJlMzExMDU2M2JmY2NjYzk2ZTZlNmUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.I7dirUEl3NkDdbIA_s8Pc5SZ3uK2cSddwxZtfjgCxt0)
GoodFirstIssues Tip : On hovering over this icon it displays basic and small text . I wrote 2 tests for this component "toggles the tip when hovering over the icon" and "renders the tip content with the correct text" . Both these tests passed .
![image](https://private-user-images.githubusercontent.com/64789514/242391082-2c06cdb4-75cb-446b-85c5-2af572ca5682.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5MDE4ODcsIm5iZiI6MTczODkwMTU4NywicGF0aCI6Ii82NDc4OTUxNC8yNDIzOTEwODItMmMwNmNkYjQtNzVjYi00NDZiLTg1YzUtMmFmNTcyY2E1NjgyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDA0MTMwN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTM0MTMzMTVkYzM3N2VhNzkwODlkMWRmMWMxMTFlNWU2OWMxOWIyZDY4MWE4NWVhNGVlNDdjMDdhZmZjY2M4MTYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.zBqfVKoR86pLdJURXwGTKyT1cIPhbSj-UrRiEDX5GME)
GoodFirstIssues.js : This component culminates other components like Tooltip , filter and others like row and table . This component displays a list of good first issues from github repos and also filters then according to the area and repo that has been selected , it displays them in a row like format . I included 3 major tests , "renders the component correctly " , "filter issues on basis of repository " , and similarly "filters on the basis of area " . I used dummy data for testing purpose .
![image](https://private-user-images.githubusercontent.com/64789514/242393285-c9b233ee-79f7-43fa-aaa9-624f9d0fad35.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5MDE4ODcsIm5iZiI6MTczODkwMTU4NywicGF0aCI6Ii82NDc4OTUxNC8yNDIzOTMyODUtYzliMjMzZWUtNzlmNy00M2ZhLWFhYTktNjI0ZjlkMGZhZDM1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDA0MTMwN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTYwNzVkZmNmN2Q5ZGY3OWQ3M2NjYzIyNGE3NDZjYjgxNGE0YTEzNmE5ZGMxYzFkMDQ3NGNmNWE2NGE1ZjRkYzgmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.Ch8rPTtDtucBDbG3ytK_ZlyJ4sSjmM4UcUVVT_8chAo)
Along with this it has a bunch of Helper components too , like Table , Row and Filters . I individually have tests for these components too which are as follows :
Row
![image](https://private-user-images.githubusercontent.com/64789514/242393830-43d85f88-0183-41e7-b7b9-798f2667db07.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5MDE4ODcsIm5iZiI6MTczODkwMTU4NywicGF0aCI6Ii82NDc4OTUxNC8yNDIzOTM4MzAtNDNkODVmODgtMDE4My00MWU3LWI3YjktNzk4ZjI2NjdkYjA3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDA0MTMwN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTJmYzhmZmQyYWYyOTlkMjQ3OWRiNWNjMWQ5MTE1YTdmNTMwNmJiODgwZmE2N2NlZDFmYzQ0OGNhOGI2Y2Q0NDUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.ytci80bk8RjcNxm3KQJT_Z4fiHfqtK3UZ0sxLhjmPe4)
Table
![image](https://private-user-images.githubusercontent.com/64789514/242393947-9b08f2ba-6efa-4a7f-bb1e-72b06405c24a.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5MDE4ODcsIm5iZiI6MTczODkwMTU4NywicGF0aCI6Ii82NDc4OTUxNC8yNDIzOTM5NDctOWIwOGYyYmEtNmVmYS00YTdmLWJiMWUtNzJiMDY0MDVjMjRhLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDA0MTMwN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWY2NDIyMjNjZGFiNmY4MTAxMDViZTQ3YzA5M2Y3ODM5MjA2ZTI3NGMwOGJjNTM5MDVhMmNmMGExOGRkZjEwMTcmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.02ddCCHNYSoKuaezBr8AWgdK1qUUS9sj0d2s1esOJrs)
![image](https://private-user-images.githubusercontent.com/64789514/242394082-f51a57f6-5b9c-4ead-8555-50d41341fe98.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5MDE4ODcsIm5iZiI6MTczODkwMTU4NywicGF0aCI6Ii82NDc4OTUxNC8yNDIzOTQwODItZjUxYTU3ZjYtNWI5Yy00ZWFkLTg1NTUtNTBkNDEzNDFmZTk4LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDA0MTMwN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWE1NjZkNmM0NDdjYTUyNGU4MzI4NDIxODAwOWFjZTUzMzMyNDY2Y2I2ZDNlZmEzMGRlY2IxMTRhNzc2ZTRlZjQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.2s-IbCDlSkzWh6sYQVn-p53eE-X-A-EGlaK3OugYJkI)
7**. Filters**
NOTE : THESE ARE SMALL COMPONENT TESTS , WHICH WOULD BE IN FUTURE BE TAKEN CARE OFF WHILE INTEGRATION TESTING
Related issue(s)
fixes #1729