Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

RNTester: Fix playground icon & test details button (#50530)

Browse Source 
Summary:
Some minor fixes in the RNTester that were bugging me a bit:

- Playground tab icon is not displaying the correct icon when the tab is active.
- The RNTTestDetails button is being displayed when there is nothing to display.
- Export the data for the Playground tab correctly to display the description.

## Changelog:

[INTERNAL] - RNTester: Fix playground icon & test details button

Pull Request resolved: https://github.com/facebook/react-native/pull/50530

Test Plan:
<details>
<summary>Screenshots</summary>

| Before                           | After                          |
|------------------------------------|------------------------------------|
| ![Screenshot_1744044385](https://github.com/user-attachments/assets/d4a08423-531b-49a8-b3c5-314e0bd55b4c) | ![Screenshot_1744044377](https://github.com/user-attachments/assets/c36cde64-d48d-4f80-95db-2e4f9765b350) |

</details>

Reviewed By: NickGerleman

Differential Revision: D72576804

Pulled By: cortinico

fbshipit-source-id: 8555677a5121fe908c18d349e80ce8097d144fe5
This commit is contained in:
Mateo Guzmán
2025-04-09 06:36:36 -07:00
committed by Facebook GitHub Bot
parent 163a3732a0
commit 0617accecd
3 changed files with 28 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/rn-tester/js/components/RNTTestDetails.js
+25 -24
View File
@@ -25,30 +25,31 @@ function RNTTestDetails({
}): React.Node {
const [collapsed, setCollapsed] = React.useState(true);
const content = (
<>
{description == null ? null : (
<View style={styles.section}>
<Text style={[styles.heading, {color: theme.LabelColor}]}>
Description
</Text>
<Text style={[styles.paragraph, {color: theme.LabelColor}]}>
{description}
</Text>
</View>
)}
{expect == null ? null : (
<View style={styles.section}>
<Text style={[styles.heading, {color: theme.LabelColor}]}>
Expectation
</Text>
<Text style={[styles.paragraph, {color: theme.LabelColor}]}>
{expect}
</Text>
</View>
)}
</>
);
const content =
description == null && expect == null ? null : (
<>
{description == null ? null : (
<View style={styles.section}>
<Text style={[styles.heading, {color: theme.LabelColor}]}>
Description
</Text>
<Text style={[styles.paragraph, {color: theme.LabelColor}]}>
{description}
</Text>
</View>
)}
{expect == null ? null : (
<View style={styles.section}>
<Text style={[styles.heading, {color: theme.LabelColor}]}>
Expectation
</Text>
<Text style={[styles.paragraph, {color: theme.LabelColor}]}>
{expect}
</Text>
</View>
)}
</>
);
return (
<View
style={StyleSheet.compose(styles.container, {
packages/rn-tester/js/components/RNTesterTheme.js
+2 -2
View File
@@ -133,8 +133,8 @@ export const RNTesterDarkTheme = {
NavBarComponentsInactiveIcon: require('./../assets/bottom-nav-components-icon-dark.png'),
NavBarAPIsActiveIcon: require('./../assets/bottom-nav-apis-icon-light.png'),
NavBarAPIsInactiveIcon: require('./../assets/bottom-nav-apis-icon-dark.png'),
NavBarPlaygroundActiveIcon: require('./../assets/bottom-nav-playgrounds-icon-dark.png'),
NavBarPlaygroundInactiveIcon: require('./../assets/bottom-nav-playgrounds-icon-light.png'),
NavBarPlaygroundActiveIcon: require('./../assets/bottom-nav-playgrounds-icon-light.png'),
NavBarPlaygroundInactiveIcon: require('./../assets/bottom-nav-playgrounds-icon-dark.png'),
};
export const themes = {light: RNTesterLightTheme, dark: RNTesterDarkTheme};
packages/rn-tester/js/examples/Playground/RNTesterPlayground.js
+1
View File
@@ -34,5 +34,6 @@ const styles = StyleSheet.create({
export default ({
title: 'Playground',
name: 'playground',
description: 'Test out new features and ideas.',
render: (): React.Node => <Playground />,
}: RNTesterModuleExample);