Skip to content

Commit 18c18a2

Browse files
vadymv-mendixvadymv-mendix
committed
chore: convert templates' tests from Enzyme to RN testing library
1 parent f5fdb65 commit 18c18a2

15 files changed

Lines changed: 100 additions & 114 deletions

File tree

‎packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-js-unit.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"copyright": "Mendix 2023",
77
"author": "Jest",
88
"engines": {
9-
"node": ">=16"
9+
"node": ">=20"
1010
},
1111
"license": "Apache-2.0",
1212
"config": {
@@ -34,10 +34,10 @@
3434
},
3535
"resolutions": {
3636
"react": "^18.2.0",
37-
"react-native": "0.72.7"
37+
"react-native": "0.77.3"
3838
},
3939
"overrides": {
4040
"react": "^18.2.0",
41-
"react-native": "0.72.7"
41+
"react-native": "0.77.3"
4242
}
4343
}

‎packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-js.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"copyright": "Mendix 2023",
77
"author": "Jest",
88
"engines": {
9-
"node": ">=16"
9+
"node": ">=20"
1010
},
1111
"license": "Apache-2.0",
1212
"config": {
@@ -29,10 +29,10 @@
2929
},
3030
"resolutions": {
3131
"react": "^18.2.0",
32-
"react-native": "0.72.7"
32+
"react-native": "0.77.3"
3333
},
3434
"overrides": {
3535
"react": "^18.2.0",
36-
"react-native": "0.72.7"
36+
"react-native": "0.77.3"
3737
}
3838
}

‎packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-ts-unit.json‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"copyright": "Mendix 2023",
77
"author": "Jest",
88
"engines": {
9-
"node": ">=16"
9+
"node": ">=20"
1010
},
1111
"license": "Apache-2.0",
1212
"config": {
@@ -29,7 +29,6 @@
2929
"devDependencies": {
3030
"@mendix/pluggable-widgets-tools": "^10.15.0",
3131
"@types/big.js": "^6.0.2",
32-
"@types/enzyme": "^3.10.8",
3332
"@types/jest": "^29.0.0"
3433
},
3534
"dependencies": {
@@ -38,11 +37,11 @@
3837
"resolutions": {
3938
"react": "^18.2.0",
4039
"@types/react": "^18.2.0",
41-
"react-native": "0.72.7"
40+
"react-native": "0.77.3"
4241
},
4342
"overrides": {
4443
"react": "^18.2.0",
4544
"@types/react": "^18.2.0",
46-
"react-native": "0.72.7"
45+
"react-native": "0.77.3"
4746
}
4847
}

‎packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-ts.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"copyright": "Mendix 2023",
77
"author": "Jest",
88
"engines": {
9-
"node": ">=16"
9+
"node": ">=20"
1010
},
1111
"license": "Apache-2.0",
1212
"config": {
@@ -31,11 +31,11 @@
3131
"resolutions": {
3232
"react": "^18.2.0",
3333
"@types/react": "^18.2.0",
34-
"react-native": "0.72.7"
34+
"react-native": "0.77.3"
3535
},
3636
"overrides": {
3737
"react": "^18.2.0",
3838
"@types/react": "^18.2.0",
39-
"react-native": "0.72.7"
39+
"react-native": "0.77.3"
4040
}
4141
}

‎packages/generator-widget/generators/app/templates/packages/package_native.json.ejs‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"copyright": <%- JSON.stringify(copyright) %>,
77
"author": <%- JSON.stringify(author) %>,
88
"engines": {
9-
"node": ">=16"
9+
"node": ">=20"
1010
},
1111
"license": <%- JSON.stringify(license) %>,
1212
"config": {
@@ -29,7 +29,6 @@
2929
"devDependencies": {
3030
"@mendix/pluggable-widgets-tools": "^10.15.0"<% if (isLanguageTS) { %>,
3131
"@types/big.js": "^6.0.2"<% if (hasUnitTests) { %>,
32-
"@types/enzyme": "^3.10.8",
3332
"@types/jest": "^29.0.0"<% } %><% } %>
3433
},
3534
"dependencies": {
@@ -38,11 +37,11 @@
3837
"resolutions": {
3938
"react": "^18.2.0",<% if (isLanguageTS) { %>
4039
"@types/react": "^18.2.0",<% } %>
41-
"react-native": "0.72.7"
40+
"react-native": "0.77.3"
4241
},
4342
"overrides": {
4443
"react": "^18.2.0",<% if (isLanguageTS) { %>
4544
"@types/react": "^18.2.0",<% } %>
46-
"react-native": "0.72.7"
45+
"react-native": "0.77.3"
4746
}
4847
}

‎packages/generator-widget/generators/app/templates/pluggable/native/emptyTemplateJs/src/components/__tests__/HelloWorld.spec.jsx.ejs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createElement } from "react";
2-
import { shallow } from "enzyme";
2+
import { render } from "@testing-library/react-native";
33
import { Platform } from "react-native";
44

55
import { HelloWorld } from "../HelloWorld";
@@ -15,18 +15,18 @@ describe.each(["ios", "android"])("HelloWorld for %s", (os) => {
1515
name: "Mendix",
1616
style: []
1717
};
18-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
18+
const component = render(<HelloWorld {...helloWorldProps} />);
1919

20-
expect(helloWorld).toMatchSnapshot();
20+
expect(component.toJSON()).toMatchSnapshot();
2121
});
2222

