search

themesberg / flowbite-react

Official React components built for Flowbite and Tailwind CSS
https://flowbite-react.com
MIT License
1.85k stars 414 forks source link

Implement Unit Tests for flowbite-react component styles verification #821

Closed rluders closed 8 months ago

rluders commented 1 year ago

Is your feature request related to a problem? Please describe. I have noticed that there is currently no automated process to verify if the CSS classes used in the components of the flowbite-react library match with the corresponding classes from the standard flowbite library. This can lead to inconsistencies and styling issues when integrating flowbite-react components into projects.

Describe the solution you'd like I would like to implement unit tests for all the components of the flowbite-react library to ensure that the CSS classes used in the components align with the ones from the standard flowbite library. These unit tests will validate that the expected CSS classes are present in the rendered components and help maintain consistency in styling across the library.

Describe alternatives you've considered One alternative would be to manually inspect and compare the CSS classes in each component against the standard flowbite library. However, this approach is time-consuming, error-prone, and not scalable as the library evolves. By implementing automated unit tests, we can ensure consistent styling and streamline the validation process for future updates.

Additional context As flowbite-react is widely used in various projects, it is crucial to maintain consistency and compatibility with the standard flowbite library. These unit tests will provide an added layer of confidence in the integrity of the components' styling and assist developers in identifying any discrepancies or unintended changes in the CSS classes.

Components

Is your feature request related to a problem? Please describe. I have noticed that there is currently no automated process to verify if the CSS classes used in the components of the flowbite-react library match with the corresponding classes from the standard flowbite library. This can lead to inconsistencies and styling issues when integrating flowbite-react components into projects.

Describe the solution you'd like I would like to implement unit tests for all the components of the flowbite-react library to ensure that the CSS classes used in the components align with the ones from the standard flowbite library. These unit tests will validate that the expected CSS classes are present in the rendered components and help maintain consistency in styling across the library.

Describe alternatives you've considered One alternative would be to manually inspect and compare the CSS classes in each component against the standard flowbite library. However, this approach is time-consuming, error-prone, and not scalable as the library evolves. By implementing automated unit tests, we can ensure consistent styling and streamline the validation process for future updates.

Additional context As flowbite-react is widely used in various projects, it is crucial to maintain consistency and compatibility with the standard flowbite library. These unit tests will provide an added layer of confidence in the integrity of the components' styling and assist developers in identifying any discrepancies or unintended changes in the

rluders commented 1 year ago

This is related to #820. I don't expect to see one single PR that will cover all the issues, for this reason, I'm creating issues for every item on the checklist, this task is used just to track the progress.

Please, if you want to work on any of this, just go and create an issue using the ones that I already created as an example.

tulup-conner commented 10 months ago

I like this idea but I don't think it would be feasible to maintain something like this. It seems like it would be a huge task to setup.