Skip to content

Commit a60ce28

Browse files
mdjastrzebskimdjastrzebski
authored
refactor: 0.76 stable tweaks (#1682)
1 parent 0305877 commit a60ce28

29 files changed

+204
-102
lines changed

‎examples/basic/components/AnimatedView.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import * as React from 'react';
2+
import { Animated, ViewStyle } from 'react-native';
3+
4+
type AnimatedViewProps = {
5+
fadeInDuration?: number;
6+
style?: ViewStyle;
7+
children: React.ReactNode;
8+
useNativeDriver?: boolean;
9+
};
10+
11+
export function AnimatedView(props: AnimatedViewProps) {
12+
const fadeAnim = React.useRef(new Animated.Value(0)).current; // Initial value for opacity: 0
13+
14+
React.useEffect(() => {
15+
Animated.timing(fadeAnim, {
16+
toValue: 1,
17+
duration: props.fadeInDuration ?? 250,
18+
useNativeDriver: props.useNativeDriver ?? true,
19+
}).start();
20+
}, [fadeAnim]);
21+
22+
return (
23+
<Animated.View
24+
style={{
25+
...props.style,
26+
opacity: fadeAnim,
27+
}}
28+
>
29+
{props.children}
30+
</Animated.View>
31+
);
32+
}

‎examples/basic/components/__tests__/AnimatedView.test.tsx

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import { act, render, screen } from '@testing-library/react-native';
2+
import { AnimatedView } from '../AnimatedView';
3+
4+
describe('AnimatedView', () => {
5+
beforeEach(() => {
6+
jest.useFakeTimers();
7+
});
8+
9+
afterEach(() => {
10+
jest.useRealTimers();
11+
});
12+
13+
it('should use native driver when useNativeDriver is true', async () => {
14+
render(
15+
<AnimatedView fadeInDuration={250} useNativeDriver={true}>
16+
Test
17+
</AnimatedView>,
18+
);
19+
expect(screen.root).toHaveStyle({ opacity: 0 });
20+
21+
await act(() => jest.advanceTimersByTime(250));
22+
expect(screen.root).toHaveStyle({ opacity: 1 });
23+
});
24+
25+
it('should not use native driver when useNativeDriver is false', async () => {
26+
render(
27+
<AnimatedView fadeInDuration={250} useNativeDriver={false}>
28+
Test
29+
</AnimatedView>,
30+
);
31+
expect(screen.root).toHaveStyle({ opacity: 0 });
32+
33+
await act(() => jest.advanceTimersByTime(250));
34+
expect(screen.root).toHaveStyle({ opacity: 1 });
35+
});
36+
});

‎jest-setup.ts

+1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { resetToDefaults } from './src/pure';
2+
import './src/matchers/extend-expect';
23

34
beforeEach(() => {
45
resetToDefaults();

‎jest.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
module.exports = {
22
preset: './jest-preset',
33
setupFilesAfterEnv: ['./jest-setup.ts'],
4-
testPathIgnorePatterns: ['timer-utils', 'examples/', 'experiments-app/', 'experiments-rtl/'],
4+
testPathIgnorePatterns: ['build/', 'examples/', 'experiments-app/', 'timer-utils'],
55
testTimeout: 60000,
66
transformIgnorePatterns: ['/node_modules/(?!(@react-native|react-native)/).*/'],
77
snapshotSerializers: ['@relmify/jest-serializer-strip-ansi/always'],

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@
8484
"jest": "^29.7.0",
8585
"prettier": "^2.8.8",
8686
"react": "18.3.1",
87-
"react-native": "0.76.0-rc.6",
87+
"react-native": "0.76.0",
8888
"react-test-renderer": "18.3.1",
8989
"release-it": "^17.6.0",
9090
"strip-ansi": "^6.0.1",

‎src/__tests__/fire-event.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import {
99
View,
1010
} from 'react-native';
1111
import { fireEvent, render, screen } from '..';
12-
import '../matchers/extend-expect';
1312

1413
type OnPressComponentProps = {
1514
onPress: () => void;

‎src/__tests__/react-native-animated.tsx

+67
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import * as React from 'react';
2+
import { Animated, ViewStyle } from 'react-native';
3+
import { act, render, screen } from '..';
4+
5+
type AnimatedViewProps = {
6+
fadeInDuration?: number;
7+
style?: ViewStyle;
8+
children: React.ReactNode;
9+
useNativeDriver?: boolean;
10+
};
11+
12+
function AnimatedView(props: AnimatedViewProps) {
13+
const fadeAnim = React.useRef(new Animated.Value(0)).current; // Initial value for opacity: 0
14+
15+
React.useEffect(() => {
16+
Animated.timing(fadeAnim, {
17+
toValue: 1,
18+
duration: props.fadeInDuration ?? 250,
19+
useNativeDriver: props.useNativeDriver ?? true,
20+
}).start();
21+
}, [fadeAnim, props.fadeInDuration, props.useNativeDriver]);
22+
23+
return (
24+
<Animated.View
25+
style={{
26+
...props.style,
27+
opacity: fadeAnim,
28+
}}
29+
>
30+
{props.children}
31+
</Animated.View>
32+
);
33+
}
34+
35+
describe('AnimatedView', () => {
36+
beforeEach(() => {
37+
jest.useFakeTimers();
38+
});
39+
40+
afterEach(() => {
41+
jest.useRealTimers();
42+
});
43+
44+
it('should use native driver when useNativeDriver is true', async () => {
45+
render(
46+
<AnimatedView fadeInDuration={250} useNativeDriver={true}>
47+
Test
48+
</AnimatedView>,
49+
);
50+
expect(screen.root).toHaveStyle({ opacity: 0 });
51+
52+
await act(() => jest.advanceTimersByTime(250));
53+
expect(screen.root).toHaveStyle({ opacity: 1 });
54+
});
55+
56+
it('should not use native driver when useNativeDriver is false', async () => {
57+
render(
58+
<AnimatedView fadeInDuration={250} useNativeDriver={false}>
59+
Test
60+
</AnimatedView>,
61+
);
62+
expect(screen.root).toHaveStyle({ opacity: 0 });
63+
64+
await act(() => jest.advanceTimersByTime(250));
65+
expect(screen.root).toHaveStyle({ opacity: 1 });
66+
});
67+
});

‎src/matchers/__tests__/extend-expect.test.tsx

-13
This file was deleted.

‎src/matchers/__tests__/to-be-busy.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toBeBusy() basic case', () => {
76
render(

‎src/matchers/__tests__/to-be-checked.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React from 'react';
22
import { type AccessibilityRole, Switch, View } from 'react-native';
33
import render from '../../render';
44
import { screen } from '../../screen';
5-
import '../extend-expect';
65

76
function renderViewsWithRole(role: AccessibilityRole) {
87
render(

‎src/matchers/__tests__/to-be-disabled.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
View,
1212
} from 'react-native';
1313
import { render, screen } from '../..';
14-
import '../extend-expect';
1514

1615
test('toBeDisabled()/toBeEnabled() supports basic case', () => {
1716
render(

‎src/matchers/__tests__/to-be-empty-element.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from 'react';
22
import { View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
// eslint-disable-next-line @typescript-eslint/no-unused-vars
76
function DoNotRenderChildren({ children }: { children: React.ReactNode }) {

‎src/matchers/__tests__/to-be-expanded.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toBeExpanded() basic case', () => {
76
render(

‎src/matchers/__tests__/to-be-on-the-screen.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View, Text } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toBeOnTheScreen() example test', () => {
76
render(

‎src/matchers/__tests__/to-be-partially-checked.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React from 'react';
22
import { type AccessibilityRole, View } from 'react-native';
33
import render from '../../render';
44
import { screen } from '../../screen';
5-
import '../extend-expect';
65

76
function renderViewsWithRole(role: AccessibilityRole) {
87
return render(

‎src/matchers/__tests__/to-be-selected.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toBeSelected() basic case', () => {
76
render(

‎src/matchers/__tests__/to-be-visible.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View, Modal } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toBeVisible() on empty view', () => {
76
render(<View testID="view" />);

‎src/matchers/__tests__/to-contain-element.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toContainElement() supports basic case', () => {
76
render(

‎src/matchers/__tests__/to-have-accessibility-value.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
describe('toHaveAccessibilityValue', () => {
76
it('supports "accessibilityValue.min"', () => {

‎src/matchers/__tests__/to-have-accessible-name.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View, Text, TextInput, Image } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toHaveAccessibleName() handles view with "accessibilityLabel" prop', () => {
76
render(<View testID="view" accessibilityLabel="Test label" />);

‎src/matchers/__tests__/to-have-display-value.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { TextInput, View } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toHaveDisplayValue() example test', () => {
76
render(<TextInput testID="text-input" value="test" />);

‎src/matchers/__tests__/to-have-prop.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from 'react';
22
import { View, Text, TextInput } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toHaveProp() basic case', () => {
76
render(

‎src/matchers/__tests__/to-have-style.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from 'react';
22
import { StyleSheet, View, Pressable } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
const styles = StyleSheet.create({
76
container: { borderBottomColor: 'white' },

‎src/matchers/__tests__/to-have-text-content.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { View, Text } from 'react-native';
33
import { render, screen } from '../..';
4-
import '../extend-expect';
54

65
test('toHaveTextContent() example test', () => {
76
render(

‎src/user-event/__tests__/clear.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import * as React from 'react';
22
import { TextInput, TextInputProps, View } from 'react-native';
33
import { createEventLogger, getEventsNames } from '../../test-utils';
44
import { render, userEvent, screen } from '../..';
5-
import '../../matchers/extend-expect';
65

76
beforeEach(() => {
87
jest.useRealTimers();

‎src/user-event/__tests__/paste.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import * as React from 'react';
22
import { TextInput, TextInputProps, View } from 'react-native';
33
import { createEventLogger, getEventsNames } from '../../test-utils';
44
import { render, userEvent, screen } from '../..';
5-
import '../../matchers/extend-expect';
65

76
beforeEach(() => {
87
jest.useRealTimers();

‎src/user-event/scroll/__tests__/scroll-to-flat-list.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from 'react';
22
import { FlatList, ScrollViewProps, Text, View } from 'react-native';
33
import { render, screen } from '../../..';
4-
import '../../../matchers/extend-expect';
54
import { EventEntry, createEventLogger } from '../../../test-utils';
65
import { userEvent } from '../..';
76

‎src/user-event/type/__tests__/type.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import { TextInput, TextInputProps, View } from 'react-native';
33
import { createEventLogger, getEventsNames, lastEventPayload } from '../../../test-utils';
44
import { render, screen } from '../../..';
55
import { userEvent } from '../..';
6-
import '../../../matchers/extend-expect';
76

87
beforeEach(() => {
98
jest.useRealTimers();

0 commit comments

Comments
 (0)