2323
it("renders the structure correctly with custom style", () => {
2424
const helloWorldProps = {
2525
name: "Mendix",
2626
style: [{ container: { borderColor: "white" }, label: { color: "black" } }]
2727
};
28-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
28+
const component = render(<HelloWorld {...helloWorldProps} />);
2929

30-
expect(helloWorld).toMatchSnapshot();
30+
expect(component.toJSON()).toMatchSnapshot();
3131
});
3232
});

‎packages/generator-widget/generators/app/templates/pluggable/native/emptyTemplateJsFn/src/components/__tests__/HelloWorld.spec.jsx.ejs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createElement } from "react";
2-
import { shallow } from "enzyme";
2+
import { render } from "@testing-library/react-native";
33
import { Platform } from "react-native";
44

55
import { HelloWorld } from "../HelloWorld";
@@ -15,18 +15,18 @@ describe.each(["ios", "android"])("HelloWorld for %s", (os) => {
1515
name: "Mendix",
1616
style: []
1717
};
18-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
18+
const component = render(<HelloWorld {...helloWorldProps} />);
1919

20-
expect(helloWorld).toMatchSnapshot();
20+
expect(component.toJSON()).toMatchSnapshot();
2121
});
2222

2323
it("renders the structure correctly with custom style", () => {
2424
const helloWorldProps = {
2525
name: "Mendix",
2626
style: [{ container: { borderColor: "white" }, label: { color: "black" } }]
2727
};
28-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
28+
const component = render(<HelloWorld {...helloWorldProps} />);
2929

30-
expect(helloWorld).toMatchSnapshot();
30+
expect(component.toJSON()).toMatchSnapshot();
3131
});
3232
});

‎packages/generator-widget/generators/app/templates/pluggable/native/emptyTemplateTs/src/components/__tests__/HelloWorld.spec.tsx.ejs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createElement } from "react";
2-
import { shallow } from "enzyme";
2+
import { render } from "@testing-library/react-native";
33
import { Platform } from "react-native";
44

55
import { HelloWorld, HelloWorldProps } from "../HelloWorld";
@@ -15,18 +15,18 @@ describe.each(["ios", "android"])("HelloWorld for %s", (os: "ios" | "android") =
1515
name: "Mendix",
1616
style: []
1717
};
18-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
18+
const component = render(<HelloWorld {...helloWorldProps} />);
1919

20-
expect(helloWorld).toMatchSnapshot();
20+
expect(component.toJSON()).toMatchSnapshot();
2121
});
2222

