Fix spelling errors and typos (#19138)

Author: rickhanlonii

.github/PULL_REQUEST_TEMPLATE.md

@@ -12,7 +12,7 @@
   6. If you need a debugger, run `yarn debug-test --watch TestName`, open `chrome://inspect`, and press "Inspect".
   7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`).
   8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files.
-  9. Run the [Flow](https://flowtype.org/) typechecks (`yarn flow`).
+  9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`).
   10. If you haven't already, complete the CLA.
 
   Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html

fixtures/dom/src/components/fixtures/hydration/index.js

@@ -105,7 +105,7 @@ class Hydration extends React.Component {
             Version:
             <VersionPicker
               id="hydration_version"
-              name="hyration_version"
+              name="hydration_version"
               version={version}
               onChange={this.setVersion}
             />

fixtures/tracing/index.html

@@ -65,7 +65,7 @@ <h3>
 
     <script>
       if (window.location.search.includes('puppeteer=true')) {
-        // Colocated calls to performance.now() often yield different values in Puppeteer.
+        // Collocated calls to performance.now() often yield different values in Puppeteer.
         // This causes the Scheduler API test to fail.
         // For the purposes of our automated release scripts,
         // Coerce tests to use Date.now() instead to reduce the chances of a false positive.

packages/eslint-plugin-react-hooks/src/RulesOfHooks.js

@@ -536,7 +536,7 @@ export default {
  * easy. For anonymous function expressions it is much harder. If you search for
  * `IsAnonymousFunctionDefinition()` in the ECMAScript spec you'll find places
  * where JS gives anonymous function expressions names. We roughly detect the
- * same AST nodes with some exceptions to better fit our usecase.
+ * same AST nodes with some exceptions to better fit our use case.
  */
 
 function getFunctionName(node) {

packages/react-devtools-core/README.md

@@ -21,7 +21,7 @@ Be sure to run this function *before* importing e.g. `react`, `react-dom`, `reac
 The `config` object may contain:
 * `host: string` (defaults to "localhost") - Websocket will connect to this host.
 * `port: number` (defaults to `8097`) - Websocket will connect to this port.
-* `websocket: Websocket` - Custom websocked to use. Overrides `host` and `port` settings if provided.
+* `websocket: Websocket` - Custom websocket to use. Overrides `host` and `port` settings if provided.
 * `resolveRNStyle: (style: number) => ?Object` - Used by the React Native style plug-in.
 * `isAppActive: () => boolean` - If provided, DevTools will poll this method and wait until it returns true before connecting to React.
 
@@ -50,4 +50,4 @@ yarn start:backend
 Watch for changes made to the standalone UI entry point and rebuild:
 ```sh
 yarn start:standalone
-```
+```

packages/react-devtools-extensions/src/renderer.js

@@ -1,7 +1,7 @@
 /**
  * In order to support reload-and-profile functionality, the renderer needs to be injected before any other scripts.
  * Since it is a complex file (with imports) we can't just toString() it like we do with the hook itself,
- * So this entry point (one of the web_accessible_resources) provcides a way to eagerly inject it.
+ * So this entry point (one of the web_accessible_resources) provides a way to eagerly inject it.
  * The hook will look for the presence of a global __REACT_DEVTOOLS_ATTACH__ and attach an injected renderer early.
  * The normal case (not a reload-and-profile) will not make use of this entry point though.
  *

packages/react-devtools-inline/README.md

@@ -85,7 +85,7 @@ initializeBackend(contentWindow);
 
 // React application can be injected into <iframe> at any time now...
 // Note that this would need to be done via <script> tag injection,
-// as setting the src of the <iframe> would load a new page (withou the injected backend).
+// as setting the src of the <iframe> would load a new page (without the injected backend).
 
 // Initialize DevTools UI to listen to the hook we just installed.
 // This returns a React component we can render anywhere in the parent window.
@@ -107,7 +107,7 @@ Sandboxed `iframe`s are also supported but require more complex initialization.
 ```js
 import { activate, initialize } from "react-devtools-inline/backend";
 
-// The DevTooks hook needs to be installed before React is even required!
+// The DevTools hook needs to be installed before React is even required!
 // The safest way to do this is probably to install it in a separate script tag.
 initialize(window);
 
@@ -177,4 +177,4 @@ Once the above packages have been built or downloaded, you can watch for changes
 yarn start
 ```
 
-To test package changes, refer to the [`react-devtools-shell` README](https://github.com/facebook/react/blob/master/packages/react-devtools-shell/README.md).
+To test package changes, refer to the [`react-devtools-shell` README](https://github.com/facebook/react/blob/master/packages/react-devtools-shell/README.md).

packages/react-devtools-shared/src/__tests__/setupTests.js

@@ -21,7 +21,7 @@ env.beforeEach(() => {
   // it's too late for a test to mock the clipboard-js modules.
   jest.mock('clipboard-js', () => ({copy: global.mockClipboardCopy}));
 
-  // These files should be required (and re-reuired) before each test,
+  // These files should be required (and re-required) before each test,
   // rather than imported at the head of the module.
   // That's because we reset modules between tests,
   // which disconnects the DevTool's cache from the current dispatcher ref.

packages/react-devtools-shared/src/__tests__/store-test.js

@@ -867,19 +867,19 @@ describe('Store', () => {
     }
 
     const MyComponent = (props, ref) => null;
-    const FowardRefComponent = React.forwardRef(MyComponent);
+    const ForwardRefComponent = React.forwardRef(MyComponent);
     const MyComponent2 = (props, ref) => null;
-    const FowardRefComponentWithAnonymousFunction = React.forwardRef(() => (
+    const ForwardRefComponentWithAnonymousFunction = React.forwardRef(() => (
       <MyComponent2 />
     ));
     const MyComponent3 = (props, ref) => null;
-    const FowardRefComponentWithCustomDisplayName = React.forwardRef(
+    const ForwardRefComponentWithCustomDisplayName = React.forwardRef(
       MyComponent3,
     );
-    FowardRefComponentWithCustomDisplayName.displayName = 'Custom';
+    ForwardRefComponentWithCustomDisplayName.displayName = 'Custom';
     const MyComponent4 = (props, ref) => null;
     const MemoComponent = React.memo(MyComponent4);
-    const MemoForwardRefComponent = React.memo(FowardRefComponent);
+    const MemoForwardRefComponent = React.memo(ForwardRefComponent);
     const MyComponent5 = (props, ref) => null;
     const LazyComponent = React.lazy(() => fakeImport(MyComponent5));
 
@@ -896,9 +896,9 @@ describe('Store', () => {
     const App = () => (
       <React.Fragment>
         <MyComponent />
-        <FowardRefComponent />
-        <FowardRefComponentWithAnonymousFunction />
-        <FowardRefComponentWithCustomDisplayName />
+        <ForwardRefComponent />
+        <ForwardRefComponentWithAnonymousFunction />
+        <ForwardRefComponentWithCustomDisplayName />
         <MemoComponent />
         <MemoForwardRefComponent />
         <React.Suspense fallback="Loading...">

packages/react-devtools-shared/src/__tests__/utils.js

@@ -41,7 +41,7 @@ export async function actAsync(
   const {act: actTestRenderer} = require('react-test-renderer');
   const {act: actDOM} = require('react-dom/test-utils');
 
-  // $FlowFixMe Flow doens't know about "await act()" yet
+  // $FlowFixMe Flow doesn't know about "await act()" yet
   await actDOM(async () => {
     await actTestRenderer(async () => {
       await cb();
@@ -50,7 +50,7 @@ export async function actAsync(
 
   if (recursivelyFlush) {
     while (jest.getTimerCount() > 0) {
-      // $FlowFixMe Flow doens't know about "await act()" yet
+      // $FlowFixMe Flow doesn't know about "await act()" yet
       await actDOM(async () => {
         await actTestRenderer(async () => {
           jest.runAllTimers();