[Devtools]Missing button styles for buttons under Data Explorer and Query Explorer

[himankpathak]

Describe the bug

There are no styles present on buttons inside Data Explorer and Query Explorer.
Therefore text visibility on button fails when global style is applied on button tag.

button {
  color: inherit;
}

Other buttons in devtools are not affected by this which have specific styles present.

Your minimal, reproducible example

https://codesandbox.io/s/inspiring-goldberg-3pecyp

Steps to reproduce

1. Add the style on button tag

button {
  color: inherit;
}

2. Open react-query devtools and expand Data Explorer or Query Explorer section.

Expected behavior

Text visibility should not be affected by common generic styles on button tag.
Specific styles can be added on button to prevent this from happening.

How often does this bug happen?

Every time

Screenshots or Videos

Platform

• OS: MacOS
• Chrome v100.0

react-query version

v3.35.0

TypeScript version

No response

Additional context

No response

[TkDodo]

yeah, the button change was introduced here, and we've already identified the issues:

• refactor(devtools): add types to Explorer #2949 (comment)

thanks for creating the ticket to track it. @Liam-Tait wanted to take a look at the two issues, not sure if he already has?

[tannerlinsley]

🎉 This issue has been resolved in version 3.38.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[tannerlinsley]

🎉 This issue has been resolved in version 4.0.0-beta.14 🎉

The release is available on:

• npm package (@beta dist-tag)
• GitHub release

Your semantic-release bot 📦🚀