mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Add View box shadow e2e tests (#46054)
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/46054 tsia, more test = good Changelog: [Internal] Reviewed By: necolas Differential Revision: D60938608 fbshipit-source-id: abce5ab7d42a7f7f626f0edc852aa1374f8029f0
This commit is contained in:
committed by
Facebook GitHub Bot
parent
de39ebb9f8
commit
d490354cd8
@@ -452,6 +452,87 @@ function LayoutConformanceBox(): React.Node {
|
||||
);
|
||||
}
|
||||
|
||||
function BoxShadowExample(): React.Node {
|
||||
const defaultStyleSize = {width: 75, height: 75};
|
||||
|
||||
return (
|
||||
<View testID="view-test-box-shadow" style={{gap: 20}}>
|
||||
<View style={{flexDirection: 'row', gap: 15}}>
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
borderRadius: 10,
|
||||
borderWidth: 5,
|
||||
borderColor: 'red',
|
||||
experimental_boxShadow: '0 0 10px 0 black',
|
||||
}}
|
||||
/>
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
borderRadius: 30,
|
||||
borderWidth: 5,
|
||||
borderColor: 'red',
|
||||
experimental_boxShadow: 'inset 0 0 10px 0 black',
|
||||
}}
|
||||
/>
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
borderRadius: 30,
|
||||
borderWidth: 5,
|
||||
borderColor: 'red',
|
||||
experimental_boxShadow:
|
||||
'inset 15px -5px 5px 5px cyan, inset 15px -5px 20px 10px orange, -5px 5px 5px 0px green, 0px -10px 0px 5px black',
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
<View style={{flexDirection: 'row', gap: 15}}>
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
experimental_boxShadow: '0px 0px 5px 5px black',
|
||||
}}>
|
||||
<View
|
||||
style={{
|
||||
left: -10,
|
||||
width: 25,
|
||||
height: 25,
|
||||
backgroundColor: 'cyan',
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
backgroundColor: 'red',
|
||||
experimental_boxShadow: 'inset 0px 0px 5px 5px black',
|
||||
}}
|
||||
/>
|
||||
<View style={{...defaultStyleSize, flexDirection: 'row'}}>
|
||||
<View style={{width: 25, height: 25, backgroundColor: 'cyan'}} />
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
experimental_boxShadow: ' 0px 0px 20px 5px black',
|
||||
}}
|
||||
/>
|
||||
<View style={{width: 25, height: 25, backgroundColor: 'cyan'}} />
|
||||
</View>
|
||||
</View>
|
||||
<View style={{flexDirection: 'row', gap: 15}}>
|
||||
<View
|
||||
style={{
|
||||
...defaultStyleSize,
|
||||
backgroundColor: 'green',
|
||||
experimental_boxShadow: '0px 10px',
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
export default ({
|
||||
title: 'View',
|
||||
documentationURL: 'https://reactnative.dev/docs/view',
|
||||
@@ -1078,5 +1159,10 @@ export default ({
|
||||
name: 'layout-conformance',
|
||||
render: LayoutConformanceExample,
|
||||
},
|
||||
{
|
||||
title: 'Box Shadow',
|
||||
name: 'box-shadow',
|
||||
render: BoxShadowExample,
|
||||
},
|
||||
],
|
||||
}: RNTesterModule);
|
||||
|
||||
Reference in New Issue
Block a user