Skip to content

Commit 1e95e14

Browse files
Update example to RN 0.80
1 parent 864a7e1 commit 1e95e14

File tree

11 files changed

+4822
-6035
lines changed

11 files changed

+4822
-6035
lines changed

.eslintrc.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,10 @@ module.exports = {
55
'react-native/no-inline-styles': 'off',
66
'@react-native/specs/react-native-modules': 'error',
77
},
8+
overrides: [
9+
{
10+
files: ['**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)'],
11+
extends: ['plugin:testing-library/react'],
12+
},
13+
],
814
};

example/.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,4 @@ dist/*
1414
local.properties
1515
msbuild.binlog
1616
node_modules/
17+
.kotlin/

example/android/build.gradle

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -24,20 +24,23 @@ buildscript {
2424

2525
allprojects {
2626
repositories {
27-
maven {
28-
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
29-
url({
30-
def searchDir = rootDir.toPath()
31-
do {
32-
def p = searchDir.resolve("node_modules/react-native/android")
33-
if (p.toFile().exists()) {
34-
return p.toRealPath().toString()
27+
{
28+
def searchDir = rootDir.toPath()
29+
do {
30+
def p = searchDir.resolve("node_modules/react-native/android")
31+
if (p.toFile().exists()) {
32+
maven {
33+
url(p.toRealPath().toString())
3534
}
36-
} while (searchDir = searchDir.getParent())
37-
throw new GradleException("Could not find `react-native`");
38-
}())
39-
}
35+
break
36+
}
37+
} while (searchDir = searchDir.getParent())
38+
// As of 0.80, React Native is no longer installed from npm
39+
}()
4040
mavenCentral()
4141
google()
4242
}
4343
}
44+
45+
rootProject.ext.set("react.compileSdkVersion", 35)
46+
rootProject.ext.set("react.targetSdkVersion", 35)

example/android/gradle/wrapper/gradle-wrapper.properties

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
distributionBase=GRADLE_USER_HOME
22
distributionPath=wrapper/dists
3-
distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-bin.zip
3+
distributionUrl=https\://services.gradle.org/distributions/gradle-8.14.1-bin.zip
44
networkTimeout=10000
55
validateDistributionUrl=true
66
zipStoreBase=GRADLE_USER_HOME

example/package.json

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -13,35 +13,33 @@
1313
"test": "jest"
1414
},
1515
"dependencies": {
16-
"@react-native-async-storage/async-storage": "^1.23.1",
16+
"@react-native-async-storage/async-storage": "^2.2.0",
1717
"@react-navigation/bottom-tabs": "^6.6.1",
18-
"@react-navigation/native": "^6.1.18",
18+
"@react-navigation/native": "^6.0.8",
1919
"@react-navigation/native-stack": "^6.11.0",
20-
"@react-navigation/stack": "^6.4.1",
21-
"react": "18.3.1",
22-
"react-native": "0.76.1",
23-
"react-native-gesture-handler": "^2.20.2",
24-
"react-native-safe-area-context": "link:../",
25-
"react-native-screens": "^3.35.0"
20+
"@react-navigation/stack": "^6.3.21",
21+
"react": "19.1.0",
22+
"react-native": "^0.80.1",
23+
"react-native-gesture-handler": "^2.26.0",
24+
"react-native-safe-area-context": "^5.4.0",
25+
"react-native-screens": "^4.11.1"
2626
},
2727
"devDependencies": {
2828
"@babel/core": "^7.20.0",
2929
"@babel/preset-env": "^7.20.0",
3030
"@babel/runtime": "^7.20.0",
31-
"@react-native-community/cli": "^14.1.1",
32-
"@react-native/babel-preset": "0.76.1",
33-
"@react-native/eslint-config": "0.76.1",
34-
"@react-native/metro-config": "0.76.1",
31+
"@react-native-community/cli": "^19.0.0",
32+
"@react-native/babel-preset": "^0.80.1",
33+
"@react-native/eslint-config": "^0.80.1",
34+
"@react-native/metro-config": "^0.80.1",
3535
"@react-native/typescript-config": "0.76.1",
3636
"@rnx-kit/metro-config": "^2.0.1",
3737
"@types/react": "^18.3.11",
38-
"@types/react-test-renderer": "^18.3.0",
3938
"babel-jest": "^29.6.3",
4039
"eslint": "^8.19.0",
41-
"jest": "^29.6.3",
40+
"jest": "^29.2.1",
4241
"prettier": "2.8.8",
43-
"react-native-test-app": "^3.10.18",
44-
"react-test-renderer": "18.3.1",
42+
"react-native-test-app": "^4.3.15",
4543
"typescript": "5.6.3"
4644
},
4745
"engines": {

example/yarn.lock

Lines changed: 2021 additions & 2238 deletions
Large diffs are not rendered by default.

package.json

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -61,30 +61,32 @@
6161
"devDependencies": {
6262
"@commitlint/config-conventional": "^19.2.2",
6363
"@jest/globals": "^29.7.0",
64-
"@react-native/babel-preset": "^0.74.84",
65-
"@react-native/eslint-config": "^0.74.84",
66-
"@react-native/eslint-plugin-specs": "^0.74.84",
64+
"@react-native/babel-preset": "^0.80.1",
65+
"@react-native/eslint-config": "^0.80.1",
66+
"@react-native/eslint-plugin-specs": "^0.80.1",
6767
"@release-it/conventional-changelog": "^8.0.1",
68-
"@types/react": "^18.3.3",
69-
"@types/react-dom": "^18.3.0",
70-
"@types/react-test-renderer": "^18.3.0",
68+
"@testing-library/react-native": "^13.2.0",
69+
"@types/react": "^19.0.0",
70+
"@types/react-dom": "^19.0.0",
7171
"@typescript-eslint/eslint-plugin": "^7.14.1",
7272
"@typescript-eslint/parser": "^7.14.1",
7373
"babel-plugin-module-resolver": "^5.0.2",
7474
"clang-format": "^1.8.0",
7575
"commitlint": "^19.3.0",
7676
"eslint": "^8.57.0",
77+
"eslint-plugin-ft-flow": "^3.0.11",
7778
"eslint-plugin-jest": "^28.6.0",
7879
"eslint-config-prettier": "^9.1.0",
7980
"eslint-plugin-prettier": "^5.1.3",
81+
"eslint-plugin-testing-library": "^7.5.4",
8082
"husky": "^9.0.11",
81-
"jest": "^29.7.0",
83+
"jest": "^29.2.1",
8284
"prettier": "^3.3.2",
83-
"react": "^18.3.1",
84-
"react-dom": "^18.3.1",
85-
"react-native": "^0.74.2",
85+
"react": "19.1.0",
86+
"react-dom": "^19.1.0",
87+
"react-native": "^0.80.1",
8688
"react-native-builder-bob": "^0.23.2",
87-
"react-test-renderer": "^18.3.1",
89+
"react-test-renderer": "^19.1.0",
8890
"release-it": "^17.4.0",
8991
"typescript": "^5.5.2"
9092
},

src/__tests__/SafeAreaContext-test.tsx

Lines changed: 20 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { describe, expect, it, jest } from '@jest/globals';
2+
import { act, render, screen } from '@testing-library/react-native';
23
import * as React from 'react';
34
import { View } from 'react-native';
4-
import * as ReactTestRenderer from 'react-test-renderer';
5-
import { NativeSafeAreaProvider } from '../NativeSafeAreaProvider';
65
import type { Metrics } from '../SafeArea.types';
76
import {
87
SafeAreaProvider,
@@ -40,66 +39,64 @@ const PrintInsetsTestView = () => {
4039

4140
describe('SafeAreaContext', () => {
4241
it('renders', () => {
43-
const component = ReactTestRenderer.create(<SafeAreaProvider />);
44-
expect(component).toMatchSnapshot();
42+
const { toJSON } = render(<SafeAreaProvider />);
43+
expect(toJSON()).toMatchSnapshot();
4544
});
4645

4746
it('does not render child until inset values are received', () => {
48-
const component = ReactTestRenderer.create(
47+
const { toJSON } = render(
4948
<SafeAreaProvider>
5049
<PrintInsetsTestView />
5150
</SafeAreaProvider>,
5251
);
53-
expect(component).toMatchSnapshot();
52+
expect(toJSON()).toMatchSnapshot();
5453
});
5554

56-
it('renders child when inset values are received', () => {
57-
const component = ReactTestRenderer.create(
58-
<SafeAreaProvider>
55+
it('renders child when inset values are received', async () => {
56+
const { toJSON } = render(
57+
<SafeAreaProvider testID="safe-area-provider">
5958
<PrintInsetsTestView />
6059
</SafeAreaProvider>,
6160
);
62-
expect(component).toMatchSnapshot();
63-
const { onInsetsChange } = component.root.findByType(
64-
NativeSafeAreaProvider,
65-
).props;
66-
ReactTestRenderer.act(() => {
67-
onInsetsChange({
61+
expect(toJSON()).toMatchSnapshot();
62+
const element = await screen.findByTestId('safe-area-provider');
63+
act(() => {
64+
element.props.onInsetsChange({
6865
nativeEvent: TEST_METRICS_1,
6966
});
7067
});
71-
expect(component).toMatchSnapshot();
68+
expect(toJSON()).toMatchSnapshot();
7269
});
7370

7471
it('supports setting initial insets', () => {
75-
const component = ReactTestRenderer.create(
72+
const { toJSON } = render(
7673
<SafeAreaProvider initialMetrics={TEST_METRICS_1}>
7774
<PrintInsetsTestView />
7875
</SafeAreaProvider>,
7976
);
80-
expect(component).toMatchSnapshot();
77+
expect(toJSON()).toMatchSnapshot();
8178
});
8279

8380
it('uses parent insets when available', () => {
84-
const component = ReactTestRenderer.create(
81+
const { toJSON } = render(
8582
<SafeAreaProvider initialMetrics={TEST_METRICS_1}>
8683
<SafeAreaProvider>
8784
<PrintInsetsTestView />
8885
</SafeAreaProvider>
8986
</SafeAreaProvider>,
9087
);
91-
expect(component).toMatchSnapshot();
88+
expect(toJSON()).toMatchSnapshot();
9289
});
9390

9491
it('uses inner insets', () => {
95-
const component = ReactTestRenderer.create(
92+
const { toJSON } = render(
9693
<SafeAreaProvider initialMetrics={TEST_METRICS_1}>
9794
<SafeAreaProvider initialMetrics={TEST_METRICS_2}>
9895
<PrintInsetsTestView />
9996
</SafeAreaProvider>
10097
</SafeAreaProvider>,
10198
);
102-
expect(component).toMatchSnapshot();
99+
expect(toJSON()).toMatchSnapshot();
103100
});
104101

105102
it('throws when no provider is rendered', () => {
@@ -112,7 +109,7 @@ describe('SafeAreaContext', () => {
112109
}
113110
});
114111
expect(() => {
115-
ReactTestRenderer.create(<PrintInsetsTestView />);
112+
render(<PrintInsetsTestView />);
116113
}).toThrow(
117114
'No safe area value available. Make sure you are rendering `<SafeAreaProvider>` at the top of your app.',
118115
);
Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { describe, expect, it } from '@jest/globals';
2+
import { render } from '@testing-library/react-native';
23
import * as React from 'react';
34
import { View } from 'react-native';
4-
import * as ReactTestRenderer from 'react-test-renderer';
55
import type { Metrics } from '../SafeArea.types';
66
import { SafeAreaProvider } from '../SafeAreaContext';
77
import { SafeAreaView } from '../SafeAreaView';
@@ -13,40 +13,40 @@ const INITIAL_METRICS: Metrics = {
1313

1414
describe('SafeAreaView', () => {
1515
it('renders', () => {
16-
const component = ReactTestRenderer.create(
16+
const { toJSON } = render(
1717
<SafeAreaProvider initialMetrics={INITIAL_METRICS}>
1818
<SafeAreaView>
1919
<View />
2020
</SafeAreaView>
2121
</SafeAreaProvider>,
2222
);
23-
expect(component).toMatchSnapshot();
23+
expect(toJSON()).toMatchSnapshot();
2424
});
2525

2626
it('can override padding styles', () => {
27-
const component = ReactTestRenderer.create(
27+
const { toJSON } = render(
2828
<SafeAreaProvider initialMetrics={INITIAL_METRICS}>
2929
<SafeAreaView style={{ paddingTop: 0 }}>
3030
<View />
3131
</SafeAreaView>
3232
</SafeAreaProvider>,
3333
);
34-
expect(component).toMatchSnapshot();
34+
expect(toJSON()).toMatchSnapshot();
3535
});
3636

3737
it('can set edges', () => {
38-
const component = ReactTestRenderer.create(
38+
const { toJSON } = render(
3939
<SafeAreaProvider initialMetrics={INITIAL_METRICS}>
4040
<SafeAreaView edges={['top', 'bottom']}>
4141
<View />
4242
</SafeAreaView>
4343
</SafeAreaProvider>,
4444
);
45-
expect(component).toMatchSnapshot();
45+
expect(toJSON()).toMatchSnapshot();
4646
});
4747

4848
it('can set edges value type', () => {
49-
const component = ReactTestRenderer.create(
49+
const { toJSON } = render(
5050
<SafeAreaProvider initialMetrics={INITIAL_METRICS}>
5151
<SafeAreaView
5252
edges={{ top: 'additive', bottom: 'maximum' }}
@@ -56,6 +56,6 @@ describe('SafeAreaView', () => {
5656
</SafeAreaView>
5757
</SafeAreaProvider>,
5858
);
59-
expect(component).toMatchSnapshot();
59+
expect(toJSON()).toMatchSnapshot();
6060
});
6161
});

src/__tests__/__snapshots__/SafeAreaContext-test.tsx.snap

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ exports[`SafeAreaContext renders child when inset values are received 1`] = `
3939
undefined,
4040
]
4141
}
42+
testID="safe-area-provider"
4243
/>
4344
`;
4445

@@ -53,6 +54,7 @@ exports[`SafeAreaContext renders child when inset values are received 2`] = `
5354
undefined,
5455
]
5556
}
57+
testID="safe-area-provider"
5658
>
5759
<View
5860
style={

0 commit comments

Comments
 (0)