Skip to content

Commit a510972

Browse files
Damian SznajderDamian Sznajder
Damian Sznajder
authored and
Damian Sznajder
committed
🏷️ Change test files to .tsx
1 parent c4a8446 commit a510972

File tree

9 files changed

+114
-65
lines changed

9 files changed

+114
-65
lines changed

‎src/__tests__/OtpInput.test.js renamed to ‎__tests__/OtpInput.test.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
1-
import { TextInput, Platform } from 'react-native'
2-
import React from 'react'
3-
import renderer from 'react-test-renderer'
1+
import 'react-native'
2+
import * as React from 'react'
3+
import * as renderer from 'react-test-renderer'
44

5-
import OtpInput from '../OtpInput'
5+
import OtpInput from '../src/OtpInput'
66

77
jest.mock('Platform', () => ({
88
OS: 'ios',
99
Version: 12,
1010
}))
1111

1212
describe('<OtpInput />', () => {
13-
defaultProps = {
14-
handleBackspace: jest.fn(),
15-
updateText: jest.fn(),
13+
const defaultProps = {
14+
handleBackspace: ({ nativeEvent: {} }) => {},
15+
updateText: ({ nativeEvent: {} }) => {},
1616
}
1717

1818
describe('render', () => {
@@ -24,7 +24,7 @@ describe('<OtpInput />', () => {
2424

2525
test('with error message', () => {
2626
const wrapper = renderer.create(
27-
<OtpInput {...defaultProps} error={true} errorMessage="Error" textErrorColor="#00ff00" />,
27+
<OtpInput {...defaultProps} error={true} textErrorColor="#00ff00" />,
2828
)
2929

3030
expect(wrapper).toMatchSnapshot()

‎src/__tests__/__snapshots__/OtpInput.test.js.snap renamed to ‎__tests__/__snapshots__/OtpInput.test.tsx.snap

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,9 @@ exports[`<OtpInput /> render with default props 1`] = `
1919
<TextInput
2020
allowFontScaling={true}
2121
onBlur={[Function]}
22-
onChange={[MockFunction]}
22+
onChange={[Function]}
2323
onFocus={[Function]}
24-
onKeyPress={[MockFunction]}
24+
onKeyPress={[Function]}
2525
rejectResponderTermination={true}
2626
style={
2727
Array [
@@ -60,9 +60,9 @@ exports[`<OtpInput /> render with error message 1`] = `
6060
<TextInput
6161
allowFontScaling={true}
6262
onBlur={[Function]}
63-
onChange={[MockFunction]}
63+
onChange={[Function]}
6464
onFocus={[Function]}
65-
onKeyPress={[MockFunction]}
65+
onKeyPress={[Function]}
6666
rejectResponderTermination={true}
6767
style={
6868
Array [
@@ -103,9 +103,9 @@ exports[`<OtpInput /> render with iOS version 12 or higher 1`] = `
103103
<TextInput
104104
allowFontScaling={true}
105105
onBlur={[Function]}
106-
onChange={[MockFunction]}
106+
onChange={[Function]}
107107
onFocus={[Function]}
108-
onKeyPress={[MockFunction]}
108+
onKeyPress={[Function]}
109109
rejectResponderTermination={true}
110110
style={
111111
Array [

‎src/__tests__/__snapshots__/index.test.js.snap renamed to ‎__tests__/__snapshots__/index.test.tsx.snap

File renamed without changes.

‎src/__tests__/index.test.js renamed to ‎__tests__/index.test.tsx

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,21 @@
1-
import { Text, Keyboard } from 'react-native'
2-
import React from 'react'
3-
import renderer from 'react-test-renderer'
1+
import { Keyboard } from 'react-native'
2+
import * as React from 'react'
3+
import * as renderer from 'react-test-renderer'
44

5-
import OtpInputs from '../'
6-
import OtpInput from '../OtpInput'
5+
import OtpInputs from '../src/'
6+
import OtpInput from '../src/OtpInput'
77

88
Keyboard.dismiss = jest.fn()
99

1010
describe('<OtpInputs />', () => {
1111
const wrapper = renderer.create(<OtpInputs />)
1212

13-
test('render', () => {
13+
test('render', done => {
1414
expect(wrapper.toJSON()).toMatchSnapshot()
1515
expect(wrapper.root.findAllByType(OtpInput).length).toEqual(4)
1616
const sixInputsWrapper = renderer.create(<OtpInputs numberOfInputs={6} />)
1717
expect(sixInputsWrapper.root.findAllByType(OtpInput).length).toEqual(6)
18+
done()
1819
})
1920

2021
test('rendering with error', () => {

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@
5353
"@types/lodash.flatten": "4.4.6",
5454
"@types/react": "16.8.14",
5555
"@types/react-native": "0.57.50",
56+
"@types/react-test-renderer": "16.8.1",
5657
"husky": "2.1.0",
5758
"jest": "24.7.1",
5859
"metro-react-native-babel-preset": "0.53.1",

‎src/OtpInput.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,19 +11,19 @@ import {
1111
import defaultStyles from './defaultStyles'
1212

1313
interface Props {
14-
autoCapitalize: 'none' | 'sentences' | 'words' | 'characters'
15-
clearTextOnFocus: boolean
14+
autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters'
15+
clearTextOnFocus?: boolean
1616
containerStyles?: any
1717
error?: boolean
1818
focusedBorderColor?: string
1919
handleBackspace: (event: NativeSyntheticEvent<TextInputKeyPressEventData>) => void
2020
inputStyles?: any
21-
secureTextEntry: boolean
22-
selectTextOnFocus: boolean
21+
secureTextEntry?: boolean
22+
selectTextOnFocus?: boolean
2323
textErrorColor?: string
24-
unfocusedBorderColor: string
24+
unfocusedBorderColor?: string
2525
updateText: (event: NativeSyntheticEvent<TextInputChangeEventData>) => void
26-
keyboardType: 'default' | 'email-address' | 'numeric' | 'phone-pad'
26+
keyboardType?: 'default' | 'email-address' | 'numeric' | 'phone-pad'
2727
value?: string
2828
}
2929

‎src/index.tsx

Lines changed: 32 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -82,19 +82,19 @@ export default class OtpInputs extends Component<Props, State> {
8282
}
8383
}
8484

85-
public componentDidMount() {
85+
public componentDidMount(): void {
8686
this._listenOnCopiedText()
8787

8888
this._interval = setInterval(() => {
8989
this._listenOnCopiedText()
9090
}, 1000)
9191
}
9292

93-
public componentWillUnmount() {
93+
public componentWillUnmount(): void {
9494
clearInterval(this._interval)
9595
}
9696

97-
private _listenOnCopiedText = async () => {
97+
private _listenOnCopiedText = async (): Promise<void> => {
9898
const copiedText = await Clipboard.getString()
9999

100100
if (
@@ -111,7 +111,7 @@ export default class OtpInputs extends Component<Props, State> {
111111
otpCode: Array<string>,
112112
indexToFocus: number,
113113
fromClipboard?: boolean,
114-
) => {
114+
): void => {
115115
const { handleChange, numberOfInputs } = this.props
116116
handleChange(otpCode.join(''))
117117

@@ -126,7 +126,7 @@ export default class OtpInputs extends Component<Props, State> {
126126
}
127127
}
128128

129-
private _updateText = (event: TextInputOnChangeEventData, index: number) => {
129+
private _updateText = (event: TextInputOnChangeEventData, index: number): void => {
130130
let { text } = event.nativeEvent
131131

132132
if (text) {
@@ -136,7 +136,7 @@ export default class OtpInputs extends Component<Props, State> {
136136
}
137137
}
138138

139-
private _handleBackspace = (event: TextInputOnKeyPressEventData, index: number) => {
139+
private _handleBackspace = (event: TextInputOnKeyPressEventData, index: number): void => {
140140
if (event.nativeEvent.key === 'Backspace') {
141141
const { handleChange, numberOfInputs } = this.props
142142
const otpCode = this.state.otpCode
@@ -151,11 +151,11 @@ export default class OtpInputs extends Component<Props, State> {
151151
}
152152
}
153153

154-
private _focusInput = (index: number) => {
154+
private _focusInput = (index: number): void => {
155155
this.inputs[index].current.focus()
156156
}
157157

158-
private _renderInputs = () => {
158+
private _renderInputs = (): Array<JSX.Element> => {
159159
const {
160160
autoCapitalize,
161161
clearTextOnFocus,
@@ -171,31 +171,30 @@ export default class OtpInputs extends Component<Props, State> {
171171
unfocusedBorderColor,
172172
} = this.props
173173
const { otpCode } = this.state
174-
175-
return Array(numberOfInputs)
176-
.fill(0)
177-
.map((_, index) => (
178-
<OtpInput
179-
autoCapitalize={autoCapitalize}
180-
clearTextOnFocus={clearTextOnFocus}
181-
containerStyles={inputContainerStyles}
182-
error={!!errorMessage}
183-
focusedBorderColor={focusedBorderColor}
184-
handleBackspace={(event: TextInputOnKeyPressEventData) =>
185-
this._handleBackspace(event, index)
186-
}
187-
inputStyles={inputStyles}
188-
key={index}
189-
secureTextEntry={secureTextEntry}
190-
keyboardType={keyboardType}
191-
ref={this.inputs[index]}
192-
selectTextOnFocus={selectTextOnFocus}
193-
textErrorColor={inputTextErrorColor}
194-
unfocusedBorderColor={unfocusedBorderColor}
195-
updateText={(event: TextInputOnChangeEventData) => this._updateText(event, index)}
196-
value={otpCode[index]}
197-
/>
198-
))
174+
const iterationArray = Array<number>(numberOfInputs).fill(0)
175+
176+
return iterationArray.map((_, index) => (
177+
<OtpInput
178+
autoCapitalize={autoCapitalize}
179+
clearTextOnFocus={clearTextOnFocus}
180+
containerStyles={inputContainerStyles}
181+
error={!!errorMessage}
182+
focusedBorderColor={focusedBorderColor}
183+
handleBackspace={(event: TextInputOnKeyPressEventData) =>
184+
this._handleBackspace(event, index)
185+
}
186+
inputStyles={inputStyles}
187+
key={index}
188+
secureTextEntry={secureTextEntry}
189+
keyboardType={keyboardType}
190+
ref={this.inputs[index]}
191+
selectTextOnFocus={selectTextOnFocus}
192+
textErrorColor={inputTextErrorColor}
193+
unfocusedBorderColor={unfocusedBorderColor}
194+
updateText={(event: TextInputOnChangeEventData) => this._updateText(event, index)}
195+
value={otpCode[index]}
196+
/>
197+
))
199198
}
200199

201200
public render(): ReactNode {

‎tsconfig.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,6 @@
1515
"sourceMap": true
1616
},
1717
"filesGlob": ["lib/*.tsx", "lib/*.ts"],
18-
"exclude": ["android", "ios", "build", "node_modules"],
18+
"exclude": ["android", "__tests__", "ios", "build", "node_modules"],
1919
"compileOnSave": false
2020
}

‎yarn.lock

Lines changed: 53 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1117,6 +1117,13 @@
11171117
"@types/prop-types" "*"
11181118
"@types/react" "*"
11191119

1120+
"@types/react-test-renderer@16.8.1":
1121+
version "16.8.1"
1122+
resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-16.8.1.tgz#96f3ce45a3a41c94eca532a99103dd3042c9d055"
1123+
integrity sha512-8gU69ELfJGxzVWVYj4MTtuHxz9nO+d175XeQ1XrXXxesUBsB4KK6OCfzVhEX6leZWWBDVtMJXp/rUjhClzL7gw==
1124+
dependencies:
1125+
"@types/react" "*"
1126+
11201127
"@types/react@*":
11211128
version "16.8.12"
11221129
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.8.12.tgz#ffbdd7bcd2b7037c3f78e26c708922a2befbb71f"
@@ -1686,6 +1693,13 @@ browser-resolve@^1.11.3:
16861693
dependencies:
16871694
resolve "1.1.7"
16881695

1696+
bs-logger@0.x:
1697+
version "0.2.6"
1698+
resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8"
1699+
integrity sha512-pd8DCoxmbgc7hyPKOvxtqNcjYoOsABPQdcCUjGp3d42VR2CX1ORhk2A87oqqu5R1kk+76nsxZupkmyd+MVtCog==
1700+
dependencies:
1701+
fast-json-stable-stringify "2.x"
1702+
16891703
bser@^2.0.0:
16901704
version "2.0.0"
16911705
resolved "https://registry.yarnpkg.com/bser/-/bser-2.0.0.tgz#9ac78d3ed5d915804fd87acb158bc797147a1719"
@@ -1703,7 +1717,7 @@ buffer-crc32@^0.2.13:
17031717
resolved "https://registry.yarnpkg.com/buffer-crc32/-/buffer-crc32-0.2.13.tgz#0d333e3f00eac50aa1454abd30ef8c2a5d9a7242"
17041718
integrity sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI=
17051719

1706-
buffer-from@^1.0.0:
1720+
buffer-from@1.x, buffer-from@^1.0.0:
17071721
version "1.1.1"
17081722
resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
17091723
integrity sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A==
@@ -2973,7 +2987,7 @@ fast-glob@^2.2.6:
29732987
merge2 "^1.2.3"
29742988
micromatch "^3.1.10"
29752989

2976-
fast-json-stable-stringify@^2.0.0:
2990+
fast-json-stable-stringify@2.x, fast-json-stable-stringify@^2.0.0:
29772991
version "2.0.0"
29782992
resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz#d5142c0caee6b1189f87d3a76111064f86c8bbf2"
29792993
integrity sha1-1RQsDK7msRifh9OnYREGT4bIu/I=
@@ -4671,7 +4685,7 @@ json-stringify-safe@^5.0.1, json-stringify-safe@~5.0.1:
46714685
resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
46724686
integrity sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=
46734687

4674-
json5@^2.1.0:
4688+
json5@2.x, json5@^2.1.0:
46754689
version "2.1.0"
46764690
resolved "https://registry.yarnpkg.com/json5/-/json5-2.1.0.tgz#e7a0c62c48285c628d20a10b85c89bb807c32850"
46774691
integrity sha512-8Mh9h6xViijj36g7Dxi+Y4S6hNGV96vcJZr/SrlHh1LR/pEn/8j/+qIBbs44YKl69Lrfctp4QD+AdWLTMqEZAQ==
@@ -4971,6 +4985,11 @@ make-dir@^2.0.0:
49714985
pify "^4.0.1"
49724986
semver "^5.6.0"
49734987

4988+
make-error@1.x:
4989+
version "1.3.5"
4990+
resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.5.tgz#efe4e81f6db28cadd605c70f29c831b58ef776c8"
4991+
integrity sha512-c3sIjNUow0+8swNwVpqoH4YCShKNFkMaw6oH1mNS2haDZQqkeZFlHS3dhoeEbKKmJB4vXpJucU6oH75aDYeE9g==
4992+
49744993
makeerror@1.0.x:
49754994
version "1.0.11"
49764995
resolved "https://registry.yarnpkg.com/makeerror/-/makeerror-1.0.11.tgz#e01a5c9109f2af79660e4e8b9587790184f5a96c"
@@ -5546,7 +5565,7 @@ mixin-deep@^1.2.0:
55465565
for-in "^1.0.2"
55475566
is-extendable "^1.0.1"
55485567

5549-
mkdirp@^0.5.0, mkdirp@^0.5.1:
5568+
mkdirp@0.x, mkdirp@^0.5.0, mkdirp@^0.5.1:
55505569
version "0.5.1"
55515570
resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
55525571
integrity sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=
@@ -6852,6 +6871,13 @@ resolve@1.1.7:
68526871
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
68536872
integrity sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs=
68546873

6874+
resolve@1.x:
6875+
version "1.10.1"
6876+
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.10.1.tgz#664842ac960795bbe758221cdccda61fb64b5f18"
6877+
integrity sha512-KuIe4mf++td/eFb6wkaPbMDnP6kObCaEtIDuHOUED6MNUo4K670KZUHuuvYPZDxNF0WVLw49n06M2m2dXphEzA==
6878+
dependencies:
6879+
path-parse "^1.0.6"
6880+
68556881
resolve@^1.1.6, resolve@^1.10.0, resolve@^1.3.2, resolve@^1.5.0, resolve@^1.8.1:
68566882
version "1.10.0"
68576883
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.10.0.tgz#3bdaaeaf45cc07f375656dfd2e54ed0810b101ba"
@@ -7016,7 +7042,7 @@ semver-diff@^2.0.0:
70167042
dependencies:
70177043
semver "^5.0.3"
70187044

7019-
"semver@2 || 3 || 4 || 5", semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
7045+
"semver@2 || 3 || 4 || 5", semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
70207046
version "5.7.0"
70217047
resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.0.tgz#790a7cf6fea5459bac96110b29b60412dc8ff96b"
70227048
integrity sha512-Ya52jSX2u7QKghxeoFGpLwCtGlt7j0oY9DYb5apt9nPlJ42ID+ulTXESnt/qAQcoSERyZ5sl3LDIOw0nAn/5DA==
@@ -7636,6 +7662,21 @@ trim-right@^1.0.1:
76367662
resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
76377663
integrity sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=
76387664

7665+
ts-jest@24.0.2:
7666+
version "24.0.2"
7667+
resolved "https://registry.yarnpkg.com/ts-jest/-/ts-jest-24.0.2.tgz#8dde6cece97c31c03e80e474c749753ffd27194d"
7668+
integrity sha512-h6ZCZiA1EQgjczxq+uGLXQlNgeg02WWJBbeT8j6nyIBRQdglqbvzDoHahTEIiS6Eor6x8mK6PfZ7brQ9Q6tzHw==
7669+
dependencies:
7670+
bs-logger "0.x"
7671+
buffer-from "1.x"
7672+
fast-json-stable-stringify "2.x"
7673+
json5 "2.x"
7674+
make-error "1.x"
7675+
mkdirp "0.x"
7676+
resolve "1.x"
7677+
semver "^5.5"
7678+
yargs-parser "10.x"
7679+
76397680
tslib@^1.8.0, tslib@^1.8.1, tslib@^1.9.0:
76407681
version "1.9.3"
76417682
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.3.tgz#d7e4dd79245d85428c4d7e4822a79917954ca286"
@@ -8158,6 +8199,13 @@ yallist@^3.0.0, yallist@^3.0.2:
81588199
resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.0.3.tgz#b4b049e314be545e3ce802236d6cd22cd91c3de9"
81598200
integrity sha512-S+Zk8DEWE6oKpV+vI3qWkaK+jSbIK86pCwe2IF/xwIpQ8jEuxpw9NyaGjmp9+BoJv5FV2piqCDcoCtStppiq2A==
81608201

8202+
yargs-parser@10.x:
8203+
version "10.1.0"
8204+
resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-10.1.0.tgz#7202265b89f7e9e9f2e5765e0fe735a905edbaa8"
8205+
integrity sha512-VCIyR1wJoEBZUqk5PA+oOBF6ypbwh5aNB3I50guxAL/quggdfs4TtNHQrSazFA3fYZ+tEqfs0zIGlv0c/rgjbQ==
8206+
dependencies:
8207+
camelcase "^4.1.0"
8208+
81618209
yargs-parser@13.0.0, yargs-parser@^13.0.0:
81628210
version "13.0.0"
81638211
resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-13.0.0.tgz#3fc44f3e76a8bdb1cc3602e860108602e5ccde8b"

0 commit comments

Comments
 (0)