React Element Selector Query (RESQ) - Query React components and children by component name or HTML selector
Resq (React Element Selector Query) is an innovative library designed to enhance component selection in React applications. Similar to the traditional querySelector and querySelectorAll methods found in the DOM, Resq allows developers to query React’s VirtualDOM effectively. This powerful tool provides a seamless way to interact with React composite elements or HTML elements, making it a valuable asset for any React developer.
Built for React versions 16 and higher, and compatible with Node 8 or higher, Resq offers a straightforward API with two primary functions: resq$ for selecting single components and resq$$ for selecting multiple components simultaneously. The library not only streamlines the component selection process but also supports advanced features such as wildcard selection and filtering, which enhance the versatility of the queries.
Basic Usage: Easily select React components by their names using simple calls, perfect for straightforward selection needs.
Wildcard Selection: Utilize wildcard selectors to find components based on partial names, which is particularly useful for selecting multiple components with similar naming conventions.
Async Selection: Seamlessly select components without specifying the root element by leveraging asynchronous selections, allowing for more flexible queries.
Filtering Selection: Refine your selections by state or props using built-in methods, enabling targeted component manipulation based on dynamic conditions.
Deep Matching with Exact Flag: Ensure precise matching when filtering by properties or states, allowing you to specify that the function must match every property and value exactly, including nested objects.
Type Definition Support: Gain the advantage of type definitions for better integration within TypeScript projects, enhancing code reliability and maintainability.
Integration with React DevTools: While not mandatory, using React DevTools alongside Resq can significantly improve your experience, especially for components generated by libraries like Styled Components and Material-UI.
