Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
220 changes: 110 additions & 110 deletions tests/lib/rules/no-color-literals.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,147 +23,147 @@ const ruleTester = new RuleTester();
const tests = {
valid: [
{
code: [
'const $red = \'red\'',
'const $blue = \'blue\'',
'const styles = StyleSheet.create({',
' style1: {',
' color: $red,',
' },',
' style2: {',
' color: $blue,',
' }',
'});',
'export default class MyComponent extends Component {',
' render() {',
' const isDanger = true;',
' return <View ',
' style={[styles.style1, isDanger ? styles.style1 : styles.style2]}',
' />;',
' }',
'}',
].join('\n'),
code: `
const $red = 'red'
const $blue = 'blue'
const styles = StyleSheet.create({
style1: {
color: $red,
},
style2: {
color: $blue,
}
});
export default class MyComponent extends Component {
render() {
const isDanger = true;
return <View
style={[styles.style1, isDanger ? styles.style1 : styles.style2]}
/>;
}
}
`,
},
{
code: [
'const styles = StyleSheet.create({',
' style1: {',
' color: $red,',
' },',
' style2: {',
' color: $blue,',
' }',
'});',
'export default class MyComponent extends Component {',
' render() {',
' const trueColor = \'#fff\';',
' const falseColor = \'#000\' ',
' return <View ',
' style={[style1, ',
' this.state.isDanger && {color: falseColor}, ',
' {color: someBoolean ? trueColor : falseColor }]} ',
' />;',
' }',
'}',
].join('\n'),
code: `
const styles = StyleSheet.create({
style1: {
color: $red,
},
style2: {
color: $blue,
}
});
export default class MyComponent extends Component {
render() {
const trueColor = '#fff';
const falseColor = '#000'
return <View
style={[style1,
this.state.isDanger && {color: falseColor},
{color: someBoolean ? trueColor : falseColor }]}
/>;
}
}
`,
},
],
invalid: [
{
code: [
'const Hello = React.createClass({',
' render: function() {',
' return <Text style={{backgroundColor: \'#FFFFFF\', opacity: 0.5}}>',
' Hello {this.props.name}',
' </Text>;',
' }',
'});',
].join('\n'),
code: `
const Hello = React.createClass({
render: function() {
return <Text style={{backgroundColor: '#FFFFFF', opacity: 0.5}}>
Hello {this.props.name}
</Text>;
}
});
`,
errors: [{
message: 'Color literal: { backgroundColor: \'#FFFFFF\' }',
}],
},
{
code: [
'const Hello = React.createClass({',
' render: function() {',
' return <Text style={{backgroundColor: \'#FFFFFF\', opacity: this.state.opacity}}>',
' Hello {this.props.name}',
' </Text>;',
' }',
'});',
].join('\n'),
code: `
const Hello = React.createClass({
render: function() {
return <Text style={{backgroundColor: '#FFFFFF', opacity: this.state.opacity}}>
Hello {this.props.name}
</Text>;
}
});
`,
errors: [{
message: 'Color literal: { backgroundColor: \'#FFFFFF\' }',
}],
},
{
code: [
'const styles = StyleSheet.create({',
' text: {fontColor: \'#000\'}',
'})',
'const Hello = React.createClass({',
' render: function() {',
' return <Text style={{opacity: this.state.opacity, height: 12, fontColor: styles.text}}>', //eslint-disable-line
' Hello {this.props.name}',
' </Text>;',
' }',
'});',
].join('\n'),
code: `
const styles = StyleSheet.create({
text: {fontColor: '#000'}
})
const Hello = React.createClass({
render: function() {
return <Text style={{opacity: this.state.opacity, height: 12, fontColor: styles.text}}>
Hello {this.props.name}
</Text>;
}
});
`,
errors: [{
message: 'Color literal: { fontColor: \'#000\' }',
}],
},
{
code: [
'const Hello = React.createClass({',
' render: function() {',
' return <Text style={[styles.text, {backgroundColor: \'#FFFFFF\'}]}>',
' Hello {this.props.name}',
' </Text>;',
' }',
'});',
].join('\n'),
code: `
const Hello = React.createClass({
render: function() {
return <Text style={[styles.text, {backgroundColor: '#FFFFFF'}]}>
Hello {this.props.name}
</Text>;
}
});
`,
errors: [{
message: 'Color literal: { backgroundColor: \'#FFFFFF\' }',
}],
},
{
code: [
'const Hello = React.createClass({',
' render: function() {',
' const someBoolean = false; ',
' return <Text style={[styles.text, someBoolean && {backgroundColor: \'#FFFFFF\'}]}>',
' Hello {this.props.name}',
' </Text>;',
' }',
'});',
].join('\n'),
code: `
const Hello = React.createClass({
render: function() {
const someBoolean = false;
return <Text style={[styles.text, someBoolean && {backgroundColor: '#FFFFFF'}]}>
Hello {this.props.name}
</Text>;
}
});
`,
errors: [{
message: 'Color literal: { backgroundColor: \'#FFFFFF\' }',
}],
},
{
code: [
'const styles = StyleSheet.create({',
' style1: {',
' color: \'red\',',
' },',
// this is illegal even though it's not used anywhere
' style2: {',
' borderBottomColor: \'blue\',',
' }',
'});',
'export default class MyComponent extends Component {',
' render() {',
' return <View ',
' style={[style1, ',
' this.state.isDanger && styles.style1, ',
' {backgroundColor: someBoolean ? \'#fff\' : \'#000\'}]} ',
' />;',
' }',
'}',
].join('\n'),
code: `
const styles = StyleSheet.create({
style1: {
color: 'red',
},
// this is illegal even though it's not used anywhere
style2: {
borderBottomColor: 'blue',
}
});
export default class MyComponent extends Component {
render() {
return <View
style={[style1,
this.state.isDanger && styles.style1,
{backgroundColor: someBoolean ? '#fff' : '#000'}]}
/>;
}
}
`,
errors: [
{
message: 'Color literal: { color: \'red\' }',
Expand Down
Loading