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.

Sign up for GitHub

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

Jump to bottom

[core] Remove React.ReactElement<any> from describeConformance.tsx #44318

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
+62 −6
Open

[core] Remove React.ReactElement<any> from describeConformance.tsx #44318

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0b53f91
fix
sai6855 Nov 4, 2024
b713008
final fix
sai6855 Nov 4, 2024
df2a2c0
create generic data props interface
sai6855 Nov 4, 2024
5da23c7
fix
sai6855 Nov 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 62 additions & 6 deletions packages-internal/test-utils/src/describeConformance.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,10 @@ function capitalize(string: string): string {
return string.charAt(0).toUpperCase() + string.slice(1);
}

interface DataProps {
[key: `data-${string}`]: string;
}

export interface SlotTestingOptions {
/**
* A custom React component to test if the receiving props are correct.
Expand Down Expand Up @@ -95,7 +99,11 @@ function throwMissingPropError(field: string): never {
* the root component.
*/
export function testClassName(
element: React.ReactElement<any>,
element: React.ReactElement<
DataProps & {
className: string;
}
>,
getOptions: () => ConformanceOptions,
) {
it('applies the className to the root component', async () => {
Expand All @@ -121,7 +129,12 @@ export function testClassName(
* Component from @inheritComponent
*/
export function testComponentProp(
element: React.ReactElement<any>,
element: React.ReactElement<
DataProps & {
className: string;
component?: string | React.ElementType;
}
>,
getOptions: () => ConformanceOptions,
) {
describe('prop: component', () => {
Expand Down Expand Up @@ -157,7 +170,13 @@ export function testComponentProp(
* MUI components spread additional props to its root.
*/
export function testPropsSpread(
element: React.ReactElement<any>,
element: React.ReactElement<
DataProps & {
className: string;
component: string | React.ElementType;
}
>,

getOptions: () => ConformanceOptions,
) {
it(`spreads props to the root component`, async () => {
Expand Down Expand Up @@ -187,7 +206,9 @@ export function testPropsSpread(
* components that forward their ref and attach it to a host component.
*/
export function describeRef(
element: React.ReactElement<any>,
element: React.ReactElement<{
ref: React.RefObject<any>;
}>,
getOptions: () => ConformanceOptions,
) {
describe('ref', () => {
Expand All @@ -212,7 +233,10 @@ export function describeRef(
* Tests that the root component has the root class
*/
export function testRootClass(
element: React.ReactElement<any>,
element: React.ReactElement<{
className: string;
classes: Record<string, string>;
}>,
getOptions: () => ConformanceOptions,
) {
it('applies the root class to the root component if it has this class', async () => {
Expand Down Expand Up @@ -264,7 +288,39 @@ function forEachSlot(
});
}

function testSlotsProp(element: React.ReactElement<any>, getOptions: () => ConformanceOptions) {
function testSlotsProp(
element: React.ReactElement<{
className: string;
classes: Record<string, string>;
slots: {
[x: string]:
| SlotTestingOptions['testWithComponent']
| keyof React.JSX.IntrinsicElements
| React.ForwardRefExoticComponent<
{
children: React.ReactNode;
} & React.RefAttributes<HTMLDivElement>
>;
};
components: {
[x: string]:
| SlotTestingOptions['testWithComponent']
| keyof React.JSX.IntrinsicElements
| React.ForwardRefExoticComponent<
{
children: React.ReactNode;
} & React.RefAttributes<HTMLDivElement>
>;
};
slotProps: {
[x: string]: DataProps;
};
componentsProps: {
[x: string]: DataProps;
};
}>,
getOptions: () => ConformanceOptions,
) {
const { render, slots, testLegacyComponentsProp } = getOptions();

const CustomComponent = React.forwardRef<
Expand Down