diff --git a/packages/react-native/Libraries/Components/View/__tests__/View-itest.js b/packages/react-native/Libraries/Components/View/__tests__/View-itest.js
index 43dd28766a67d9..04b384626638cb 100644
--- a/packages/react-native/Libraries/Components/View/__tests__/View-itest.js
+++ b/packages/react-native/Libraries/Components/View/__tests__/View-itest.js
@@ -15,182 +15,357 @@ import * as Fantom from '@react-native/fantom';
import * as React from 'react';
import {View} from 'react-native';
-describe('width and height style', () => {
- it('handles correct percentage-based dimensions', () => {
- const root = Fantom.createRoot();
-
- Fantom.runTask(() => {
- root.render(
-
-
- ,
+describe('', () => {
+ describe('width and height style', () => {
+ it('handles correct percentage-based dimensions', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+
+
+ ,
+ );
+ });
+
+ expect(
+ root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
+ ).toEqual(
+ ,
);
});
- expect(
- root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
- ).toEqual(
- ,
- );
- });
+ it('handles numeric values passed in as strings', () => {
+ const root = Fantom.createRoot();
- it('handles numeric values passed in as strings', () => {
- const root = Fantom.createRoot();
+ Fantom.runTask(() => {
+ root.render(
+ ,
+ );
+ });
- Fantom.runTask(() => {
- root.render(
- ,
+ expect(
+ root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
+ ).toEqual(
+ ,
);
});
- expect(
- root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
- ).toEqual(
- ,
- );
- });
+ it('handles invalid values, falling back to default', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+
+
+ ,
+ );
+ });
- it('handles invalid values, falling back to default', () => {
- const root = Fantom.createRoot();
-
- Fantom.runTask(() => {
- root.render(
-
-
- ,
+ expect(
+ root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
+ ).toEqual(
+ ,
);
});
-
- expect(
- root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
- ).toEqual(
- ,
- );
});
-});
-describe('margin style', () => {
- it('handles correct percentage-based values', () => {
- const root = Fantom.createRoot();
-
- Fantom.runTask(() => {
- root.render(
-
-
- ,
+ describe('margin style', () => {
+ it('handles correct percentage-based values', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+
+
+ ,
+ );
+ });
+
+ expect(
+ root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
+ ).toEqual(
+ ,
);
});
- expect(
- root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
- ).toEqual(
- ,
- );
- });
+ it('handles numeric values passed in as strings', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+
+
+ ,
+ );
+ });
- it('handles numeric values passed in as strings', () => {
- const root = Fantom.createRoot();
-
- Fantom.runTask(() => {
- root.render(
-
-
- ,
+ expect(
+ root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
+ ).toEqual(
+ ,
);
});
-
- expect(
- root.getRenderedOutput({includeLayoutMetrics: true}).toJSX(),
- ).toEqual(
- ,
- );
});
-});
-describe('accessibilityRole', () => {
- it('is propagated to the mounting layer', () => {
- const root = Fantom.createRoot();
+ describe('props', () => {
+ describe('accessibility', () => {
+ describe('accessibilityActions', () => {
+ it('is propagated to the mounting layer', () => {
+ const root = Fantom.createRoot();
- Fantom.runTask(() => {
- root.render();
- });
+ Fantom.runTask(() => {
+ root.render(
+ ,
+ );
+ });
- expect(
- root.getRenderedOutput({props: ['accessibilityRole']}).toJSX(),
- ).toEqual();
- });
+ expect(
+ root.getRenderedOutput({props: ['accessibilityActions']}).toJSX(),
+ ).toEqual(
+ ,
+ );
+ });
+
+ it('does not unflatten view', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+ ,
+ );
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityRole']}).toJSX(),
+ ).toEqual(null);
+ });
+ });
+
+ describe('accessibilityElementsHidden', () => {
+ it('is not propagated to mounting layer, it is iOS only prop', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(
+ root
+ .getRenderedOutput({props: ['accessibilityElementsHidden']})
+ .toJSX(),
+ ).toEqual(null);
+ });
+ });
+
+ describe('accessibilityHint', () => {
+ it('is propagated to the mounting layer', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityHint']}).toJSX(),
+ ).toEqual();
+ });
- it('does not unflatten view', () => {
- const root = Fantom.createRoot();
+ it('does not unflatten view', () => {
+ const root = Fantom.createRoot();
- Fantom.runTask(() => {
- root.render();
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityHint']}).toJSX(),
+ ).toEqual(null);
+ });
+ });
+
+ describe('accessibilityLabel', () => {
+ it('is propagated to the mounting layer', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+ ,
+ );
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityLabel']}).toJSX(),
+ ).toEqual();
+ });
+
+ it('does not unflatten view', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityLabel']}).toJSX(),
+ ).toEqual(null);
+ });
+ });
+
+ describe('accessibilityLiveRegion', () => {
+ it('is propagated to the mounting layer', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+ ,
+ );
+ });
+
+ expect(
+ root
+ .getRenderedOutput({props: ['accessibilityLiveRegion']})
+ .toJSX(),
+ ).toEqual();
+ });
+
+ it('does not unflatten view', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(
+ root
+ .getRenderedOutput({props: ['accessibilityLiveRegion']})
+ .toJSX(),
+ ).toEqual(null);
+ });
+ });
+
+ describe('accessibilityRole', () => {
+ it('is propagated to the mounting layer', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render(
+ ,
+ );
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityRole']}).toJSX(),
+ ).toEqual();
+ });
+
+ it('does not unflatten view', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(
+ root.getRenderedOutput({props: ['accessibilityRole']}).toJSX(),
+ ).toEqual(null);
+ });
+ });
});
- expect(
- root.getRenderedOutput({props: ['accessibilityRole']}).toJSX(),
- ).toEqual(null);
+ describe('accessible', () => {
+ it('unflattens view', () => {
+ const root = Fantom.createRoot();
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(root.getRenderedOutput({props: ['accessible']}).toJSX()).toEqual(
+ null,
+ );
+
+ Fantom.runTask(() => {
+ root.render();
+ });
+
+ expect(root.getRenderedOutput({props: ['accessible']}).toJSX()).toEqual(
+ ,
+ );
+ });
+ });
});
});
diff --git a/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h b/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h
index 73d0dd8e778cdd..7a1e1679382a91 100644
--- a/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h
+++ b/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h
@@ -53,6 +53,27 @@ struct AccessibilityAction {
std::optional label{};
};
+inline std::string toString(const AccessibilityAction& accessibilityAction) {
+ std::string result = accessibilityAction.name;
+ if (accessibilityAction.label.has_value()) {
+ result += ": '" + accessibilityAction.label.value() + "'";
+ }
+ return result;
+}
+
+inline std::string toString(
+ std::vector accessibilityActions) {
+ std::string result = "[";
+ for (size_t i = 0; i < accessibilityActions.size(); i++) {
+ result += toString(accessibilityActions[i]);
+ if (i < accessibilityActions.size() - 1) {
+ result += ", ";
+ }
+ }
+ result += "]";
+ return result;
+}
+
inline static bool operator==(
const AccessibilityAction& lhs,
const AccessibilityAction& rhs) {
@@ -136,6 +157,18 @@ enum class AccessibilityLiveRegion : uint8_t {
Assertive,
};
+inline std::string toString(
+ const AccessibilityLiveRegion& accessibilityLiveRegion) {
+ switch (accessibilityLiveRegion) {
+ case AccessibilityLiveRegion::None:
+ return "none";
+ case AccessibilityLiveRegion::Polite:
+ return "polite";
+ case AccessibilityLiveRegion::Assertive:
+ return "assertive";
+ }
+}
+
enum class AccessibilityRole {
None,
Button,
diff --git a/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityProps.cpp b/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityProps.cpp
index 90153a6bba4b52..495b2aa1861540 100644
--- a/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityProps.cpp
+++ b/packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityProps.cpp
@@ -301,6 +301,7 @@ void AccessibilityProps::setProp(
#pragma mark - DebugStringConvertible
#if RN_DEBUG_STRING_CONVERTIBLE
+
SharedDebugStringConvertibleList AccessibilityProps::getDebugProps() const {
const auto& defaultProps = AccessibilityProps();
return SharedDebugStringConvertibleList{
@@ -309,6 +310,28 @@ SharedDebugStringConvertibleList AccessibilityProps::getDebugProps() const {
"accessibilityRole",
accessibilityRole,
defaultProps.accessibilityRole),
+ debugStringConvertibleItem(
+ "accessible", accessible, defaultProps.accessible),
+ debugStringConvertibleItem(
+ "accessibilityActions",
+ accessibilityActions,
+ defaultProps.accessibilityActions),
+ debugStringConvertibleItem(
+ "accessibilityElementsHidden",
+ accessibilityElementsHidden,
+ defaultProps.accessibilityElementsHidden),
+ debugStringConvertibleItem(
+ "accessibilityHint",
+ accessibilityHint,
+ defaultProps.accessibilityHint),
+ debugStringConvertibleItem(
+ "accessibilityLabel",
+ accessibilityLabel,
+ defaultProps.accessibilityLabel),
+ debugStringConvertibleItem(
+ "accessibilityLiveRegion",
+ accessibilityLiveRegion,
+ defaultProps.accessibilityLiveRegion),
};
}
#endif // RN_DEBUG_STRING_CONVERTIBLE
diff --git a/packages/react-native/ReactCommon/react/renderer/debug/debugStringConvertibleUtils.h b/packages/react-native/ReactCommon/react/renderer/debug/debugStringConvertibleUtils.h
index 55213b78c8b409..4ffcfca122e8b1 100644
--- a/packages/react-native/ReactCommon/react/renderer/debug/debugStringConvertibleUtils.h
+++ b/packages/react-native/ReactCommon/react/renderer/debug/debugStringConvertibleUtils.h
@@ -7,11 +7,9 @@
#pragma once
-#include
#include
#include
#include
-#include
#include
#include