From c2b699abc565c43e5289341a8b7f2694fe1229f0 Mon Sep 17 00:00:00 2001 From: Gabriel Donadel Dall'Agnol Date: Thu, 22 Sep 2022 03:14:51 -0700 Subject: [PATCH] chore: Fix RNTester typos (#34757) Summary: While working on https://github.com/facebook/react-native/pull/34550 I noticed that a couple of words inside the RNTester package were misspelled, this gave me the idea to test other files as well using the VS Code extension [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) which unveiled quite a few other typos. ## Changelog [Internal] [Fixed] - Fix RNTester typos Pull Request resolved: https://github.com/facebook/react-native/pull/34757 Test Plan: Shouldn't require much testing as this is just fixing some typos inside the RNTester package. Reviewed By: dmytrorykun Differential Revision: D39722889 Pulled By: cortinico fbshipit-source-id: a575ab8337586c5fe2d68ce73d2aae27d24a6384 --- packages/rn-tester/js/examples/Alert/AlertExample.js | 2 +- .../js/examples/Experimental/PlatformTest/README.md | 6 +++--- .../PlatformTest/RNTesterPlatformTestEventRecorder.js | 2 +- .../PlatformTest/RNTesterPlatformTestResultView.js | 4 ++-- .../PlatformTest/RNTesterPlatformTestTypes.js | 2 +- .../Experimental/PlatformTest/usePlatformTestHarness.js | 6 +++--- .../PointerEventPointerMove.js | 4 ++-- .../js/examples/FlatList/BaseFlatListExample.js | 2 +- .../js/examples/FlatList/FlatList-withSeparators.js | 4 ++-- .../rn-tester/js/examples/Keyboard/KeyboardExample.js | 4 ++-- .../js/examples/ScrollView/ScrollViewExample.js | 9 ++++----- .../examples/SectionList/SectionList-withSeparators.js | 4 ++-- .../rn-tester/js/examples/Transform/TransformExample.js | 6 +++--- packages/rn-tester/js/utils/testerStateUtils.js | 6 ++++-- 14 files changed, 31 insertions(+), 30 deletions(-) diff --git a/packages/rn-tester/js/examples/Alert/AlertExample.js b/packages/rn-tester/js/examples/Alert/AlertExample.js index 94f16e95111560..fc354a16af174a 100644 --- a/packages/rn-tester/js/examples/Alert/AlertExample.js +++ b/packages/rn-tester/js/examples/Alert/AlertExample.js @@ -309,7 +309,7 @@ export default ({ category: 'UI', documentationURL: 'https://reactnative.dev/docs/alert', description: - 'Alerts display a concise and informative messageand prompt the user to make a decision.', + 'Alerts display a concise and informative message and prompt the user to make a decision.', showIndividualExamples: true, examples, }: RNTesterModule); diff --git a/packages/rn-tester/js/examples/Experimental/PlatformTest/README.md b/packages/rn-tester/js/examples/Experimental/PlatformTest/README.md index 804e80900fb193..02365c92f4a467 100644 --- a/packages/rn-tester/js/examples/Experimental/PlatformTest/README.md +++ b/packages/rn-tester/js/examples/Experimental/PlatformTest/README.md @@ -22,11 +22,11 @@ function ExampleTestCase ({ harness }) { /* ... */ } ``` -As of writting this README there are 2 different types of tests that the `harness` prop provides: +As of writing this README there are 2 different types of tests that the `harness` prop provides: ### `test(testcase: (TestContext) => void, testName: string, options?: TestOptions)` -This is a method to create "regular" test reminicent of other frameworks such as Jest. These are meant to be run imperatively, and while that means that they technically could work in a `useEffect` hook as a way to run the test "on mount" — it is instead recommended to try and keep these tests in callbacks instead. A good alternative to running the test on mount would be to instead put the test in a callback and render a "Start Test" button which executes the callback. +This is a method to create "regular" test reminiscent of other frameworks such as Jest. These are meant to be run imperatively, and while that means that they technically could work in a `useEffect` hook as a way to run the test "on mount" — it is instead recommended to try and keep these tests in callbacks instead. A good alternative to running the test on mount would be to instead put the test in a callback and render a "Start Test" button which executes the callback. The first argument is the closure in which you will run your test and make assertions. The assertions are contained in the `TestContext` object which is provided in the test closure's first argument and contains the following assertions: @@ -88,7 +88,7 @@ Here's what a basic example would look like for verifying that `pointermove` eve ```js function BasicPointerMoveTestCase({harness}) { - const testPointerMove = harness.useAsyncTest('pointermove event recieved'); + const testPointerMove = harness.useAsyncTest('pointermove event received'); return ( = []; relevantEvents: Array = []; rawOrder: number = 1; - eventsInScope: Array = []; // Tracks syncronous event dispatches + eventsInScope: Array = []; // Tracks synchronous event dispatches recording: boolean = true; mergeTypesTruthMap: {[string]: boolean} = {}; diff --git a/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestResultView.js b/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestResultView.js index d33f5ba82c14b0..8cdc2d0491568e 100644 --- a/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestResultView.js +++ b/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestResultView.js @@ -82,7 +82,7 @@ function FilterModalButton(props: FilterModalProps) { transparent={true}> @@ -373,7 +373,7 @@ const styles = StyleSheet.create({ borderColor: 'rgb(171, 171, 171)', borderRadius: 8, }, - filterModalKeboardAvoidingRoot: { + filterModalKeyboardAvoidingRoot: { flex: 1, alignItems: 'center', justifyContent: 'center', diff --git a/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestTypes.js b/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestTypes.js index 834cc7dad6627a..89678a796db76b 100644 --- a/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestTypes.js +++ b/packages/rn-tester/js/examples/Experimental/PlatformTest/RNTesterPlatformTestTypes.js @@ -34,7 +34,7 @@ export type PlatformTestResult = $ReadOnly<{| name: string, status: PlatformTestResultStatus, assertions: $ReadOnlyArray, - error: mixed | null, // null is technically unecessary but is kept to ensure the error is described as nullable + error: mixed | null, // null is technically unnecessary but is kept to ensure the error is described as nullable |}>; export type PlatformTestContext = $ReadOnly<{ diff --git a/packages/rn-tester/js/examples/Experimental/PlatformTest/usePlatformTestHarness.js b/packages/rn-tester/js/examples/Experimental/PlatformTest/usePlatformTestHarness.js index 1fa835e329c9bd..967c336baae093 100644 --- a/packages/rn-tester/js/examples/Experimental/PlatformTest/usePlatformTestHarness.js +++ b/packages/rn-tester/js/examples/Experimental/PlatformTest/usePlatformTestHarness.js @@ -144,7 +144,7 @@ export default function usePlatformTestHarness(): PlatformTestHarnessHookResult $ReadOnlyArray, >([]); - // Since updaing the test results array can get expensive at larger sizes + // Since updating the test results array can get expensive at larger sizes // we use a basic debouncing logic to minimize the number of re-renders // caused by adding test results const resultQueueRef = useRef>([]); @@ -174,7 +174,7 @@ export default function usePlatformTestHarness(): PlatformTestHarnessHookResult [scheduleResultsCommit], ); - // When reseting the test results we should also re-mount the + // When resetting the test results we should also re-mount the // so we apply a key to that component which we can increment // to ensure it re-mounts const [testElementKey, setTestElementKey] = useState(0); @@ -220,7 +220,7 @@ export default function usePlatformTestHarness(): PlatformTestHarnessHookResult 'assert_true', cond, desc, - "expected 'true' but recieved 'false'", + "expected 'true' but received 'false'", ), assert_equals: (a: any, b: any, desc: string) => baseAssert( diff --git a/packages/rn-tester/js/examples/Experimental/W3CPointerEventPlatformTests/PointerEventPointerMove.js b/packages/rn-tester/js/examples/Experimental/W3CPointerEventPlatformTests/PointerEventPointerMove.js index 976b20aaf9d48f..680a191c79c185 100644 --- a/packages/rn-tester/js/examples/Experimental/W3CPointerEventPlatformTests/PointerEventPointerMove.js +++ b/packages/rn-tester/js/examples/Experimental/W3CPointerEventPlatformTests/PointerEventPointerMove.js @@ -8,7 +8,7 @@ * @flow */ -// adapated from https://github.com/web-platform-tests/wpt/blob/master/pointerevents/pointerevent_pointermove.html +// adapted from https://github.com/web-platform-tests/wpt/blob/master/pointerevents/pointerevent_pointermove.html import type {PlatformTestComponentBaseProps} from '../PlatformTest/RNTesterPlatformTestTypes'; import type {PointerEvent} from 'react-native/Libraries/Types/CoreEventTypes'; @@ -25,7 +25,7 @@ function PointerEventPointerMoveTestCase( const {harness} = props; const detectedPointerTypesRef = useRef({}); - const testPointerMove = harness.useAsyncTest('pointermove event recieved'); + const testPointerMove = harness.useAsyncTest('pointermove event received'); const handlers = useTestEventHandler( ['pointerMove'], diff --git a/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js b/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js index 211706ced3c8b5..0f07b9847bac41 100644 --- a/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js +++ b/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js @@ -144,7 +144,7 @@ const styles = StyleSheet.create({ separator: { height: 12, }, - separtorText: { + separatorText: { fontSize: 10, }, list: { diff --git a/packages/rn-tester/js/examples/FlatList/FlatList-withSeparators.js b/packages/rn-tester/js/examples/FlatList/FlatList-withSeparators.js index 9a0f0294891f9e..9f8a8881bb8bf8 100644 --- a/packages/rn-tester/js/examples/FlatList/FlatList-withSeparators.js +++ b/packages/rn-tester/js/examples/FlatList/FlatList-withSeparators.js @@ -32,7 +32,7 @@ const Separator = styles.separator, {backgroundColor: highlighted ? highlightColor : defaultColor}, ]}> - {text} + {text} ); }; @@ -50,7 +50,7 @@ const styles = StyleSheet.create({ separator: { height: 12, }, - separtorText: { + separatorText: { fontSize: 10, }, }); diff --git a/packages/rn-tester/js/examples/Keyboard/KeyboardExample.js b/packages/rn-tester/js/examples/Keyboard/KeyboardExample.js index 47d8883ea937d1..becaea73e95fbc 100644 --- a/packages/rn-tester/js/examples/Keyboard/KeyboardExample.js +++ b/packages/rn-tester/js/examples/Keyboard/KeyboardExample.js @@ -20,12 +20,12 @@ import * as React from 'react'; import {useEffect, useState} from 'react'; import {Keyboard, StyleSheet, Text, View} from 'react-native'; -type KeybpardEventViewerProps = { +type KeyboardEventViewerProps = { showEvent: 'keyboardWillShow' | 'keyboardDidShow', hideEvent: 'keyboardWillHide' | 'keyboardDidHide', }; -const KeyboardEventViewer = (props: KeybpardEventViewerProps): React.Node => { +const KeyboardEventViewer = (props: KeyboardEventViewerProps): React.Node => { const {showEvent, hideEvent} = props; const [isShown, setIsShown] = useState(false); const [lastEvent, setLastEvent] = useState(); diff --git a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js index b023f0c7e78db0..eb34fc30fe8760 100644 --- a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js +++ b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js @@ -658,7 +658,7 @@ const ScrollIndicatorExample = () => { const [scrollIndicatorInsets, setScrollIndicatorInsets] = useState(null); const [showsHorizontalScrollIndic, setShowsHorizontalScrollIndic] = useState(true); - const [showsVerticallScrollIndic, setShowsVerticalScrollIndic] = + const [showsVerticalScrollIndic, setShowsVerticalScrollIndic] = useState(true); return ( @@ -667,7 +667,7 @@ const ScrollIndicatorExample = () => { contentInset={{top: 10, bottom: 10, left: 10, right: 10}} scrollIndicatorInsets={scrollIndicatorInsets} showsHorizontalScrollIndicator={showsHorizontalScrollIndic} - showsVerticalScrollIndicator={showsVerticallScrollIndic} + showsVerticalScrollIndicator={showsVerticalScrollIndic} nestedScrollEnabled> {ITEMS.map(createItemRow)} @@ -699,10 +699,9 @@ const ScrollIndicatorExample = () => { />