2323
it("renders the structure correctly with custom style", () => {
2424
const helloWorldProps: HelloWorldProps = {
2525
name: "Mendix",
2626
style: [{ container: { borderColor: "white" }, label: { color: "black" } }]
2727
};
28-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
28+
const component = render(<HelloWorld {...helloWorldProps} />);
2929

30-
expect(helloWorld).toMatchSnapshot();
30+
expect(component.toJSON()).toMatchSnapshot();
3131
});
3232
});

‎packages/generator-widget/generators/app/templates/pluggable/native/emptyTemplateTsFn/src/components/__tests__/HelloWorld.spec.tsx.ejs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createElement } from "react";
2-
import { shallow } from "enzyme";
2+
import { render } from "@testing-library/react-native";
33
import { Platform } from "react-native";
44

55
import { HelloWorld, HelloWorldProps } from "../HelloWorld";
@@ -15,18 +15,18 @@ describe.each(["ios", "android"])("HelloWorld for %s", (os: "ios" | "android") =
1515
name: "Mendix",
1616
style: []
1717
};
18-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
18+
const component = render(<HelloWorld {...helloWorldProps} />);
1919

20-
expect(helloWorld).toMatchSnapshot();
20+
expect(component.toJSON()).toMatchSnapshot();
2121
});
2222

2323
it("renders the structure correctly with custom style", () => {
2424
const helloWorldProps: HelloWorldProps = {
2525
name: "Mendix",
2626
style: [{ container: { borderColor: "white" }, label: { color: "black" } }]
2727
};
28-
const helloWorld = shallow(<HelloWorld {...helloWorldProps} />);
28+
const component = render(<HelloWorld {...helloWorldProps} />);
2929

30-
expect(helloWorld).toMatchSnapshot();
30+
expect(component.toJSON()).toMatchSnapshot();
3131
});
3232
});

‎packages/generator-widget/generators/app/templates/pluggable/native/fullTemplateJs/src/components/__tests__/Badge.spec.jsx.ejs‎

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { createElement } from "react";
2-
import { shallow } from "enzyme";
3-
import { Platform, TouchableNativeFeedback, TouchableOpacity } from "react-native";
2+
import { render, fireEvent } from "@testing-library/react-native";
3+
import { Platform } from "react-native";
44

55
import { Badge } from "../Badge";
66

@@ -16,9 +16,9 @@ describe.each(["ios", "android"])("Badge for %s", os => {
1616
onClick: jest.fn(),
1717
value: "0"
1818
};
19-
const badge = shallow(<Badge {...badgeProps} />);
19+
const component = render(<Badge {...badgeProps} />);
2020

21-
expect(badge).toMatchSnapshot();
21+
expect(component.toJSON()).toMatchSnapshot();
2222
});
2323

2424
it("renders the structure correctly with custom style", () => {
@@ -27,9 +27,9 @@ describe.each(["ios", "android"])("Badge for %s", os => {
2727
onClick: jest.fn(),
2828
value: "0"
2929
};
30-
const badge = shallow(<Badge {...badgeProps} />);
30+
const component = render(<Badge {...badgeProps} />);
3131

32-
expect(badge).toMatchSnapshot();
32+
expect(component.toJSON()).toMatchSnapshot();
3333
});
3434

3535
it("triggers the onClick action when pressed", () => {
@@ -38,13 +38,10 @@ describe.each(["ios", "android"])("Badge for %s", os => {
3838
onClick: jest.fn(),
3939
value: "0"
4040
};
41-
const badge = shallow(<Badge {...badgeProps} />);
41+
const component = render(<Badge {...badgeProps} />);
4242

43-
const Touchable = Platform.OS === "android" ? TouchableNativeFeedback : TouchableOpacity;
44-
45-
expect(badge.children().find(Touchable)).not.toBeNull();
46-
47-
badge.children().simulate("press");
43+
const touchable = component.getByRole("button");
44+
fireEvent.press(touchable);
4845

4946
expect(badgeProps.onClick).toHaveBeenCalled();
5047
});

0 commit comments

Comments
 (0)