Skip to content

Commit 18327d4

Browse files
Jhon Mikelex111
Jhon Mike
authored andcommitted
Formateed react-v16.9.0 post (#2501)
* format post react-v16.9.0 * running yarn check-all
1 parent cbd3401 commit 18327d4

File tree

3 files changed

+17
-18
lines changed

3 files changed

+17
-18
lines changed

content/blog/2019-08-08-react-v16.9.0.md

+9-10
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ const userProfile = {
4848
};
4949
// This will now warn:
5050
<a href={userProfile.website}>Profile</a>
51-
````
51+
```
5252

5353
**In React 16.9,** this pattern continues to work, but it will log a warning. If you use `javascript:` URLs for logic, try to use React event handlers instead. (As a last resort, you can circumvent the protection with [`dangerouslySetInnerHTML`](/docs/dom-elements.html#dangerouslysetinnerhtml), but it is highly discouraged and often leads to security holes.)
5454

@@ -70,7 +70,6 @@ This pattern was almost never used in the wild, and supporting it causes React t
7070

7171
We don't expect most codebases to be affected by this.
7272

73-
7473
## New Features {#new-features}
7574

7675
### Async [`act()`](/docs/test-utils.html#act) for Testing {#async-act-for-testing}
@@ -89,7 +88,7 @@ An update to SomeComponent inside a test was not wrapped in act(...).
8988
await act(async () => {
9089
// ...
9190
});
92-
````
91+
```
9392

9493
This solves the remaining cases where you couldn't use `act()` before, such as when the state update was inside an asynchronous function. As a result, **you should be able to fix all the remaining `act()` warnings in your tests now.**
9594

@@ -209,12 +208,12 @@ Refer to the documentation for [detailed installation instructions](/docs/instal
209208

210209
### React {#react}
211210

212-
* Add `<React.Profiler>` API for gathering performance measurements programmatically. ([@bvaughn](https://github.com/bvaughn) in [#15172](https://github.com/facebook/react/pull/15172))
211+
* Add `<React.Profiler>` API for gathering performance measurements programmatically. ([@bvaughn](https://github.com/bvaughn) in [#15172](https://github.com/facebook/react/pull/15172))
213212
* Remove `unstable_ConcurrentMode` in favor of `unstable_createRoot`. ([@acdlite](https://github.com/acdlite) in [#15532](https://github.com/facebook/react/pull/15532))
214213

215-
### React DOM
214+
### React DOM {#react-dom}
216215

217-
* Deprecate old names for the `UNSAFE_*` lifecycle methods. ([@bvaughn](https://github.com/bvaughn) in [#15186](https://github.com/facebook/react/pull/15186) and [@threepointone](https://github.com/threepointone) in [#16103](https://github.com/facebook/react/pull/16103))
216+
* Deprecate old names for the `UNSAFE_*` lifecycle methods. ([@bvaughn](https://github.com/bvaughn) in [#15186](https://github.com/facebook/react/pull/15186) and [@threepointone](https://github.com/threepointone) in [#16103](https://github.com/facebook/react/pull/16103))
218217
* Deprecate `javascript:` URLs as a common attack surface. ([@sebmarkbage](https://github.com/sebmarkbage) in [#15047](https://github.com/facebook/react/pull/15047))
219218
* Deprecate uncommon "module pattern" (factory) components. ([@sebmarkbage](https://github.com/sebmarkbage) in [#15145](https://github.com/facebook/react/pull/15145))
220219
* Add support for the `disablePictureInPicture` attribute on `<video>`. ([@eek](https://github.com/eek) in [#15334](https://github.com/facebook/react/pull/15334))
@@ -229,13 +228,13 @@ Refer to the documentation for [detailed installation instructions](/docs/instal
229228
* Fix hiding Suspense fallback nodes when there is an `!important` style. ([@acdlite](https://github.com/acdlite) in [#15861](https://github.com/facebook/react/pull/15861) and [#15882](https://github.com/facebook/react/pull/15882))
230229
* Slightly improve hydration performance. ([@bmeurer](https://github.com/bmeurer) in [#15998](https://github.com/facebook/react/pull/15998))
231230

232-
### React DOM Server
231+
### React DOM Server {#react-dom-server}
233232

234-
* Fix incorrect output for camelCase custom CSS property names. ([@bedakb](https://github.com/bedakb) in [#16167](https://github.com/facebook/react/pull/16167))
233+
* Fix incorrect output for camelCase custom CSS property names. ([@bedakb](https://github.com/bedakb) in [#16167](https://github.com/facebook/react/pull/16167))
235234

236-
### React Test Utilities and Test Renderer
235+
### React Test Utilities and Test Renderer {#react-test-utilities-and-test-renderer}
237236

238-
* Add `act(async () => ...)` for testing asynchronous state updates. ([@threepointone](https://github.com/threepointone) in [#14853](https://github.com/facebook/react/pull/14853))
237+
* Add `act(async () => ...)` for testing asynchronous state updates. ([@threepointone](https://github.com/threepointone) in [#14853](https://github.com/facebook/react/pull/14853))
239238
* Add support for nesting `act` from different renderers. ([@threepointone](https://github.com/threepointone) in [#16039](https://github.com/facebook/react/pull/16039) and [#16042](https://github.com/facebook/react/pull/16042))
240239
* Warn in Strict Mode if effects are scheduled outside an `act()` call. ([@threepointone](https://github.com/threepointone) in [#15763](https://github.com/facebook/react/pull/15763) and [#16041](https://github.com/facebook/react/pull/16041))
241240
* Warn when using `act` from the wrong renderer. ([@threepointone](https://github.com/threepointone) in [#15756](https://github.com/facebook/react/pull/15756))

content/blog/2019-08-15-new-react-devtools.md

+6-6
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ author: [bvaughn]
44
---
55
We are excited to announce a new release of the React Developer Tools, available today in Chrome, Firefox, and (Chromium) Edge!
66

7-
## What's changed?
7+
## What's changed? {#whats-changed}
88

99
A lot has changed in version 4!
1010
At a high level, this new version should offer significant performance gains and an improved navigation experience.
@@ -14,7 +14,7 @@ It also offers full support for React Hooks, including inspecting nested objects
1414

1515
[Visit the interactive tutorial](https://react-devtools-tutorial.now.sh/) to try out the new version or [see the changelog](https://github.com/facebook/react/blob/master/packages/react-devtools/CHANGELOG.md#400-august-15-2019) for demo videos and more details.
1616

17-
## Which versions of React are supported?
17+
## Which versions of React are supported? {#which-versions-of-react-are-supported}
1818

1919
**`react-dom`**
2020

@@ -26,7 +26,7 @@ It also offers full support for React Hooks, including inspecting nested objects
2626
* `0`-`0.61`: Not supported
2727
* `0.62`: Will be supported (when 0.62 is released)
2828

29-
## How do I get the new DevTools?
29+
## How do I get the new DevTools? {#how-do-i-get-the-new-devtools}
3030

3131
React DevTools is available as an extension for [Chrome](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) and [Firefox](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/).
3232
If you have already installed the extension, it should update automatically within the next couple of hours.
@@ -37,14 +37,14 @@ If you use the standalone shell (e.g. in React Native or Safari), you can instal
3737
npm install -g react-devtools@^4
3838
```
3939

40-
## Where did all of the DOM elements go?
40+
## Where did all of the DOM elements go? {#where-did-all-of-the-dom-elements-go}
4141

4242
The new DevTools provides a way to filter components from the tree to make it easier to navigate deeply nested hierarchies.
4343
Host nodes (e.g. HTML `<div>`, React Native `<View>`) are *hidden by default*, but this filter can be disabled:
4444

4545
![DevTools component filters](../images/blog/devtools-component-filters.gif)
4646

47-
## How do I get the old version back?
47+
## How do I get the old version back? {#how-do-i-get-the-old-version-back}
4848

4949
If you are working with React Native version 60 (or older) you can install the previous release of DevTools from NPM:
5050

@@ -70,7 +70,7 @@ yarn build:extension
7070
# Follow the on-screen instructions to complete installation
7171
```
7272

73-
## Thank you!
73+
## Thank you! {#thank-you}
7474

7575
We'd like to thank everyone who tested the early release of DevTools version 4.
7676
Your feedback helped improve this initial release significantly.

content/docs/reference-profiler.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ Its purpose is to help identify parts of an application that are slow and may be
1616
> To opt into production profiling, React provides a special production build with profiling enabled.
1717
> Read more about how to use this build at [fb.me/react-profiling](https://fb.me/react-profiling)
1818
19-
## Usage
19+
## Usage {#usage}
2020

2121
A `Profiler` can be added anywhere in a React tree to measure the cost of rendering that part of the tree.
2222
It requires two props: an `id` (string) and an `onRender` callback (function) which React calls any time a component within the tree "commits" an update.
@@ -70,7 +70,7 @@ render(
7070
>
7171
> Although `Profiler` is a light-weight component, it should be used only when necessary; each use adds some CPU and memory overhead to an application.
7272
73-
## `onRender` Callback
73+
## `onRender` Callback {#onrender-callback}
7474

7575
The `Profiler` requires an `onRender` function as a prop.
7676
React calls this function any time a component within the profiled tree "commits" an update.

0 commit comments

Comments
 (0)