Add useOpaqueIdentifier Hook #17322
Merged
Add useOpaqueIdentifier Hook #17322
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 815042f:
|
Details of bundled changes.Comparing: 7785a52...815042f react-dom
react-test-renderer
react-art
react-native-renderer
react-debug-tools
react-reconciler
ReactDOM: size: 🔺+16.5%, gzip: 🔺+15.6% Size changes (experimental) |
Details of bundled changes.Comparing: 7785a52...815042f react-dom
react-debug-tools
react-native-renderer
react-art
react-test-renderer
react-reconciler
ReactDOM: size: 0.0%, gzip: -0.0% Size changes (stable) |
acdlite
reviewed
Nov 9, 2019
packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.internal.js
Outdated
Show resolved
Hide resolved
| @@ -110,7 +110,7 @@ export function getValueForAttribute( | |||
| return expected === undefined ? undefined : null; | |||
| } | |||
| const value = node.getAttribute(name); | |||
| if (value === '' + (expected: any)) { | |||
| if (value === toString(expected)) { | |||
There was a problem hiding this comment.
if expected is the opaque object, this would throw the string error. toString doesn't convert the opaque object, which makes this just return value, which is what it should be anyway.
| @@ -18,7 +19,11 @@ export function setAttribute( | |||
| attributeName: string, | |||
| attributeValue: string | TrustedValue, | |||
| ) { | |||
| node.setAttribute(attributeName, (attributeValue: any)); | |||
| if (attributeValue.$$typeof === REACT_OPAQUE_OBJECT_TYPE) { | |||
There was a problem hiding this comment.
This works for updates, but need to handle similar case in setInitialDOMProperties, which is called during initial render.
There was a problem hiding this comment.
I think node.setAttribute is called during setInitialDOMProperties as well to set attributes:
setInitialDOMProperties -> setValueForProperty -> setAttribute/setAttributeNs
acdlite
reviewed
Nov 12, 2019
| } | ||
|
|
||
| container.innerHTML = | ||
| '<div data-reactroot=""><div id="s_0">Child One</div><!--$!--><div>Fallback</div><!--/$--></div>'; |
There was a problem hiding this comment.
You should also assert that React didn't replace the original DOM node. I would grab a reference to the divs here, then after you hydrate, make sure they match the hydrated ones (you can use a ref for that part, or grab them out of the container again). Then do the same after the update.
acdlite
reviewed
Nov 12, 2019
| Scheduler.unstable_flushAll(); | ||
| jest.runAllTimers(); | ||
|
|
||
| expect(container.innerHTML).toMatchInlineSnapshot( |
There was a problem hiding this comment.
The output is correct, but let's also test that there was only a single commit. You can do that with useEffect:
const id = useUniqueID();
useEffect(() => {
Scheduler.unstable_yieldValue('Did commit');
});I expect this test will fail; let's write the test first and then I can work with you on how to fix it.
SimenB
reviewed
Nov 13, 2019
| root.render(<App />); | ||
| }); | ||
|
|
||
| expect(container.innerHTML).toMatchInlineSnapshot( |
There was a problem hiding this comment.
if you do expect(container).toMatchInlineSnapshot pretty-format will format the inner html as html (newlines and less escaping, closer to how you'd write html manually).
If you explicitly want innerHTML, you can do expect(wrap(container.innerHTML)).toMatchInlineSnapshot to at least avoid the inline escaping and wrapping quotes. wrap comes from jest-snapshot-serializer-raw and is already used in react-refresh's tests
necolas
reviewed
Nov 15, 2019
| `); | ||
| }); | ||
|
|
||
| it('generates unique ids for client render on good server markup', async () => { |
There was a problem hiding this comment.
The snapshot below contains the server ids. Is this testing for preservation of ids from the server?
There was a problem hiding this comment.
Yea. I agree. Snapshot tests aren't a good way of testing these things. Especially when there are so many of them. I'd drop all the snapshots and replace them with more specific assertions.
We don't provide any guarantees that this is actually the format we will use. In fact, these IDs are way too likely to conflict with a manual user provided ID. So we probably should change the format and we might have to change it again.
A change in the format will yield a lot of manual work to verify if it's correct or not.
The tests also don't actually test the important properties that are useful to preserve regardless of which format we use. I.e. that a client generated ID can't overlap with a server generated ID. Does any of your tests fail if you just change it to be react_ prefixed on both server and client? Or what if you accidentally make remove the auto-incrementing, does it fail any tests?
Instead of asserting against a snapshot, you could assert on the DOM that the IDs match. E.g. find the divs and spans and assert that node.getAttribute('aria-labelledby') matches node.id and that they don't match the other's IDs. Also, write a test where the client generated IDs are not suppose to match existing server generated
content. E.g. by on the client adding a client-rendered pair. That's all that really matter. Not the exact format.
| expect(Scheduler).toFlushAndYield([]); | ||
| jest.runAllTimers(); | ||
|
|
||
| expect(divNode).toEqual(ref.current); |
There was a problem hiding this comment.
Do we still need this assertion if we have the inline snapshot below?
Comment on lines
1256
to
1605
| if (getIsHydrating()) { | ||
| return { | ||
| $$typeof: REACT_OPAQUE_OBJECT_TYPE, | ||
| _setId: () => { | ||
| setId(() => 'c_' + (clientId++).toString()); | ||
| }, | ||
| toString() { | ||
| throw Error( | ||
| 'The object passed back from useUniqueID is meant to be passed through to ' + | ||
| 'attributes only. Do not directly modify the output.', | ||
| ); | ||
| }, | ||
| }; | ||
| } else { | ||
| return 'c_' + (clientId++).toString(); | ||
| } |
There was a problem hiding this comment.
The body of this function looks identical to the mount function. Should we try to share it across mount and update?
There was a problem hiding this comment.
The update shouldn’t need to create the initializer (normally). Can we short cut this and avoid creating the unnecessary closure and array?
Jessidhia
reviewed
Nov 18, 2019
| return { | ||
| $$typeof: REACT_OPAQUE_OBJECT_TYPE, | ||
| _setId: () => { | ||
| setId(() => 'c_' + (clientId++).toString()); |
There was a problem hiding this comment.
This has the same problem as most of the "userspace" solutions: this ID is unstable and depends on commit order which, especially in combination with Suspense and partial hydration, is not necessarily the same as tree order.
One thing library authors often asked for is a way of getting the "tree position" of the element, which is better and relatively stable, but still not perfect; it'll probably work better for hydration and will be globally unique, but might get reused if a component is swapped by another for example.
There was a problem hiding this comment.
I think with this solution it doesn't matter whether the counter changes between server and client since react is able to patch it up properly during hydration which wasn't possible before.
This hook is exclusively for IDREF attributes. It's not a generic, unique ID of your component instance.
There was a problem hiding this comment.
Ah, so the point is it not being seen as a hydration error but just as something to be patched 🤔
There was a problem hiding this comment.
At least this is how I understood it. There's an argument to be made about hydration warnings for attributes in the first place (e.g. <button disabled={!process.browser} /> but IDREFs seem like a safe place to start.
There was a problem hiding this comment.
It’s not as simple as just patching. Partially because we don’t actually compare any props in hydration. But mostly because if you do it the naive way you may patch up one side but not the other side when partial hydration is being used.
This impl enforces that we force hydration of the things that needs patching on both sides.
We should have a test for that.
|
How about It’s not necessarily an ID in its implementation. It’s just some way of referencing one node in two places. The connection to I’ve thought about having this in React Native as a way to pass a native box around. So that I can pass a reference to a native View instance to native APIs. Eg getting a handle to a native View instance from another view’s View Manager on Native threads. Unlike useRef, this kind of ref’s current value would only be accessible from native code. That’s very similar to how you can think about this use case too. It’s a bit strange since you might expect to pass the target side like |
sebmarkbage
reviewed
Dec 5, 2019
| toString() { | ||
| throw Error( | ||
| 'The object passed back from useUniqueID is meant to be passed through to ' + | ||
| 'attributes only. Do not directly modify the output.', |
There was a problem hiding this comment.
What does “don’t modify the output” mean? I’m just reading the value. Not modifying it.
There was a problem hiding this comment.
This should be an invariant since our error minification pipeline doesn't support error constructors, yet.
sebmarkbage
reviewed
Dec 5, 2019
| ) { | ||
| node.setAttribute(attributeName, (attributeValue: any)); | ||
| if ( | ||
| typeof attributeValue === 'object' && |
There was a problem hiding this comment.
This is probably React’s hottest path that we’re making slower (and not inlinable). Is this the best place we can do this? Where does TrustedValue do its check?
4 tasks
sebmarkbage
reviewed
Jan 3, 2020
| @@ -260,6 +264,17 @@ function useDeferredValue<T>(value: T, config: TimeoutConfig | null | void): T { | |||
| return value; | |||
| } | |||
|
|
|||
| function useOpaqueReference(): string | IdObject { | |||
| const hook = nextHook(); | |||
| const value = hook === null ? 'FAKE_ID' : hook.memoizedState; | |||
There was a problem hiding this comment.
The name "FAKE_ID" doesn't say much and is kind of confusing if you do end up seeing it. What's Fake about it? Can I search for it? It also doesn't apply as a string when in React Native for example. Let's just leave it as undefined if it's not there.
I believe this can also cause an error if you inspect a hydrated component since toString and valueOf will throw. We should probably detect if it's a REACT_OPAQUE_OBJECT_TYPE and do something special. Perhaps just leaving it as undefined as well.
You can add tests to: https://github.com/facebook/react/tree/9fe1031244903e442de179821f1d383a9f2a59f2/packages/react-debug-tools/src/__tests__
sebmarkbage
reviewed
Jan 3, 2020
| const container = document.createElement('div'); | ||
|
|
||
| container.innerHTML = | ||
| '<div data-reactroot=""><div id="s_0">Child One</div><!--$!--><div>Fallback</div><!--/$--></div>'; |
There was a problem hiding this comment.
I'd use ReactDOMServer.renderToString(...) to render this string so that you don't have to hard code the format.
Example:
sebmarkbage
reviewed
Jan 3, 2020
| @@ -60,7 +86,8 @@ if (enableTrustedTypesIntegration && typeof trustedTypes !== 'undefined') { | |||
| trustedTypes.isScript(value) || | |||
| trustedTypes.isScriptURL(value) || | |||
| /* TrustedURLs are deprecated and will be removed soon: https://github.com/WICG/trusted-types/pull/204 */ | |||
| (trustedTypes.isURL && trustedTypes.isURL(value))) | |||
| (trustedTypes.isURL && trustedTypes.isURL(value)) || | |||
| value.$$typeof === REACT_OPAQUE_OBJECT_TYPE) | |||
There was a problem hiding this comment.
This doesn't seem right. This will be toString:ed by the DOM and throw an error anyway. No need to add a special case, is there? Just let it fail below.
sebmarkbage
reviewed
Jan 3, 2020
| value !== null && | ||
| typeof value === 'object' && | ||
| value.$$typeof === REACT_OPAQUE_OBJECT_TYPE && | ||
| typeof value._setId === 'function' |
There was a problem hiding this comment.
You shouldn't need this extra check. You've asserted the type. Just cast it through let obj: IdObject = (value: any) below to satisfy Flow.
sebmarkbage
reviewed
Jan 3, 2020
| value._setId(); | ||
| return ''; | ||
| } else { | ||
| return toStringOrTrustedType(value); |
There was a problem hiding this comment.
The point to collocate these was so that you could use the same type check to quickly determine if this is not an object which is the common case. However, by calling this second function, you have to check the type again in the other function. Leading to two checks instead of one, for the common case.
You should inline this here so that you can avoid extra type checks. However, the bigger question is why you need two functions at all.
sebmarkbage
reviewed
Jan 3, 2020
| @@ -44,14 +45,39 @@ export opaque type TrustedValue: {toString(): string, valueOf(): string} = { | |||
| valueOf(): string, | |||
| }; | |||
|
|
|||
| export function evaluateToStringOrTrustedType( | |||
There was a problem hiding this comment.
Does this need to be its own function? Can't it just be the same as toStringOrTrustedType?
toStringOrTrustedType is called in two other places.
This one seems like you might have missed: https://github.com/facebook/react/pull/17322/files#diff-214d5116dd8b5a7d184cdf5b2160f94cR183
Seems like it should also trigger this path.
The other one is here but I think that's actually already the wrong place to do this and it shouldn't toString this at all since the initial rendering doesn't:
But it doesn't hurt that we check for
REACT_OPAQUE_OBJECT_TYPE. Even though the existing call is a bug in the first place.
That way we need less code overall.
sebmarkbage
reviewed
Jan 3, 2020
| @@ -110,7 +114,7 @@ export function getValueForAttribute( | |||
| return expected === undefined ? undefined : null; | |||
| } | |||
| const value = node.getAttribute(name); | |||
| if (value === '' + (expected: any)) { | |||
| if (value === toStringOrTrustedType(getToStringValue(expected))) { | |||
There was a problem hiding this comment.
This call site seems like it breaks with trusted types already.
But this fix doesn't seem right. Why call getToStringValue? Why would you need to ignore function values or symbol? getAttribute should never return those types.
toStringOrTrustedType also doesn't seem like the right fix neither.
For trusted types, the server generated string won't match the object on the client, so this wouldn't end up matching. Causing a hydration error. This will need to dig into the trusted type and inspect the value to see if it's equivalent.
For REACT_OPAQUE_OBJECT_TYPE the returned object will never match. So that will also be a hydration error.
It seems to me that this needs to just perform some more custom matching logic instead of trying to use the toStringOrTrustedType helper.
sebmarkbage
reviewed
Jan 3, 2020
| @@ -197,6 +198,9 @@ if (__DEV__) { | |||
| if (didWarnInvalidHydration) { | |||
| return; | |||
| } | |||
| if (clientValue && clientValue.$$typeof === REACT_OPAQUE_OBJECT_TYPE) { | |||
There was a problem hiding this comment.
This seems like the wrong place to do this check. If we get here it's because we already thought that there was an error. If you do the check in getValueForAttribute instead, then we don't have to treat it as an error in the first place.
sebmarkbage
reviewed
Jan 3, 2020
| const [id, setId] = mountState(() => { | ||
| if (getIsHydrating()) { | ||
| return { | ||
| $$typeof: REACT_OPAQUE_OBJECT_TYPE, |
There was a problem hiding this comment.
Other than its creation, this object is only ever referenced in ReactDOM. That's a good thing because on other platforms like the React Native use case, this object will look very different and have a very different signature.
To do that, though, we need to make the creation of this object something platform specific. Let's make a HostConfig method to create this object and only implement it in ReactDOM.
For React Native, we should make that method throw since this feature is not yet supported there. Later we could add some specific implementation.
You probably need to pass setId in as an argument to the HostConfig method.
sebmarkbage
reviewed
Jan 3, 2020
| }, | ||
| }; | ||
| } else { | ||
| return 'c_' + (clientId++).toString(); |
There was a problem hiding this comment.
This should also move to ReactDOM since it's specific to how an "Opaque Reference" is constructed in the DOM.
Also, don't call toString(). Rely on + '' casting instead like we do elsewhere. .toString() becomes a dynamic look up which can be monkey patched by Number.prototype. It's more bytes and less efficient.
Actually, scratch that, let's use toString(36) instead to save some bytes in memory on the ID. On the client it doesn't matter as much but nice on the server so might as well use it for consistency.
sebmarkbage
reviewed
Jan 3, 2020
| </div> | ||
| </div> | ||
| `); | ||
| }); |
There was a problem hiding this comment.
We should add a similar test where Child One is in a Suspense boundary that is still suspended. I.e. if we're only partially hydrated. Then we do an update that shows the second Child. This should suspend and wait for the suspense boundary to resolve before letting the update through.
It should not leave them inconsistent.
That test would ensure that we don't forget about this case and try to implement the "patching strategy approach" in the future. That test is really the main driver for this particular implementation strategy so we should ensure we test for it.
https://github.com/facebook/react/pull/17322/files#r354445736
|
According to the current implementation - everything is based on a single counter, even if different for client and server. But there are situation in a hybrid app, for example written using different framework/language, with some injections of React code(widgets or partial migration) – it could be a situation when two different instances of React is used on a single page, resulting the same From my understanding the problem above could be solved by prefixing What about adding a |
|
I also wonder if for a long-running service process we might ever run out of IDs. |
|
Well, all this time (without React "support") every SSRed page with "unique ids" had to be "synchronized" with the client. In other words - |
Technically it's MAX_SAFE_INTEGER mounts. A re-render wouldn't increment the counter: https://gxg23.csb.app/ On a naive level we could % MAX_SAFE_INTEGER the incremented value. That would at least solve the issue if don't have extremely long living instances and short lived instances in the same tree. I think the main concern here are server renderers, right? I can't imagine a client-side application that runs for years constantly with 60 frames per second (where each frame discards the old UI) with thousands of ids in the tree. |
|
Do you mind filing an issue about possible clashes between multiple Reacts? |
|
@gaearon - filled 3 cases out of my head. Probably there might be more. |
1 task
|
Are there plans for supporting multiple opaque identifiers in HTML attributes i.e. support IDREFS? Since aria was mentioned in the original description it seems like there should be support for export default function App() {
const labelId = React.unstable_useOpaqueIdentifier();
const buttonId = React.unstable_useOpaqueIdentifier();
const listboxId = React.unstable_useOpaqueIdentifier();
return (
<React.Fragment>
<span id={labelId}>Choose an element:</span>
<button
aria-haspopup="listbox"
aria-labelledby={[labelId, buttonId]}
id={buttonId}
>
Neptunium
</button>
<ul aria-labelledby={labelId} id={listboxId} role="listbox" />
</React.Fragment>
);
}-- https://codesandbox.io/s/useopaqueidentifier-for-idrefs-ocnm4 This currently almost works but it concatenates the ids with |
|
@eps1lon Mind filing a new issue to discuss? |
This was referenced Apr 17, 2020
8 tasks
necolas
added a commit
to necolas/react-native-web
that referenced
this pull request
Sep 9, 2020
React doesn't currently provide an API for defining SSR-safe IDs, so we have to suppress the hydration warnings that occur. The 'useOpaqueIdentifier' hook is intended to support this use case but is not currently a public API and development has been paused. facebook/react#17322. Close #1375
miguelbermudez
pushed a commit
to mdcollab/react-native-web
that referenced
this pull request
Nov 16, 2020
Squashed commit of the following:
commit a877a02beb6a2032430f83b062e173d68c40c65d
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Mon Nov 9 23:58:55 2020 +0000
Bump dot-prop from 4.2.0 to 4.2.1
Bumps [dot-prop](https://github.com/sindresorhus/dot-prop) from 4.2.0 to 4.2.1.
- [Release notes](https://github.com/sindresorhus/dot-prop/releases)
- [Commits](https://github.com/sindresorhus/dot-prop/compare/v4.2.0...v4.2.1)
Signed-off-by: dependabot[bot] <support@github.com>
commit 6928fab9e0ef1e5bd0c10713b3b18b1b178d0bfb
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Nov 9 15:57:38 2020 -0800
0.14.8
commit e5ded5897253243b1fbffa17956401e9d53fcfd2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Nov 9 15:46:48 2020 -0800
[fix] ScrollView doesn't respond to descendant scroll events
Workaround for React DOM's non-standard bubbling of scroll events.
Fix #1800
commit cf91d7547128da7b4d8700b26741df36a1280797
Author: Kyle Fang <zhigang1992@gmail.com>
Date: Sat Oct 31 14:41:16 2020 +0800
[add] LogBox stub
Close #1794
commit 6624a70ccaf83988a0b1084cba9c85b6d85b0352
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Oct 30 10:52:37 2020 -0700
0.14.7
commit 5806b249dd158b06da78b5eafcf98148e87666b3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Oct 30 10:47:32 2020 -0700
[fix] Use browser expansion of 'flex' style
Fix #1792
commit 1048f7ce3edc1e49a9df9b50489cfb68adeac541
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 29 17:14:39 2020 -0700
0.14.6
commit 18f5a33c0d27c0d81ab92489a39076ee2a677525
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 29 16:09:02 2020 -0700
[fix] Don't require mocking window.matchMedia in jest
For people who don't mock unsupported DOM APIs for jsdom in their jest setup.
Fix #1789
commit 07e578edb8af1237e3dc127e9a674c4f97d70e54
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 29 15:51:03 2020 -0700
[fix] ResponderSystem negotiation logic
This fixes a bug in the negotiation logic that caused a cycle of
terminate->grant events to be sent to the current responder during a pointer
move. The root cause was using an incorrect event path in the calculation of
the lowest common ancestor's index. The fix is to ensure that the event path
stored with the current responder is pruned to begin with the node that is the
current responder (rather than any child responders it may have contained).
commit d2e6c29e259856b81d0466217754c1107a44f014
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 29 14:14:21 2020 -0700
[fix] Pan interactions should cancel 'click' events on the target
If a pan interaction has taken place, it is not expected that 'click' events
occur on the target element when the pointer is released (as was occuring with
mouse pointers). This patch cancels any 'click' that occurs within the pan
target's subtree, within 250ms of the pan gesture ending.
Fix #1788
commit 03897d32be87dc8cf1783112902bf8092912ad8a
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 29 14:13:42 2020 -0700
[fix] Disabled pressables should propagate 'click' events
If a pressable is disabled it should not prevent the propagation of native
'click' events, unless the underlying DOM node has an 'aria-role' of 'button'.
This emulates the native '<button>' behavior.
Fix #1781
commit b8fddcf6b155f0db6c292b2f42c80425b05091b7
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 27 11:06:27 2020 -0700
0.14.5
commit d9c755dff0574b98cb182f015a7a4697db0d9aca
Author: Charlie Croom <ccroom@twitter.com>
Date: Mon Oct 26 20:54:04 2020 -0400
[fix] Enter key handling for components explicitly given accessible prop
Close #1783
commit 63c39454de35897616169156f3b1b145867fce59
Author: burakgormek <burak.gormek@gmail.com>
Date: Mon Oct 26 22:57:26 2020 +0300
[fix] Pressable disabled cursor state
Close #1782
commit 89be8a9f8b48f83428577d0865f4dcd2797067d3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 22 12:28:17 2020 -0700
Fix ViewProps import path
This error was not surfaced by Flow locally but surfaced in CI.
commit b4e53e8cd3d43ce585df479c42c9d4216ad3dd16
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 22 11:00:02 2020 -0700
0.14.4
commit cea4172efb84c10eecea86a4e09321efe6977086
Author: Charlie Croom <ccroom@twitter.com>
Date: Thu Oct 22 10:31:33 2020 -0400
[fix] Prevent onClick being called when certain roles are disabled
Fix #1779
Close #1780
commit a2d72ee89cf3981e3daf4a67a6e20f41ca4c925b
Author: Charlie Croom <ccroom@twitter.com>
Date: Tue Oct 20 11:53:45 2020 -0400
[fix] Avoid usePlatformMethods excess ref creation
Close #1777
commit 2428b6c6fcc4093fe8f3ab12ac10168651f3c8f0
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 19 16:02:22 2020 -0700
0.14.3
commit 0aa77685aa50c816e1715673b7fa758b025c9dc0
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 19 15:50:02 2020 -0700
[fix] Add matrix transform style
Remove the deprecated 'transformMatrix' style prop and support 'matrix' and
'matrix3d' in the 'transform' prop.
Fix #1771
commit 663458713c64c0236cfc4fe0494b13baeab354a7
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Oct 16 12:57:49 2020 -0700
0.14.2
commit 31183151405ce8ce3a1f7356462b46b2c6509f07
Author: TikiTDO <TikiTDO@gmail.com>
Date: Tue Oct 13 16:19:16 2020 -0400
[fix] Remove 'collapsable' prop from createAnimatedComponent
This is an Android-only prop that has no platform guard in React Native. The
web has a native 'collapsable' prop that React DOM complains about when it is
not a string value.
Close #1767
commit 09c2f1975b053a4afe2d412a23450a8ff3f6ffbf
Author: Charlie Croom <ccroom@twitter.com>
Date: Wed Oct 14 22:51:54 2020 -0400
[fix] Prevent constant Image reloading when source given as an object
Close #1770
commit 18d5d449a78e03e4930b4489f379e8a4058a0bfc
Author: Charlie Croom <ccroom@twitter.com>
Date: Mon Oct 12 22:24:55 2020 -0400
[fix] Callback ref less on Views by making classList constant
Close #1766
commit 933bd138ce6f9f2fd5ade7fc8ac7dd3693b5cb71
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 12 13:41:20 2020 -0700
0.14.1
commit c2019a9881ecec4cdb5d4b2ab355ed7e578b8752
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 12 13:37:42 2020 -0700
[fix] Pressable cursor and touch-action styles
Also add unit tests for Pressable.
Fix #1764
commit 78174d7b487bb37d2f15c21e38a5beb2ad196da4
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Oct 9 12:59:41 2020 -0700
0.14.0
commit 38fd574984ca8ac997f8fbbdb91991dea6c76ca9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Sep 10 14:06:34 2020 -0700
[add] Pressable support for hover state
This patch ports the 'useHover' hook to React Native for Web, providing hover
state that is scoped to a pressable and does not bubble to ancestor pressables.
This behavior aligns with the behavior of the focus and press states.
Fix #1708
commit 5b7a6bc30a90ed1c2c9d9327df926ad361fabb29
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Sep 10 13:28:35 2020 -0700
Move hooks into 'modules' directory
commit d97a1ca5671aa91cab6d0825677a5e35ce3c6685
Author: James Ward <james@notjam.es>
Date: Tue Sep 8 11:45:37 2020 -0700
[add] Modal component
This adds support for the React Native Modal on web.
The app content is hidden from screen readers by setting the aria-modal flag on
the modal. This focus is trapped within the modal, both when attempting to
focus elsewhere using the mouse as well as when attempting to focus elsewhere
using the keyboard. A built-in "Escape to close" mechanism is been implemented
that calls 'onRequestClose' for the active modal.
Close #1646
Fix #1020
commit 6bd41a622a66c21679b486ecb8f18c589dab667b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 31 16:58:35 2020 -0700
Remove react-dom vendor directory
commit 108366a72421e1b7ef8800a05584b507e948f8bf
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Aug 25 16:28:32 2020 -0700
[change] Default flex-basis value of Views
React Native has an implementation of flexbox that does not quite follow the
W3C spec for flexbox. Previously, React Native for Web attempted to replicate
the React Native rendering by setting flexBasis to 0%. However, this created
its own problems where views could collapse down to 0px in height on the web.
This patch relies sets the default flexBasis back to 'auto'. This will cause
different rendering inconsistencies with React Native, which can be addressed
by making changes to existing React Native styles. And ultimately, it is up to
Yoga to correct its flexbox implementation.
Fix #1640
Fix #1604
Fix #1264
Close #1265
commit bf2e10d4823ffe5e207aacb77b4dfcc4a2c659e5
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Oct 9 11:17:09 2020 -0700
0.13.18
commit faf7fa337442bf0d024d1e882bb316364953d307
Author: Mark Lawlor <mwlawlor@gmail.com>
Date: Fri Oct 9 11:19:58 2020 +1000
[fix] skip ResizeObserver warning during SSR
Close #1762
commit df14c7278afec5ae131d1a60167660cf798c856c
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 8 12:29:11 2020 -0700
0.13.17
commit b15e8784c46e50cb5ca03e3113c31fd5280b14a1
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 8 12:27:15 2020 -0700
Add unit tests for ref imperative methods
commit 583e16fa8d6f53fd8234944cb2beb94a9c2293b8
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Oct 7 14:42:22 2020 -0700
Memoize refs
Refs can be memoized following the fix in the previous commit.
Fix #1755
Fix #1665
commit b4322734a28f7f3dc970041b8d4413b2712a078f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Oct 7 14:31:57 2020 -0700
[fix] Order of ref merging
Ensure internal refs are called before the forwardedRef. This ensures that the
DOM element mutation performed by usePlatformMethods occurs before user-space
refs are called.
Ref #1749
commit bdcb4de7dcca33c1a08eafbd59a0ba09deb47ca6
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 6 11:41:31 2020 -0700
0.13.16
commit d8ee51e32633b106fb6c8e7f5f73af50c113017b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 6 11:38:17 2020 -0700
[fix] CSS scrollbarWidth
The previous code wasn't inserting the W3C rule because it had the same selector as the rule for proprietary styles. However, the Firefox value isn't supported anymore, and the Edge value is unnecessary as Edge uses Blink now. This patch removes the non-WebKit fallback styles for this property.
Fix #1760
commit aad0c88cea5444fb93231d55296e45b3720bea3b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 5 15:38:06 2020 -0700
0.13.15
commit 6d04e7243e8e0958eec473429f0f4563bc8e41b9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 5 15:33:50 2020 -0700
[fix] Don't propagate click or contextmenu events on disabled elements
This patch fixes the PressResponder to avoid propagating click and contextmenu
events in all circumstances. It also prevents click propagating for focusable
elements that are disabled, mirroring the behavior of native buttons when
disabled.
Fix #1757
commit ba5e9e30795eb80e2f8f072cead182412f5c1edc
Author: Julian Hundeloh <jaulz@users.noreply.github.com>
Date: Thu Sep 24 16:35:49 2020 +0200
[add] AccessibilityInfo isReduceMotionEnabled
Close #1754
commit 06d3cadf052c957b7f41f6fd81f3db904abc5189
Author: Shobhit Chittora <shobhitchittora@users.noreply.github.com>
Date: Wed Sep 23 00:41:14 2020 +0530
Update docs suggested preset to metro-react-native-babel-preset
Updating the document as `babel-preset-react-native` is deprecated in favor for
`metro-react-native-babel-preset`. More info here -
https://www.npmjs.com/package/babel-preset-react-native.
Close #1751
commit 72bfe499c536db08984853e011fc36bf8a4cf85b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 5 14:28:27 2020 -0700
Add to View tests
commit 92ac1f94c53903b3ce5111e53f30a363c6c7d291
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 5 13:14:38 2020 -0700
Add to Text tests
commit 5edba02319e88d49614518011b490dab856389d2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 5 13:14:26 2020 -0700
Add to Image tests
commit 2276e17310df342762147ba7f1166f7d4a3f22dc
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 1 17:05:26 2020 -0700
Add to CheckBox tests
commit 222fa3490e44ee1b641c71ea2674c6531200903b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 1 16:56:44 2020 -0700
Add to Button tests
commit 0fb3036f318d0ed51a970f7d13e13080ad891c83
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Oct 1 16:40:51 2020 -0700
Add to ActivityIndicator tests
commit 7bc6fc83476bffb1da54234b01c713d3ccb15049
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Sep 24 13:39:37 2020 -0700
0.13.14
commit c60417ab3495b7721aa3fabcb4cf7602845d0ae3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Sep 24 13:26:21 2020 -0700
[fix] Revert ref memoization
Memoizing refs caused unexpected regressions in some class component patterns.
The memoization is being reverted for now.
Fix #1749
commit af0d80a808f6d246facc38fac1cd24d2b205f0ac
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Sep 21 15:56:18 2020 -0700
0.13.13
commit 12e91a35a421a001812b964bf7c2df19a4048c1c
Author: Richard Lindhout <richardlindhout96@gmail.com>
Date: Thu Sep 17 23:08:05 2020 +0200
[fix] nested Text selection
Allow text to be made selectable within a text node that is not selectable.
Close #1742
commit 376ccc31b1b1a11de1cab6bd7df4385be1a6a28c
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Sep 21 13:40:06 2020 -0700
[fix] Optimize ref merging
Close #1746
Fix #1665
commit 4a70300b081626b34ee90dac9066b6786d882bb6
Author: Hossein Mohammadi <hosseinm.developer@gmail.com>
Date: Thu Sep 10 12:56:27 2020 +0430
Remove unnecessary code from setValueForStyles
Close #1734
commit 7ab04987f0a638d22bb3785eecbe2f375c714c35
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Sep 9 16:04:57 2020 -0700
Fix compressed-size build script
commit f52a9bcfd249f254bb17eb53d3472bc0bb3c143b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Sep 9 13:33:08 2020 -0700
Add compressed-size action
Reports minified + gzipped size of modules
commit 74acb21aa850bcb242b0c9e77c2cef1754a19c2f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Sep 9 11:57:58 2020 -0700
0.13.12
commit 1e1236597a1cfbc9838f0cfec14379d493bb2e43
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Sep 9 11:49:03 2020 -0700
[fix] Image SSR hydration warnings
React doesn't currently provide an API for defining SSR-safe IDs, so we have to
suppress the hydration warnings that occur.
The 'useOpaqueIdentifier' hook is intended to support this use case but is not
currently a public API and development has been paused.
https://github.com/facebook/react/pull/17322.
Close #1375
commit e9d81afbd412812a2f5e841656f88044ed3d1e39
Author: SaltyWater <qs920921@gmail.com>
Date: Wed Sep 9 13:35:57 2020 +0800
[fix] Forward scroll end event to ScrollView onScroll handler
Close #1728
commit 9ed9231b04ae495718e76749036ca3cd2a81eb80
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Sep 8 12:33:37 2020 -0700
0.13.11
commit d5ab3770c0d8c65251db2924add03dd1ab78b81f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Sep 8 12:32:00 2020 -0700
[fix] PressResponder keyboard edge-case
Fixes the state-machine logic for the press responder when focus is moved away
from the target element during a 'keydown' event.
commit 397de881379059a2ce786eb0640a4ec3a1e29a7f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Sep 8 11:24:19 2020 -0700
0.13.10
commit bb8a1b145523acca33dfe2a922582c7a85407aab
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Sep 8 11:22:35 2020 -0700
[fix] ScrollView scrollEventThrottle logic
Fix #1726
commit 214b296c1110d6141546c033c9d7ed43148d0b12
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri Sep 4 22:38:17 2020 +0000
Bump bin-links from 1.1.3 to 1.1.8
Bumps [bin-links](https://github.com/npm/bin-links) from 1.1.3 to 1.1.8.
- [Release notes](https://github.com/npm/bin-links/releases)
- [Changelog](https://github.com/npm/bin-links/blob/v1.1.8/CHANGELOG.md)
- [Commits](https://github.com/npm/bin-links/compare/v1.1.3...v1.1.8)
Signed-off-by: dependabot[bot] <support@github.com>
commit a7df78afbe97c2102c943c8259a57e8b92fd6791
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri Sep 4 03:38:29 2020 +0000
Bump markdown-to-jsx from 6.10.3 to 6.11.4
Bumps [markdown-to-jsx](https://github.com/probablyup/markdown-to-jsx) from 6.10.3 to 6.11.4.
- [Release notes](https://github.com/probablyup/markdown-to-jsx/releases)
- [Commits](https://github.com/probablyup/markdown-to-jsx/compare/6.10.3...6.11.4)
Signed-off-by: dependabot[bot] <support@github.com>
commit c6425a0048f98bc08a29cf5f9568018a092f4caa
Author: Harrison Mendonça <harrisonmendonca@gmail.com>
Date: Thu Sep 3 12:02:54 2020 -0300
[fix] Add event parameter to Image onLoad callback
Close #1723
commit 8add92f776c88a180859000d7d8585e5d2971edf
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Aug 25 12:05:29 2020 -0700
0.13.9
commit 9a0acc54649596fb60e8bdb9e77d11093085ab4b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Aug 25 11:00:27 2020 -0700
[fix] Layout of nested Text elements
Remove the 'dir=auto' attribute from nested Text elements as this can cause
browsers to produce broken text layouts.
Fix #1714
commit a31c4c65d07a573de440f3a8a3d715a731485b85
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Aug 25 11:12:29 2020 -0700
[fix] Remove Animated 'useNativeDriver' warning
Fix #1693
commit 834bd5b98bd55b9ce09e3afd3583542e551d2017
Author: Colby Stauss <colby.stauss@gmail.com>
Date: Thu Aug 6 18:11:44 2020 -0500
[fix] Animated getScrollableNode check
Close #1695
Fix #1680
commit de2a66c694723ca4aaa99ea5f88f41232e0e4481
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 24 13:50:55 2020 -0700
[fix] ResponderEvent touch identifier normalization
Move the touch identifier normalization into the ResponderEvent creation. This ensures that the identifier is consistent throughout. If application code reads an identifier from a touch object it can be used to find that touch in the `touchBank` array.
Fix #1716
commit 9ed0c407a93e55db6550f0322923546f74fa0e39
Author: Richard Lindhout <richardlindhout96@gmail.com>
Date: Thu Aug 20 13:07:04 2020 +0200
[fix] TextInput keyboardType for 'numeric' and 'decimal'
Don't rely on native restrictions and validations for these keyboardType
values, as developers often want custom presentation (e.g., comma separators)
and custom validation.
Fix #1705
Fix #1438
Fix #1280
Close #1709
commit 7a8a70b94888c4554969f626645daead37c8f60b
Author: H3RSKO <34112131+H3RSKO@users.noreply.github.com>
Date: Sun Aug 16 16:47:34 2020 -0400
Fix typo in README
Close #1706
commit 67a3d787997a2ffbcb84c3e34c6c4376404a1854
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 17 11:32:37 2020 -0700
0.13.8
commit 77bdb9086ed4bc06428e74770790c1bcec1453f3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 17 11:10:53 2020 -0700
[fix] Avoid needing to memoize onLayout callbacks
If 'onLayout' is an inline function, it could cause the DOM node to enter a
cycle of being observed/unobserved with the result that 'onLayout' was
constantly called.
Fix #1704
commit 7fc17d01cc3695d784b460842bffbacc43c3f57e
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Aug 12 10:58:28 2020 -0700
0.13.7
commit b8283245cff0c1d0a5608d7d04c67aa85fee2ce0
Author: Evan Bacon <baconbrix@gmail.com>
Date: Tue Aug 11 16:37:42 2020 -0700
[fix] check for window availability in ResponderSystem
Close #1699
commit 75c5a9056377540b1c04e00db8154087f61bd4f3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 10 14:13:13 2020 -0700
0.13.6
commit 3233d0ffe99a568de3b76272926c7083e083f83e
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 10 13:26:13 2020 -0700
[fix] Responder negotiation between siblings
There should be responder negotiation between siblings if there is no common ancestor connected to the responder system. Instead the current responder should continue to receive events. This was only occuring for mouse events during mousemove, as the target can change during the course of the movement.
commit 251cdfb220a165dc652bf118063139da2b9345f1
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 3 14:10:51 2020 -0700
0.13.5
commit 7c46a3667e83884813225e0dd8b34020ee86decb
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 3 13:49:15 2020 -0700
[fix] update System font stack
Remove system-ui as it has rendering issues for certain OS/language combinations.
See https://phabricator.wikimedia.org/T175877
Fix #1638
commit 5a15dcae66d9c87a747005fb6edffa8630823a12
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 3 13:46:47 2020 -0700
[fix] Dimensions doesn't debounce change listener
Fix #1662
commit af0ae004ffa724197e081c4d5c222ee2057894c2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Aug 3 13:44:27 2020 -0700
[fix] Image forwards ViewProps
Close #1637
commit 08f722ac861131756e1ef100d302dc60c7acc3ec
Author: Ryoga Kitagawa <ryoga.kitagawa@gmail.com>
Date: Thu Jul 16 17:55:36 2020 +0900
[fix] ScrollView forwards dataSet
Close #1675
commit 6bf69c00153b83d8eae03c54bbb251fa4b530b01
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu Jul 30 12:06:46 2020 +0000
Bump elliptic from 6.4.1 to 6.5.3
Bumps [elliptic](https://github.com/indutny/elliptic) from 6.4.1 to 6.5.3.
- [Release notes](https://github.com/indutny/elliptic/releases)
- [Commits](https://github.com/indutny/elliptic/compare/v6.4.1...v6.5.3)
Signed-off-by: dependabot[bot] <support@github.com>
commit 28f51fa492176122f4e83b14b1bb82b57888377d
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu Jul 16 18:43:29 2020 +0000
Bump lodash from 4.17.15 to 4.17.19
Bumps [lodash](https://github.com/lodash/lodash) from 4.17.15 to 4.17.19.
- [Release notes](https://github.com/lodash/lodash/releases)
- [Commits](https://github.com/lodash/lodash/compare/4.17.15...4.17.19)
Signed-off-by: dependabot[bot] <support@github.com>
commit 5426762ed4319799687c2bc43da03e9b0be7b19d
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jul 20 12:26:49 2020 -0700
0.13.4
commit 10de98778598d795b776d96d01ff01dbcf6b7f7b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jul 20 12:22:17 2020 -0700
[fix] usePlatformMethods guard against null hostNode
Fix #1679
commit 72638d028bc9e0c5b9e7981ba680b2758d89cdbc
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jul 7 14:43:10 2020 -0700
0.13.3
commit 097cd31a90faeaf6a66de277769dfe04c31bbbfc
Author: Colby Stauss <colby.stauss@gmail.com>
Date: Tue Jul 7 16:30:12 2020 -0500
[fix] Image tintColor updates
Fix #1319
Close #1664
commit 96dcce0261a1bcdd579260b62022ef94d8689428
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jul 7 11:45:46 2020 -0700
0.13.2
commit 1497bb4d725ae91c8219c095c916d3539a70d2fb
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jul 7 11:35:54 2020 -0700
[fix] TouchableWithoutFeedback child ref
Fix #1663
commit 99e6d7137f63486fec3118d529b95bfbb0f1a887
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sat Jun 6 13:42:25 2020 +0000
Bump websocket-extensions from 0.1.3 to 0.1.4
Bumps [websocket-extensions](https://github.com/faye/websocket-extensions-node) from 0.1.3 to 0.1.4.
- [Release notes](https://github.com/faye/websocket-extensions-node/releases)
- [Changelog](https://github.com/faye/websocket-extensions-node/blob/master/CHANGELOG.md)
- [Commits](https://github.com/faye/websocket-extensions-node/compare/0.1.3...0.1.4)
Signed-off-by: dependabot[bot] <support@github.com>
commit 8c391604ba29a4acec6f2de8c2de2e4ce14774d9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jun 29 12:20:51 2020 -0700
0.13.1
commit 7ef070195bbdec4d776d1fae8f98914fe2574d58
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jun 29 10:58:34 2020 -0700
[fix] setNativeProps and pointerEvent prop
The pointerEvent prop is converted into a DOM style property and needs to be
accounted for by setNativeProps.
Close #1656
Fix #1655
commit 728e20ff1fa24b0976dccfa65a3547043a72882f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jun 29 09:59:12 2020 -0700
[fix] jest preset
Fix #1654
commit 824cca1972e61f9c65e19f23036eb093296bbdfa
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 26 15:16:53 2020 -0700
0.13.0
commit cfe36d780e981885ce73862a9effcea29e7ea1c9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 27 15:17:19 2020 -0700
Minimal update of Animated
Ref #1576
commit 5dda71c2a667d6085440f74993223d2654f93e0f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 27 14:35:41 2020 -0700
[change] Remove 'accessibilityRelationship'; add 'dataSet'
Remove the 'accessibilityRelationship' prop which is not part of React Native.
The general approach to supporting ARIA-like accessibility APIs in React Native
needs revisiting and it will be easier to stop going down this path.
This patch also reverts the "unstable_ariaSet" change, and renames
"unstable_dataSet" to "dataSet". Avoiding another breaking change to
accessibility props will ease upgrading for now.
commit 972317c17cfb223f5177c888e90ef32c86fe846a
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 27 13:54:03 2020 -0700
PressResponder fix invariant edge case
If keyup events fall through to a "pressable" element that is not the responder
(e.g., a keydown in a modal closes the modal) it should not attempt to
transition the state.
Also replace invariant with console.error to allow the app to recover if
unexpected signals occur.
commit 0901be6e5cba996039ebcffe2de08554f5ac4fa2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 27 13:53:48 2020 -0700
[fix] TextInput onKeyPress and onSubmitEditing events
onKeyPress forwards the synthetic keydown event.
onSubmitEditing is only called if IME composition is not in progress.
Fix #1332
commit 52f903229ea4d9ca1cc39b41aa2eefd24de2a7ca
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 20 10:22:33 2020 -0700
Minor cleanup of StyleSheet
commit 3230713d6b6a0ea2bf3da22a246ef23064d809b6
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue May 19 21:40:54 2020 -0700
[change] Remove support for microdata props
Microdata was removed from the HTML spec and most browsers.
commit 53dd03d83b2b06cd6f38292d9996cfbaaf485ecf
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon May 18 14:13:38 2020 -0700
Fix PressResponder click prevention logic
commit c2d4fd6d77f1d594fe4d1853ab5c511adda29d45
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon May 18 12:08:06 2020 -0700
Fix TextInput onSelectionChange logic
commit fc78cb06fd349fd4cf9ac6a28b821a11397321f6
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu May 7 12:28:44 2020 -0700
Fix updates to opacity in TouchableOpacity
commit cd9be22947e123eb2463b070666b759a5ade39dd
Author: liorJuice <45418456+liorJuice@users.noreply.github.com>
Date: Tue Mar 10 19:32:06 2020 +0200
[fix] Clipboard copy edge-case
Make sure clipboard works even if global CSS is affecting user text selection.
Fix #1559
commit 324995ec2ba39bab5e35a0cd4a47c55f7c23a23f
Author: Jaap Frolich <jfrolich@gmail.com>
Date: Wed May 6 18:14:00 2020 -0700
[add] Appearance module
Close #1597
commit cecacbc3ac995e9037e1f87fd3c796e4938dd1a3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 6 18:08:55 2020 -0700
Add eslint-plugin-flowtype
commit ff6109ec1c19f215deb3664c0d79757744e29b2a
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 6 17:15:43 2020 -0700
Update README and docs
commit aa647567ad2e7bb0c6a475c3ed7ab2f04d0dbd0d
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed May 6 14:42:12 2020 -0700
[change] Remove hitSlop
Rely on the native behavior of browsers to provide hitslop for touch on
interactive elements.
Fix 1609
commit e9933b107aec47d528fbd442de000b784d91acda
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Apr 29 15:48:02 2020 -0700
Adjust keyboard onClick shim
commit 4b4163f630e338e00f76a97c8309546911dce381
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Apr 20 20:45:57 2020 -0700
[add] AccessibilityInfo API update
Close #1574
commit ac945761e6adac355d74886279b2e1eb50b84502
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Apr 20 20:37:36 2020 -0700
[fix] Add getNativeScrollRef to FlatList
Fix #1560
Close #1563
commit 7ab3cf0d4214a89a27030e05fabedec66609b9b4
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Apr 20 15:56:42 2020 -0700
[change] Remove `scrollWithoutAnimationTo` from ScrollView
Remove this API which was previously deprecated.
commit 37ff6b48885bb38079db7e8b4739078dc360be19
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Apr 20 11:40:05 2020 -0700
Reorganize usePressEvents and PressResponder
commit cf7d5e9b071901d025f5629115273dd074649684
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Apr 17 16:03:24 2020 -0700
[fix] forwarding of refs and props
Fixes a performance regression in prop forwarding by reintroducing prop filtering.
Fixes ref forwarding to host components, mutating the host node to add imperative APIs.
commit 0ffbf66b1ac6297bcbba9f1c9da35588474f5f63
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Apr 15 20:41:27 2020 -0700
[change] Remove TabBarIOS and TimePickerAndroid exports
These modules have been removed from React Native
commit a7da67cd0999da340f1c66240458476fc36eb380
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Apr 13 10:15:36 2020 -0700
Reorganize internal modules
commit 603adc46ab637d4829d34fadb47dd703201b15c0
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Apr 15 10:21:25 2020 -0700
Alternative PanResponder API
commit 88f5dedffd0ad71b0f66936c471d3635ad6b08b8
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Sat Apr 11 20:01:35 2020 -0700
[change] Add Pressable and replace Touchables
Port and rewrite "Pressability" from React Native as "PressResponder". This
integrates a press target with the responder system on web. It avoids
performing layout measurement during gestures by eschewing React Native's
iOS-like UX in favor of expected Web UX: a press target will look pressed until
the pointer is released, even if the pointer has moved outside the bounding
rect of the target.
The PressResponder is used to reimplement the existing Touchables. It's
expected that they will eventually be removed in favor of Pressable.
Fix #1583
Fix #1564
Fix #1534
Fix #1419
Fix #1219
Fix #1166
commit 7e724b279dd5f6da3e7480ea2443959b53cb2c0d
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Mar 31 17:25:17 2020 -0700
Remove enzyme
commit 204c432f66c09404d584c439a2d851c52219982f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Mar 31 14:06:01 2020 -0700
[change] Text and View onClick handling
Makes `onClick` part of the stable props API. In the future this will be used
to implement `onPress` in the Touchables/Pressables. Special handling of click
for keyboards is performed in `createElement`. At the moment, `Text` still
includes the `onPress` prop, which will only be called if `onClick` is not also
being used. In the future `Text` (in React Native) should remove the Touchable
props from its API.
commit 66751502a337f5fc7bc774ec4aa5cfa7735e5566
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Mar 31 17:32:13 2020 -0700
[change] Replace the ResponderEventPlugin
Replaces the ResponderEventPlugin with useResponderEvents hook.
Also removes the event "normalization" of mouse, touch, and click events.
These events are not part of the responder system and will no longer be
modified from what ReactDOM dispatches.
Fix #1589
Fix #1568
Fix #1571
Fix #829
Fix #693
commit 4146b16a686bf2165f68fb2bf4a7ed4fb8a47514
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Mar 31 17:31:46 2020 -0700
Add PanResponder examples to docs
commit fe013b30dc6fafba21c111fade0ae3a84b1b1cd5
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Mar 26 18:17:02 2020 -0700
Add dom-event-testing-libary as a private package
This is copied from facebook/react with various fixes applied (which I'll push
upstream at a later date). Necessary for testing the Responder Event System
rewrite.
commit fa6e269832b4929e460aefb4681cf232e74bdfd3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Mar 26 18:00:55 2020 -0700
Add missing imports to docs mdx files
commit ee1cb490d67cec2c0e73dea3ba974707725ff6b3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Feb 24 13:42:00 2020 -0800
Fix optional value flow types
commit f4e8b6b1942aa1ea0a36f596c34e0271abbb0b16
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Feb 24 13:03:42 2020 -0800
[change] modernize Image
Rewrite Image to use function components and hooks.
Fix #1322
commit 7e616f6d46f4d844ea4a926eeda055b480a208f2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Feb 13 14:46:47 2020 -0800
Fix props table for docs
Stop using the built-in Props table from Storybook (which wasn't working.)
commit 8952eccf86eb07d19fd32f07959db0889b0cca4b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Feb 6 11:23:20 2020 -0800
[change] Explicitly forward props and introduce unstable_{ariaSet,dataSet}
Rather than filtering props, they are explicitly forwarded in each component.
This makes it easier to see exactly which props are being forwarded to host
components by each React Native component. Two new props - `unstable_ariaSet`
and `unstable_dataSet` - are introduced to avoid iterating over props to find
`aria` and `data` props.
The `accessibilityValue` prop is also implemented.
commit 654f65e3e09c5593c6916df20215d0c65e0ed4c8
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Feb 5 16:08:37 2020 -0800
[change] modernize TextInput
Rewrite TextInput to use function components and hooks.
Rewrite the unit tests to replace enzyme with testing-library.
Fix #1339
commit d94a14dc8ca07e1c8e8c25c5d1f0206e7a4a72ee
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Feb 5 09:12:06 2020 -0800
[change] RefreshControl, StatusBar, YellowBox as function components
commit 8d37fde5ee105f4a78a927a3913e4fea2eee3014
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 16:05:41 2020 -0800
[change] modernize Picker
Rewrite Picker to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit fdf53df3014498571f99de44917c3b9eecdea8be
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 14:38:19 2020 -0800
[change] modernize CheckBox
Rewrite CheckBox to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit 999c2ad1226ae84bfd3ea38f4a03db92628cb9eb
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 13:32:51 2020 -0800
[change] modernize ActivityIndicator
Rewrite ActivityIndicator to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit 35236a3cc2782bc0cce90faf42a97cb9dec2d392
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 13:19:03 2020 -0800
[change] modernize Text
Rewrite Text to use function components and hooks.
commit 2724ca0293076afb7d69a3fa88e83ecbfff61ecf
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 12:50:52 2020 -0800
Add eslint-plugin-react-hooks
commit fc443c5abdafe40f2fe710d08e043891e06102a9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:50:56 2020 -0800
[change] modernize View
Rewrite View to use function components and hooks.
The 'usePlatformMethods' hook also fixes a bug in the class-based
implementation of 'setNativeProps' which was unable to correctly merge its
styles with those provided via the component API. In the future,
'setNativeProps' will be removed from React Native anyway.
See (3) in #1136 for more context.
commit 7d440c74f4edd1bdb64c4fc378b8b9d9a926d1cb
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:44:10 2020 -0800
[change] modernize Switch
Rewrite Switch to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit ebc3882661863ff9e9265638a9196c79cca89115
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:41:49 2020 -0800
[change] modernize ScrollViewBase
Rewrite ScrollViewBase to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit b28d2a8214f7ebb6a107dd8eba6114749949ceaf
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:36:51 2020 -0800
[fix] SafeAreaView types
commit 94ecc46ece466ceeb4aa860c21973a632251df13
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:30:57 2020 -0800
[change] modernize ProgressBar
Rewrite ProgressBar to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit 5b40b9d6aadbbbb2115570a1a3a58bf8909499e1
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:28:55 2020 -0800
[change] modernize ImageBackground
Rewrite ImageBackground to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit 840a2e91d45a719769e49863aff6feb334a02ea0
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:08:20 2020 -0800
[change] modernize Button
Rewrite Button to use function components.
Rewrite the tests to replace enzyme with testing-library.
commit 96d8649197fb2014d550b15dfb530c29d4417d8e
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Feb 4 11:06:36 2020 -0800
[change] modernize AppRegistry
Rewrite AppRegistry to use function components and hooks.
Rewrite the tests to replace enzyme with testing-library.
commit a2cccaf528125357922e3623bdced5f8ae4dfd9f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Feb 3 10:50:30 2020 -0800
[change] Add usePlatformMethods to implement instance methods
A hook equivalent for implementing "native methods" on refs to elements backed
by function components.
commit 51ac083d561d96ac67fdc22ac4e1bef6a24b8561
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Feb 3 10:49:18 2020 -0800
[change] Add useElementLayout hook to implement onLayout callback
A hook equivalent for implementing onLayout in function components. Removes
the fallback to using window resize events. A ResizeObserver polyfill is now
requires to use the `onLayout` prop.
commit 9dbe17fa6a234840f55b74a75a703c238919bec1
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jun 2 10:51:45 2020 -0700
0.12.3
commit f4a481bb4f40cc53cd54e8a08c65a638603daf0d
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jun 2 10:38:35 2020 -0700
[fix] Allow 'lang' attribute to be forwarded to DOM nodes
commit 5287044f403d881a13e17f140c5575ce0661587f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Feb 24 14:08:31 2020 -0800
0.12.2
commit 92737d33f420720ca782c3aac6c5110db3186ae2
Author: Vladimir Guguiev <wizardzloy@gmail.com>
Date: Thu Feb 20 12:02:45 2020 +0100
[fix] Prevent injectEventPluginsByName throwing when re-evaluating code
Close #1539
commit 18427aae5082f521f2361c74a497ccf62500fad0
Author: editkid <github.com@editkid.com>
Date: Mon Feb 24 19:19:25 2020 +1300
[fix] Avoid use of Object.values
Improve compatibility with older browsers (without polyfilling)
Close #1541
commit a7ab961d95de892e4b41c96ea945aa344fd49e50
Author: Evan Bacon <baconbrix@gmail.com>
Date: Wed Jul 31 13:41:53 2019 -0700
[fix] Image support for variable resolution images
Renders the asset scale which is closest to the window scale. Requires bundler integration.
Close #1456
Co-authored-by: David Calhoun <dpcalhoun@gmail.com>
commit c8b73fa4e475bb7b6a79bdd4cfb20f357cc763d9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Feb 6 13:39:50 2020 -0800
0.12.1
commit 3d53273fe757452250032286107fbfd495259a0c
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Feb 6 13:38:38 2020 -0800
Update internal paths to docs
commit 5b7f584f191d8fb6e5c92fa560c4e6babca7559f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Feb 6 11:27:31 2020 -0800
[fix] View filtering of accessibility props
commit 88c664fa0ff32e01c3f3df5df7116e435d57c335
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Jan 30 17:11:13 2020 -0800
Update dependencies for 'benchmarks' package
commit dff62b3af6e4bade2e3cf3f4b2981bb2b4107c81
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Jan 30 17:01:07 2020 -0800
Update jest dependencies
commit 032279e5f7ac5fdec9bae3562953760044478227
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Jan 30 16:54:01 2020 -0800
Update dependencies for 'docs' package
commit d30d65b29df56dfd057e1ffeef7eb166772938ed
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Jan 30 16:45:07 2020 -0800
Update babel dependencies
commit dee418bb930fdeabfad8361a2fdc4247519638a9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jan 24 14:24:35 2020 -0800
0.12.0
commit 1cc7e6cbf4609d37e54ead41e58ca41a936c5c40
Author: Brandon Ros <brandonros1@gmail.com>
Date: Fri Jan 10 18:55:41 2020 -0500
Fix bad invariant import path
commit 16c0109df687b37e99b87a33ba8673c04c64891e
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Sat Dec 21 16:58:14 2019 +0000
Replace invariant with console.error in View
Jest dumps the invariant error to the console when unit tests run, which is
both annoying and more likely to cause unwanted error to go unnoticed. We're
also moving away from using 'invariant' in React. This patch replaces the
invariant with a call to 'console.error', which won't crash an app that is
using raw text nodes as View children, but it's better than nothing.
commit 287251a06a08f7338a0516b1648a25118a1c410b
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Sat Dec 21 16:57:11 2019 +0000
[change] Remove 'placeholderTextColor' from 'createElement' props
TextInput converts the 'placeholderTextColor' prop to a style.
commit e670e8135b2098dfe2d6874e0673652d6463f197
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Dec 20 23:30:37 2019 +0000
[fix] TextInput forwards placeholderTextColor
Fix a bug introduced by 924e891f58f137e363fea19aa9098b74cdf4555a
Ref #1512
commit e22f0bebb3262f882497f8818d59f77139402d90
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Dec 20 19:30:09 2019 +0000
[fix] ScrollView disabling of scroll
Make sure 'scrollEnabled={false}' works on desktop browsers and no longer
relies on using 'e.preventDefault()'.
Fix #1491
commit f16c2c45ead945b821a29c2a09b2f8fa0a900d72
Author: luis filipe <papalagui@outlook.com>
Date: Thu Dec 5 22:07:43 2019 +0100
[fix] ScrollView scrollEventThrottle development warning check
Close #1498
commit fc033a3161be76224d120dec7aab7009e9414fa7
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Dec 20 19:15:22 2019 +0000
[add] TextInput disabled prop
Add support for disabling TextInput elements
Fix #1036
commit 8fa9fc5cc544ebdee884b64a2f586513f8ec6a92
Author: Greg Westneat <gwestneat@neat-designs.com>
Date: Mon Dec 16 16:54:39 2019 -0800
Update README link for Docz
Close #1504
commit e0412acb94b75aac01eda7c0e661e61279401325
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Dec 19 16:59:06 2019 +0000
[add] Allow style scrollbarWidth 'thin' value
Close #1499
commit 0b31a8b09659c002e4499c1b71cae471fe5d6b20
Author: ecreeth <luismiguel1730@gmail.com>
Date: Wed Dec 18 22:43:09 2019 -0400
Refactor import and export in react-native-web entry file
Close #1509
commit b10711bddd1fdf6e01e82c0d49840dce9c2e04d2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Dec 18 22:31:45 2019 +0000
[fix] TextInput autoComplete behavior
Fix 'autoComplete' behavior now that Chrome has fixed broken behavior for 'off'.
Add fallback support for React Native's 'autoCompleteType' prop.
Close #1404
commit 5334a4f0d8c2aefb64131fe59647e9ce2d946aac
Author: Chris Drackett <chrisdrackett@users.noreply.github.com>
Date: Tue Oct 15 11:15:25 2019 -0700
[fix] TextInput remove default browser margin
Close #1458
commit df1b62cd454565cc3d07662f84848b483c6f8744
Author: Maxime Thirouin <git@moox.io>
Date: Tue Nov 19 23:31:59 2019 +0100
[add] useWindowDimensions hook
Add the 'useWindowDimensions' hook from React Native
Close #1487
commit 4763cc71c6ea4c278efe0a66599f0ab7e5ca212f
Author: Max Thirouin <git@moox.io>
Date: Tue Nov 19 21:13:59 2019 +0100
Document reasoning behind hairlineWidth value
Close #1488
commit aa8593ba9704d42f26c87303ac5a584856cbadaa
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Dec 18 16:13:35 2019 +0000
[change] Switch prop 'trackColor' support
Remove support for legacy React Native props and add support for the
'trackColor' object. Retains support for the web-only equivalents as I think
this API is preferable to the one in React Native, both in terms of flexibility
and performance (no inline objects).
Fix #1382
commit 3c9cc66264fc5522ddfab0bf3b70392583599d34
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Dec 18 14:52:03 2019 +0000
Update storybook dependencies
commit 1ad16930391303da511c98879fa7b2002b28c822
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Nov 13 16:09:47 2019 -0800
[change] Remove PropTypes exports and internal use
Removes the following deprecated exports: `ColorPropType`,
`EdgeInsetsPropType`, `PointPropType`, `TextPropTypes`, and `ViewPropTypes`.
Remove all use of `prop-types` in the implementations of components. Flow types
are used instead, so there will no longer be runtime warnings related to props.
NOTE: Removes support for `className` prop.
Fix #1383
Close #1477
Close #1474
Close #1489
commit 924e891f58f137e363fea19aa9098b74cdf4555a
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Nov 15 10:38:16 2019 -0800
Update babel-plugin-tester
commit fced06aeaac66c551e7174e156040142088f3166
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Wed Nov 13 01:04:54 2019 +0000
Bump js-yaml from 3.12.0 to 3.13.1
Bumps [js-yaml](https://github.com/nodeca/js-yaml) from 3.12.0 to 3.13.1.
- [Release notes](https://github.com/nodeca/js-yaml/releases)
- [Changelog](https://github.com/nodeca/js-yaml/blob/master/CHANGELOG.md)
- [Commits](https://github.com/nodeca/js-yaml/compare/3.12.0...3.13.1)
Close #1479
Signed-off-by: dependabot[bot] <support@github.com>
commit 21d60a3e9a2a465064ec498def7bfeb706122ede
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Wed Nov 13 01:04:50 2019 +0000
Bump lodash from 4.17.11 to 4.17.15
Bumps [lodash](https://github.com/lodash/lodash) from 4.17.11 to 4.17.15.
- [Release notes](https://github.com/lodash/lodash/releases)
- [Commits](https://github.com/lodash/lodash/compare/4.17.11...4.17.15)
Close #1478
Signed-off-by: dependabot[bot] <support@github.com>
commit f4ff2e8891d7c35f8a5b7cb8853fb7eac1e8eedf
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue Nov 12 23:40:50 2019 +0000
Bump mixin-deep from 1.3.1 to 1.3.2
Bumps [mixin-deep](https://github.com/jonschlinkert/mixin-deep) from 1.3.1 to 1.3.2.
- [Release notes](https://github.com/jonschlinkert/mixin-deep/releases)
- [Commits](https://github.com/jonschlinkert/mixin-deep/compare/1.3.1...1.3.2)
Close #1468
Signed-off-by: dependabot[bot] <support@github.com>
commit f43ce41f0dacde9cccebe5f6942b167725389e42
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed Nov 13 11:30:31 2019 -0800
Update README
commit afb8d3b7fbe03feb7a79ca069c1c246787a51060
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Nov 12 16:54:51 2019 -0800
[change] Configure hydration using AppRegistry.runApplication()
Client-side hydration of server-rendered HTML now requires that `hydrate` is explicitly set in the `appParams` passed to `AppRegistry.runApplication()`.
Fix #1374
commit e4ed0fd3c863e6c61aa3ea8afeff79b7fa74b461
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Nov 12 15:36:10 2019 -0800
[fix] ScrollResponder componentWillMount -> UNSAFE_componentWillMount
commit 297cda7901c2ff5098ae273611f4d6a33c39dbe2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 15 09:32:13 2019 -0700
Rewrite interactive documentation
Consolidate all docs within the latest storybook
Ref #1172
commit 8cf00a5c5abd60ff2f03b50c3ffa855a4a2df036
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 8 13:02:16 2019 -0700
Update inline-style-prefixer and misc deps
commit 3fd90b925211de48ed5b16daae5576fd18f31878
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 8 12:50:44 2019 -0700
Update flow to 0.109
Add $FlowFixMe to vendor code that produces flow errors
commit 9e7c37128e3b8f942679322f08aee1aeb19ffd35
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 8 11:14:17 2019 -0700
Update 'benchmarks' dependencies
commit 41e6dca1e35074158f5ca9baf41d1ae98f5e903e
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 8 11:01:12 2019 -0700
Update linter and formatter tools
commit 02a3640f959c84b7314a44486abd944ae6c3c795
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Oct 8 10:58:37 2019 -0700
Update test tools
commit 290a2a76cead587d8d079402fcbc5724ea0dabac
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 7 15:28:09 2019 -0700
Update babel build tools
commit 1b3c31ff6acc27183547b4cf0e37214895f5f219
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 7 14:26:16 2019 -0700
Run prettier across codebase
Close #1444
commit d4b9f35d3379e3b92b7dfe279d1a9fa58dacecb6
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 7 14:20:49 2019 -0700
[change] createElement -> unstable_createElement
Rename the 'createElement' export to reflect its unstable status.
Fix #1385
commit 3ac0b96498758f97460bcd1de997fc651dd482ab
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Oct 7 14:01:05 2019 -0700
[change] Update Touchable components
Reference RN 0.60 implementations with web-specific fixes
Ref #1172
Fix #1105
commit 33f1c3566c7c2f78695c4c9871c01f74ed73c6c7
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Oct 4 11:35:53 2019 -0700
[add] forwardedRef prop to View and Text
Ref #1172
commit d57fb6eb01f5226c01e034bd1ce535b5a7204b33
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jul 23 16:46:24 2019 -0700
[change] accessibilityRelationship and accessibilityState props
Adds the accessibilityState and accessibilityRelationship object props that map
to ARIA props.
Removes the accessibilityStates array prop that is not compatible with web
accessibility services.
Ref #1172
commit ae94551ac54b6f098dabf2084564f25aa1ca5b02
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Thu Jul 18 15:30:00 2019 -0700
[change] Remove accessibilityTraits and accessibilityComponentType props
These props are deprecated in React Native and replaced by accessibilityRole
Ref #1352
commit 1af0218d26d42d7f00068c72b26070ce4d9d3c99
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Tue Jul 2 14:54:05 2019 -0700
Remove unused 'shadowSpread' prop type
Close #1357
commit d554d83727261763fc33b50e1c409f2573fd1724
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jul 1 17:29:19 2019 -0700
[change] Text uses createContext
Replaces the legacy 'contextTypes' API.
Removes 'enzyme' from related tests. Back to recording DOM snapshots.
Close #1248
Ref #1172
commit 25dd43e960df17d0853fe3b5c188045bfff4863a
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jul 1 16:24:14 2019 -0700
[change] Update vendor code
* FlatList
* SectionList
* VirtualizedList
* VirtualizedSectionList
commit c4a2a6d4a3a3e0bd8378e5e18381e859910c0203
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jul 1 14:41:18 2019 -0700
Update to flow-bin@0.98
commit ad674e4b4f71613422a95b60b3edb2c54028336f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon Jul 1 14:40:25 2019 -0700
[add] Platform.isTesting
commit 304e8a83ab6ea3d9aca806890b3bdbfb7db30db8
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 14:37:04 2019 -0700
[change] Update Animated
react-native@v0.60.0-rc.3
Fix #1378
Fix #1325
Close #1306
commit ac71506610baf14936af7e48b90270bb1bb16cd8
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:30:11 2019 -0700
[change] Remove WebView
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 847870e4b34033f184f9a86ed1b408cb9d2c6af9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:29:05 2019 -0700
[change] Remove ViewPagerAndroid
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 845c2726b292e0521b17963e2d9e87b1e1337bc3
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:28:13 2019 -0700
[change] Remove VibrationIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 9d76d5889164bb82a3cde903c0bf44b277bae40f
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:27:28 2019 -0700
[change] Remove ToolbarAndroid
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit f54c957199b575ab25821d399617a3d9b893bdc9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:25:56 2019 -0700
[change] Remove SwipeableListView
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 425102c16e57bef54a3fdf8e6ba5ddf427db0f14
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:20:41 2019 -0700
[change] Remove StatusBarIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 0c350d2678fba6bb5d60d9275b3dc85a8dab5550
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:19:46 2019 -0700
[change] Remove SnapshotViewIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit eaa24ae91d61bab4722e7a68177026a6bd1b2a03
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:17:25 2019 -0700
[change] Remove Slider
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 24801cb5da4a10d67aca0bf43633080fc9a1f6db
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:16:03 2019 -0700
[change] Remove SegmentedControlIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 41e4f05eb06cad5aaac18cac1a43d50e922e21f2
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:14:33 2019 -0700
[change] Remove PushNotificationIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 72ede16c9c369f8347ddc8571c4a348f3638f608
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:13:28 2019 -0700
[change] Remove ProgressBarAndroid and ProgressViewIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 7ec9b075a131b99e9af71795d78e7204a09f8d06
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:11:43 2019 -0700
[change] Remove PickerIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 89bc074327d6831af7bf7d23aaa4713d6998fe39
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:08:58 2019 -0700
[change] Remove NetInfo
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit add0e0cb7e419467db245adddcd1a2d7e15aa457
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 11:01:48 2019 -0700
[change] Remove NavigatorIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 8900cea5760f52909e5de3b72ead1b2909e23f53
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:59:55 2019 -0700
[change] Remove MaskedViewIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 6c682bbb92920555b3cd7c25f5213d45cb34edc7
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:59:04 2019 -0700
[change] Remove ListView
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit ece4e95d4d7e77acf1635acec3885b3d7b387927
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:57:13 2019 -0700
[change] Remove ImageStore
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit f9eadc10d2ebe5b26a5cadea8eec7f54a058edcd
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:49:43 2019 -0700
[change] Remove ImagePickerIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit cc5a5d7d27a3997f1b79b57a1f729129afad0899
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:48:33 2019 -0700
[change] Remove ImageEditor
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 800f24466e87e16936b19f212af57406daf2cab7
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:37:28 2019 -0700
[change] Remove DatePickerAndroid and DatePickerIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 5a12430b509a44e57978d65beb85bc4c985410d9
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:30:32 2019 -0700
[change] Remove CameraRoll
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit fbdbfa5484119296910a5b05af72406bf1e3f0c0
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:09:05 2019 -0700
[change] Remove AsyncStorage
Ref #1352
Ref https://github.com/react-native-community/async-storage/issues/52
Ref https://github.com/facebook/react-native/issues/23313
commit 920211b99852fc3717fc6f7e050ba273f1e2d26d
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:03:58 2019 -0700
[change] Remove AlertIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit c0c7a18aca6021b1ad5b2fd1a710ff74d4e9cc75
Author: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Fri Jun 28 10:02:00 2019 -0700
[change] Remove ActionSheetIOS
Ref #1352
Ref https://github.com/facebook/react-native/issues/23313
commit 250ee3c234196fdddf6e5189c572a292566c3cb2
Author: Marnus Weststrate <marnusw@gmail.com>
Date: Tue Sep 17 07:33:24 2019 +0100
[fix] Only inject ResponderEventPlugin client-side
Close #1434
Fix #1433
commit 6ce88e6db05e30b5c5c5453d01d0f99d3733ad3c
Author: John Rees <johnrees@users.noreply.github.com>
Date: Thu Sep 26 11:59:18 2019 +0100
Fix docs link to create-react-app
Close #1440
|
To follow up, reactwg/react-18#111 addresses #17322 (comment). |
Serhey-Oleynik
added a commit
to Serhey-Oleynik/react-native-app
that referenced
this pull request
Apr 10, 2022
React doesn't currently provide an API for defining SSR-safe IDs, so we have to suppress the hydration warnings that occur. The 'useOpaqueIdentifier' hook is intended to support this use case but is not currently a public API and development has been paused. facebook/react#17322. Close #1375
rnike
pushed a commit
to VeryBuy/react-native-web
that referenced
this pull request
Sep 13, 2022
React doesn't currently provide an API for defining SSR-safe IDs, so we have to suppress the hydration warnings that occur. The 'useOpaqueIdentifier' hook is intended to support this use case but is not currently a public API and development has been paused. facebook/react#17322. Close necolas#1375
superstar1205
added a commit
to superstar1205/ReactNative-Web
that referenced
this pull request
Dec 26, 2022
React doesn't currently provide an API for defining SSR-safe IDs, so we have to suppress the hydration warnings that occur. The 'useOpaqueIdentifier' hook is intended to support this use case but is not currently a public API and development has been paused. facebook/react#17322. Close #1375
crown0128
added a commit
to crown0128/react-native-web
that referenced
this pull request
Aug 12, 2023
React doesn't currently provide an API for defining SSR-safe IDs, so we have to suppress the hydration warnings that occur. The 'useOpaqueIdentifier' hook is intended to support this use case but is not currently a public API and development has been paused. facebook/react#17322. Close #1375
Hiccup19940325
pushed a commit
to Hiccup19940325/reactnative_package
that referenced
this pull request
Oct 30, 2023
React doesn't currently provide an API for defining SSR-safe IDs, so we have to suppress the hydration warnings that occur. The 'useOpaqueIdentifier' hook is intended to support this use case but is not currently a public API and development has been paused. facebook/react#17322. Close #1375
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
We currently use unique IDs in a lot of places. Examples are:
*
<label for="ID">*
aria-labelledbyThis can cause some issues:
1. If we server side render and then hydrate, this could cause an hydration ID mismatch
2. If we server side render one part of the page and client side render another part of the page, the ID for one part could be different than the ID for another part even though they are supposed to be the same
3. If we conditionally render something with an ID , this might also cause an ID mismatch because the ID will be different on other parts of the page
This PR creates a new hook
useOpaqueIdentifierthat generates a different unique ID based on whether the hook was called on the server or client. If the hook is called during hydration, it generates an opaque object that will rerender the hook so that the IDs match.