Skip to content

Commit

Permalink
Remove style aliases to avoid lint disable
Browse files Browse the repository at this point in the history
  • Loading branch information
@vcalvello
vcalvello committed Nov 5, 2018
1 parent 201a694 commit 74f54c1
Showing 1 changed file with 44 additions and 37 deletions.
81 changes: 44 additions & 37 deletions ReactAndroid/src/androidTest/js/SubviewsClippingTestModule.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,40 +21,38 @@ var ClippableView = requireNativeComponent('ClippableView');

class ClippingSample1 extends React.Component {
render() {
var styles = sample1Styles;
return (
<View>
<ClippableView
clippableViewID="outer"
style={styles.outer}
style={sample1Styles.outer}
removeClippedSubviews={true}>
<ClippableView
clippableViewID="inner1"
style={[styles.inner, styles.inner1]}
style={[sample1Styles.inner, sample1Styles.inner1]}
/>
<ClippableView
clippableViewID="inner2"
style={[styles.inner, styles.inner2]}
style={[sample1Styles.inner, sample1Styles.inner2]}
/>
<ClippableView
clippableViewID="inner3"
style={[styles.inner, styles.inner3]}
style={[sample1Styles.inner, sample1Styles.inner3]}
/>
<ClippableView
clippableViewID="inner4"
style={[styles.inner, styles.inner4]}
style={[sample1Styles.inner, sample1Styles.inner4]}
/>
<ClippableView
clippableViewID="inner5"
style={[styles.inner, styles.inner5]}
style={[sample1Styles.inner, sample1Styles.inner5]}
/>
</ClippableView>
</View>
);
}
}

/* eslint-disable react-native/no-unused-styles */
var sample1Styles = StyleSheet.create({
outer: {
width: 200,
Expand Down Expand Up @@ -88,36 +86,34 @@ var sample1Styles = StyleSheet.create({
top: 50,
},
});
/* eslint-enable */

class ClippingSample2 extends React.Component {
render() {
var styles = sample2Styles;
return (
<View>
<ClippableView
clippableViewID="outer"
style={styles.outer}
style={sample2Styles.outer}
removeClippedSubviews={true}>
<ClippableView
clippableViewID="complexInner"
style={styles.complexInner}
style={sample2Styles.complexInner}
removeClippedSubviews={true}>
<ClippableView
clippableViewID="inner1"
style={[styles.inner, styles.inner1]}
style={[sample2Styles.inner, sample2Styles.inner1]}
/>
<ClippableView
clippableViewID="inner2"
style={[styles.inner, styles.inner2]}
style={[sample2Styles.inner, sample2Styles.inner2]}
/>
<ClippableView
clippableViewID="inner3"
style={[styles.inner, styles.inner3]}
style={[sample2Styles.inner, sample2Styles.inner3]}
/>
<ClippableView
clippableViewID="inner4"
style={[styles.inner, styles.inner4]}
style={[sample2Styles.inner, sample2Styles.inner4]}
/>
</ClippableView>
</ClippableView>
Expand All @@ -126,7 +122,6 @@ class ClippingSample2 extends React.Component {
}
}

/* eslint-disable react-native/no-unused-styles */
var sample2Styles = StyleSheet.create({
outer: {
width: 200,
Expand Down Expand Up @@ -164,21 +159,24 @@ var sample2Styles = StyleSheet.create({
bottom: 10,
},
});
/* eslint-enable */

class UpdatingSample1 extends React.Component {
render() {
var styles = updating1Styles;
var inner1Styles = [
styles.inner1,
updating1Styles.inner1,
{height: this.props.update1 ? 200 : 100},
];
var inner2Styles = [styles.inner2, {top: this.props.update2 ? 200 : 50}];

var inner2Styles = [
updating1Styles.inner2,
{top: this.props.update2 ? 200 : 50},
];

return (
<View>
<ClippableView
clippableViewID="outer"
style={styles.outer}
style={updating1Styles.outer}
removeClippedSubviews={true}>
<ClippableView clippableViewID="inner1" style={inner1Styles} />
<ClippableView clippableViewID="inner2" style={inner2Styles} />
Expand All @@ -188,7 +186,6 @@ class UpdatingSample1 extends React.Component {
}
}

/* eslint-disable react-native/no-unused-styles */
var updating1Styles = StyleSheet.create({
outer: {
width: 200,
Expand All @@ -212,26 +209,30 @@ var updating1Styles = StyleSheet.create({
backgroundColor: 'green',
},
});
/* eslint-enable */

class UpdatingSample2 extends React.Component {
render() {
var styles = updating2Styles;
var outerStyles = [styles.outer, {height: this.props.update ? 200 : 100}];
var outerStyles = [
updating2Styles.outer,
{height: this.props.update ? 200 : 100},
];

return (
<View>
<ClippableView
clippableViewID="outer"
style={outerStyles}
removeClippedSubviews={true}>
<ClippableView clippableViewID="inner" style={styles.inner} />
<ClippableView
clippableViewID="inner"
style={updating2Styles.inner}
/>
</ClippableView>
</View>
);
}
}

/* eslint-disable react-native/no-unused-styles */
var updating2Styles = StyleSheet.create({
outer: {
width: 100,
Expand All @@ -246,43 +247,50 @@ var updating2Styles = StyleSheet.create({
backgroundColor: 'green',
},
});
/* eslint-enable */

class ScrollViewTest extends React.Component {
render() {
var styles = scrollTestStyles;
var children = [];
for (var i = 0; i < 4; i++) {
children[i] = (
<ClippableView key={i} style={styles.row} clippableViewID={'' + i} />
<ClippableView
key={i}
style={scrollTestStyles.row}
clippableViewID={'' + i}
/>
);
}
for (var i = 4; i < 6; i++) {
var viewID = 'C' + (i - 4);
children[i] = (
<ClippableView
key={i}
style={styles.complex}
style={scrollTestStyles.complex}
clippableViewID={viewID}
removeClippedSubviews={true}>
<ClippableView style={styles.inner} clippableViewID={viewID + '.1'} />
<ClippableView style={styles.inner} clippableViewID={viewID + '.2'} />
<ClippableView
style={scrollTestStyles.inner}
clippableViewID={viewID + '.1'}
/>
<ClippableView
style={scrollTestStyles.inner}
clippableViewID={viewID + '.2'}
/>
</ClippableView>
);
}

return (
<ScrollView
removeClippedSubviews={true}
style={styles.scrollView}
style={scrollTestStyles.scrollView}
testID="scroll_view">
{children}
</ScrollView>
);
}
}

/* eslint-disable react-native/no-unused-styles */
var scrollTestStyles = StyleSheet.create({
scrollView: {
width: 200,
Expand Down Expand Up @@ -311,7 +319,6 @@ var scrollTestStyles = StyleSheet.create({
borderWidth: 1,
},
});
/* eslint-enable */

var appInstance = null;

Expand Down

0 comments on commit 74f54c1

Please sign in to comment.