{
window.Image = originalImage;
});
- test('prop "accessibilityLabel"', () => {
+ test('prop "aria-label"', () => {
const defaultSource = { uri: 'https://google.com/favicon.ico' };
const { container } = render(
-
+
);
expect(container.firstChild).toMatchSnapshot();
});
diff --git a/packages/react-native-web/src/exports/Image/index.js b/packages/react-native-web/src/exports/Image/index.js
index f9381c96..bd69e5e8 100644
--- a/packages/react-native-web/src/exports/Image/index.js
+++ b/packages/react-native-web/src/exports/Image/index.js
@@ -182,7 +182,7 @@ const Image: React.AbstractComponent<
React.ElementRef
> = React.forwardRef((props, ref) => {
const {
- accessibilityLabel,
+ 'aria-label': ariaLabel,
blurRadius,
defaultSource,
draggable,
@@ -240,7 +240,7 @@ const Image: React.AbstractComponent<
// Accessibility image allows users to trigger the browser's image context menu
const hiddenImage = displayImageUri
? createElement('img', {
- alt: accessibilityLabel || '',
+ alt: ariaLabel || '',
style: styles.accessibilityImage$raw,
draggable: draggable || false,
ref: hiddenImageRef,
@@ -327,7 +327,7 @@ const Image: React.AbstractComponent<
return (
`;
@@ -161,6 +162,7 @@ exports[`components/Pressable prop "href" 1`] = `
`;
diff --git a/packages/react-native-web/src/exports/Pressable/index.js b/packages/react-native-web/src/exports/Pressable/index.js
index 5562e148..0d284214 100644
--- a/packages/react-native-web/src/exports/Pressable/index.js
+++ b/packages/react-native-web/src/exports/Pressable/index.js
@@ -75,7 +75,6 @@ function Pressable(props: Props, forwardedRef): React.Node {
delayPressIn,
delayPressOut,
disabled,
- focusable,
onBlur,
onContextMenu,
onFocus,
@@ -88,6 +87,7 @@ function Pressable(props: Props, forwardedRef): React.Node {
onPressIn,
onPressOut,
style,
+ tabIndex,
testOnly_hovered,
testOnly_pressed,
...rest
@@ -190,22 +190,28 @@ function Pressable(props: Props, forwardedRef): React.Node {
[onKeyDown, onKeyDownPress]
);
+ let _tabIndex;
+ if (tabIndex !== undefined) {
+ _tabIndex = tabIndex;
+ } else {
+ _tabIndex = disabled ? -1 : 0;
+ }
+
return (
{typeof children === 'function' ? children(interactionState) : children}
@@ -218,9 +224,12 @@ function useForceableState(forced: boolean): [boolean, (boolean) => void] {
}
const styles = StyleSheet.create({
- root: {
+ active: {
cursor: 'pointer',
touchAction: 'manipulation'
+ },
+ disabled: {
+ pointerEvents: 'none'
}
});
diff --git a/packages/react-native-web/src/exports/ProgressBar/index.js b/packages/react-native-web/src/exports/ProgressBar/index.js
index 394438f1..d5bca56a 100644
--- a/packages/react-native-web/src/exports/ProgressBar/index.js
+++ b/packages/react-native-web/src/exports/ProgressBar/index.js
@@ -41,11 +41,11 @@ const ProgressBar: React.AbstractComponent<
return (
{
let rerender;
act(() => {
({ rerender } = render(
-
+
));
});
expect(ref).toHaveBeenCalledTimes(1);
act(() => {
- rerender(
-
- );
+ rerender();
});
expect(ref).toHaveBeenCalledTimes(1);
});
diff --git a/packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js b/packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js
index 6511a1f5..25b07d36 100644
--- a/packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js
+++ b/packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js
@@ -2149,10 +2149,10 @@ function describeNestedLists(childList: {
const styles = StyleSheet.create({
verticallyInverted: {
- transform: [{scaleY: -1}],
+ transform: 'scaleY(-1)',
},
horizontallyInverted: {
- transform: [{scaleX: -1}],
+ transform: 'scaleX(-1)',
},
row: {
flexDirection: 'row',