Skip to content

Commit 17f9c09

Browse files
benkeenbenkeen
committed
Jest now running
1 parent e6ae64e commit 17f9c09

10 files changed

+234
-242
lines changed

‎NOTES.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
Notes for next 4.x release.
2+
3+
- Minimum react version updated to 16.8.0 (hooks)

‎babel.config.json

+5-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
11
{
2-
"presets": ["@babel/preset-react"]
2+
"presets": [
3+
"@babel/preset-env",
4+
["@babel/preset-react", { "runtime": "automatic" }],
5+
"@babel/preset-typescript"
6+
]
37
}

‎jest.config.js

+1-26
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ const config = {
77
collectCoverage: true,
88
coverageDirectory: 'temp/coverage',
99
coverageProvider: 'v8',
10-
// The maximum amount of workers used to run your tests. Can be specified as % or a number. E.g. maxWorkers: 10% will use 10% of your CPU amount + 1 as the maximum worker number. maxWorkers: 2 will use a maximum of 2 workers.
11-
// maxWorkers: "50%",
1210

1311
// An array of directory names to be searched recursively up from the requiring module's location
1412
// moduleDirectories: [
@@ -39,35 +37,12 @@ const config = {
3937
// An enum that specifies notification mode. Requires { notify: true }
4038
// notifyMode: "failure-change",
4139

42-
// A preset that is used as a base for Jest's configuration
43-
// preset: undefined,
44-
45-
// Run tests from one or more projects
46-
// projects: undefined,
47-
48-
// Use this configuration option to add custom reporters to Jest
49-
// reporters: undefined,
50-
51-
// Automatically reset mock state before every test
52-
// resetMocks: false,
53-
5440
// Reset the module registry before running each individual test
5541
// resetModules: false,
5642

5743
// A path to a custom resolver
5844
// resolver: undefined,
5945

60-
// Automatically restore mock state and implementation before every test
61-
// restoreMocks: false,
62-
63-
// The root directory that Jest should scan for tests and modules within
64-
// rootDir: undefined,
65-
66-
// A list of paths to directories that Jest should use to search for files in
67-
// roots: [
68-
// "<rootDir>"
69-
// ],
70-
7146
// Allows you to use a custom runner instead of Jest's default test runner
7247
// runner: "jest-runner",
7348

@@ -117,7 +92,7 @@ const config = {
11792

11893
// An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
11994
// transformIgnorePatterns: [
120-
// "/node_modules/",
95+
// '/node_modules/',
12196
// "\\.pnp\\.[^\\/]+$"
12297
// ],
12398

‎package.json

+5-4
Original file line numberDiff line numberDiff line change
@@ -21,24 +21,25 @@
2121
"deploy": "gh-pages -d example/build"
2222
},
2323
"peerDependencies": {
24-
"react": ">=15",
25-
"react-dom": ">=15"
24+
"react": ">=16.8.0",
25+
"react-dom": ">=16.8.0"
2626
},
2727
"devDependencies": {
2828
"@babel/core": "^7.26.0",
2929
"@babel/eslint-parser": "^7.25.6",
3030
"@babel/preset-env": "^7.26.0",
3131
"@babel/preset-stage-0": "^7.8.3",
3232
"@babel/preset-react": "^7.25.9",
33+
"@babel/preset-typescript": "^7.26.0",
3334
"country-region-data": "^3.1.0",
3435
"cross-env": "^5.1.4",
3536
"eslint": "^8.57.1",
3637
"jest": "^29.7.0",
3738
"jest-environment-jsdom": "^29.7.0",
3839
"gh-pages": "^1.2.0",
3940
"minimalist": "^1.0.0",
40-
"react": "^16.4.1",
41-
"react-dom": "^16.4.1",
41+
"react": "^18.3.1",
42+
"react-dom": "^18.3.1",
4243
"rollup": "^4.27.4",
4344
"typescript": "^5.7.2",
4445
"@rollup/plugin-babel": "^6.0.4",

‎src/RegionDropdown.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ import type { RegionDropdownProps } from './rcrs.types';
66

77
export const RegionDropdown: FC<RegionDropdownProps> = ({
88
onChange,
9+
value,
910
country = '',
10-
value = '',
1111
onBlur = () => null,
1212
id = '',
1313
name = 'rcrs-region',

‎src/__tests__/CountryDropdown.js

+167
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
// import React from 'react';
2+
// import { CountryDropdown, CountryRegionData } from '../../dist/rcrs.es';
3+
// import Enzyme, { shallow } from 'enzyme';
4+
5+
// const Adapter = require('enzyme-adapter-react-16');
6+
// Enzyme.configure({ adapter: new Adapter() });
7+
8+
// describe('CountryDropdown', () => {
9+
// it('sets ID attribute', () => {
10+
// const wrapper = shallow(<CountryDropdown id="id-attribute" />);
11+
// expect(wrapper.find('#id-attribute').length).toBe(1);
12+
// expect(wrapper.find('#fake-id-attribute').length).toBe(0);
13+
// });
14+
15+
// it('classes attribute gets recognized', () => {
16+
// const wrapper = shallow(<CountryDropdown classes="one two three" />);
17+
// expect(wrapper.find('select').hasClass('one two three')).toBe(true);
18+
// });
19+
20+
// it('passes arbitrary properties', () => {
21+
// const wrapper = shallow(
22+
// <CountryDropdown style={{ color: 'red' }} data-whatever="5" />
23+
// );
24+
// expect(wrapper.find('select').getElement().props.style.color).toBe('red');
25+
// expect(wrapper.find('select').getElement().props['data-whatever']).toBe(
26+
// '5'
27+
// );
28+
// });
29+
30+
// describe('name attribute', () => {
31+
// it('falls back on default name attribute when not specified', () => {
32+
// const wrapper = shallow(<CountryDropdown />);
33+
// expect(wrapper.find('select').getElement().props.name).toBe(
34+
// 'rcrs-country'
35+
// );
36+
// });
37+
38+
// it('sets explicit name attribute', () => {
39+
// const wrapper = shallow(<CountryDropdown name="name-attribute" />);
40+
// expect(wrapper.find('select[name="name-attribute"]').length).toBe(1);
41+
// expect(wrapper.find('select[name="fake-name-attribute"]').length).toBe(0);
42+
// });
43+
// });
44+
45+
// describe('disabled attribute', () => {
46+
// it('disabled attribute not on by default', () => {
47+
// const wrapper = shallow(<CountryDropdown />);
48+
// expect(wrapper.find('select').getElement().props.disabled).toBe(false);
49+
// });
50+
// it('disabled attribute', () => {
51+
// const wrapper = shallow(<CountryDropdown disabled={true} />);
52+
// expect(wrapper.find('select').getElement().props.disabled).toBe(true);
53+
// });
54+
// });
55+
56+
// describe('default blank option', () => {
57+
// it('showDefaultOption = false removes the default option', () => {
58+
// const wrapper = shallow(<CountryDropdown showDefaultOption={false} />);
59+
// expect(wrapper.find('option').length).toBe(CountryRegionData.length);
60+
// });
61+
62+
// it('confirm default label is "Select Country"', () => {
63+
// const wrapper = shallow(<CountryDropdown />);
64+
// expect(wrapper.find('select').childAt(0).text()).toBe('Select Country');
65+
// });
66+
67+
// it('defaultOptionLabel', () => {
68+
// const customLabel = 'Holy moly I am a custom label!';
69+
// const wrapper = shallow(
70+
// <CountryDropdown defaultOptionLabel={customLabel} />
71+
// );
72+
// expect(wrapper.find('select').childAt(0).text()).toBe(customLabel);
73+
// });
74+
// });
75+
76+
// describe('country list', () => {
77+
// it('outputs the list of countries', () => {
78+
// const wrapper = shallow(<CountryDropdown />);
79+
// expect(wrapper.find('option').length).toBe(CountryRegionData.length + 1); // 1 for the "Select Country" default option
80+
// });
81+
82+
// it('respects the blacklist', () => {
83+
// const blacklist = ['GB', 'CA', 'US'];
84+
// const wrapper = shallow(
85+
// <CountryDropdown blacklist={blacklist} showDefaultOption={false} />
86+
// );
87+
// expect(wrapper.find('option').length).toBe(
88+
// CountryRegionData.length - blacklist.length
89+
// );
90+
91+
// // confirm a non-blacklist item appears
92+
// expect(wrapper.find('option[value="Afghanistan"]').length).toBe(1);
93+
94+
// // confirm none of the blacklist item appears
95+
// expect(wrapper.find('option[value="United Kingdom"]').length).toBe(0);
96+
// expect(wrapper.find('option[value="Canada"]').length).toBe(0);
97+
// expect(wrapper.find('option[value="United States"]').length).toBe(0);
98+
// });
99+
100+
// it('respects the whitelist', () => {
101+
// const whitelist = ['GB', 'CA', 'US'];
102+
// const wrapper = shallow(
103+
// <CountryDropdown whitelist={whitelist} showDefaultOption={false} />
104+
// );
105+
// expect(wrapper.find('option').length).toBe(whitelist.length);
106+
107+
// // confirm the expected items appear
108+
// expect(wrapper.find('option[value="United Kingdom"]').length).toBe(1);
109+
// expect(wrapper.find('option[value="Canada"]').length).toBe(1);
110+
// expect(wrapper.find('option[value="United States"]').length).toBe(1);
111+
// });
112+
// });
113+
114+
// describe('valueType', () => {
115+
// it('confirm value is full country name by default', () => {
116+
// const wrapper = shallow(<CountryDropdown showDefaultOption={false} />);
117+
// expect(wrapper.find('select').childAt(0).getElement().props.value).toBe(
118+
// CountryRegionData[0][0]
119+
// );
120+
// });
121+
122+
// it('confirm explicit valueType="full" also sets full country name', () => {
123+
// const wrapper = shallow(
124+
// <CountryDropdown showDefaultOption={false} valueType="full" />
125+
// );
126+
// expect(wrapper.find('select').childAt(0).getElement().props.value).toBe(
127+
// CountryRegionData[0][0]
128+
// );
129+
// });
130+
131+
// it('confirm valueType="short" outputs country short code', () => {
132+
// const wrapper = shallow(
133+
// <CountryDropdown showDefaultOption={false} valueType="short" />
134+
// );
135+
// expect(wrapper.find('select').childAt(0).getElement().props.value).toBe(
136+
// CountryRegionData[0][1]
137+
// );
138+
// });
139+
// });
140+
141+
// describe('labelType', () => {
142+
// it('confirm label type is full country name by default', () => {
143+
// const wrapper = shallow(<CountryDropdown showDefaultOption={false} />);
144+
// expect(wrapper.find('select').childAt(0).text()).toBe(
145+
// CountryRegionData[0][0]
146+
// );
147+
// });
148+
149+
// it('confirm label type is full country name when explicitly set', () => {
150+
// const wrapper = shallow(
151+
// <CountryDropdown showDefaultOption={false} labelType="full" />
152+
// );
153+
// expect(wrapper.find('select').childAt(0).text()).toBe(
154+
// CountryRegionData[0][0]
155+
// );
156+
// });
157+
158+
// it('confirm label type is the country shortcode when set', () => {
159+
// const wrapper = shallow(
160+
// <CountryDropdown showDefaultOption={false} labelType="short" />
161+
// );
162+
// expect(wrapper.find('select').childAt(0).text()).toBe(
163+
// CountryRegionData[0][1]
164+
// );
165+
// });
166+
// });
167+
// });

0 commit comments

Comments
 (0)