diff --git a/tests/lib/rules/no-color-literals.js b/tests/lib/rules/no-color-literals.js index 4a4e452..b616f91 100644 --- a/tests/lib/rules/no-color-literals.js +++ b/tests/lib/rules/no-color-literals.js @@ -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 ;', - ' }', - '}', - ].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 ; + } + } + `, }, { - 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 ;', - ' }', - '}', - ].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 ; + } + } + `, }, ], invalid: [ { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Color literal: { backgroundColor: \'#FFFFFF\' }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Color literal: { backgroundColor: \'#FFFFFF\' }', }], }, { - code: [ - 'const styles = StyleSheet.create({', - ' text: {fontColor: \'#000\'}', - '})', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', //eslint-disable-line - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {fontColor: '#000'} + }) + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Color literal: { fontColor: \'#000\' }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Color literal: { backgroundColor: \'#FFFFFF\' }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' const someBoolean = false; ', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + const someBoolean = false; + return + Hello {this.props.name} + ; + } + }); + `, 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 ;', - ' }', - '}', - ].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 ; + } + } + `, errors: [ { message: 'Color literal: { color: \'red\' }', diff --git a/tests/lib/rules/no-inline-styles.js b/tests/lib/rules/no-inline-styles.js index 8109832..0561545 100644 --- a/tests/lib/rules/no-inline-styles.js +++ b/tests/lib/rules/no-inline-styles.js @@ -25,154 +25,154 @@ const tests = { valid: [ { - code: [ - 'const styles = StyleSheet.create({', - ' style1: {', - ' color: \'red\',', - ' },', - ' style2: {', - ' color: \'blue\',', - ' }', - '});', - 'export default class MyComponent extends Component {', - ' static propTypes = {', - ' isDanger: PropTypes.bool', - ' };', - ' render() {', - ' return ;', - ' }', - '}', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + style1: { + color: 'red', + }, + style2: { + color: 'blue', + } + }); + export default class MyComponent extends Component { + static propTypes = { + isDanger: PropTypes.bool + }; + render() { + return ; + } + } + `, }, { - 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 ;', - ' }', - '}', - ].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 ; + } + } + `, }, ], invalid: [ { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Inline style: { backgroundColor: \'#FFFFFF\', opacity: 0.5 }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Inline style: { backgroundColor: \'#FFFFFF\' }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Inline style: { height: 12 }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Inline style: { marginLeft: -7, height: 12 }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Inline style: { backgroundColor: \'#FFFFFF\' }', }], }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' const someBoolean = false; ', - ' return ', - ' Hello {this.props.name}', - ' ;', - ' }', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + const someBoolean = false; + return + Hello {this.props.name} + ; + } + }); + `, errors: [{ message: 'Inline style: { backgroundColor: \'#FFFFFF\' }', }], }, { - code: [ - 'const styles = StyleSheet.create({', - ' style1: {', - ' color: \'red\',', - ' },', - ' style2: {', - ' color: \'blue\',', - ' }', - '});', - 'export default class MyComponent extends Component {', - ' render() {', - ' return ;', - ' }', - '}', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + style1: { + color: 'red', + }, + style2: { + color: 'blue', + } + }); + export default class MyComponent extends Component { + render() { + return ; + } + } + `, errors: [{ message: 'Inline style: { backgroundColor: \'someBoolean ? \\\'#fff\\\' : \\\'#000\\\'\' }', //eslint-disable-line }], diff --git a/tests/lib/rules/no-unused-styles.js b/tests/lib/rules/no-unused-styles.js index 1b2a80c..15904bf 100644 --- a/tests/lib/rules/no-unused-styles.js +++ b/tests/lib/rules/no-unused-styles.js @@ -21,232 +21,232 @@ require('babel-eslint'); const ruleTester = new RuleTester(); const tests = { valid: [{ - code: [ - 'const styles = StyleSheet.create({', - ' name: {}', - '});', - 'const Hello = React.createClass({', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + name: {} + }); + const Hello = React.createClass({ + render: function() { + return Hello {this.props.name}; + } + }); + `, }, { - code: [ - 'const Hello = React.createClass({', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - 'const styles = StyleSheet.create({', - ' name: {}', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + render: function() { + return Hello {this.props.name}; + } + }); + const styles = StyleSheet.create({ + name: {} + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' name: {}', - '});', - 'const Hello = React.createClass({', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + name: {} + }); + const Hello = React.createClass({ + render: function() { + return Hello {this.props.name}; + } + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' name: {},', - ' welcome: {}', - '});', - 'const Hello = React.createClass({', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - 'const Welcome = React.createClass({', - ' render: function() {', - ' return Welcome;', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + name: {}, + welcome: {} + }); + const Hello = React.createClass({ + render: function() { + return Hello {this.props.name}; + } + }); + const Welcome = React.createClass({ + render: function() { + return Welcome; + } + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' text: {}', - '})', - 'const Hello = React.createClass({', - ' propTypes: {', - ' textStyle: Text.propTypes.style,', - ' },', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {} + }) + const Hello = React.createClass({ + propTypes: { + textStyle: Text.propTypes.style, + }, + render: function() { + return Hello {this.props.name}; + } + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' text: {}', - '})', - 'const styles2 = StyleSheet.create({', - ' text: {}', - '})', - 'const Hello = React.createClass({', - ' propTypes: {', - ' textStyle: Text.propTypes.style,', - ' },', - ' render: function() {', - ' return (', - ' ', - ' Hello {this.props.name}', - ' ', - ' );', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {} + }) + const styles2 = StyleSheet.create({ + text: {} + }) + const Hello = React.createClass({ + propTypes: { + textStyle: Text.propTypes.style, + }, + render: function() { + return ( + + Hello {this.props.name} + + ); + } + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' text: {}', - '});', - 'const Hello = React.createClass({', - ' getInitialState: function() {', - ' return { condition: true, condition2: true }; ', - ' },', - ' render: function() {', - ' return (', - ' ', - ' Hello {this.props.name}', - ' ', - ' );', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {} + }); + const Hello = React.createClass({ + getInitialState: function() { + return { condition: true, condition2: true }; + }, + render: function() { + return ( + + Hello {this.props.name} + + ); + } + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' text: {},', - ' text2: {},', - '});', - 'const Hello = React.createClass({', - ' getInitialState: function() {', - ' return { condition: true }; ', - ' },', - ' render: function() {', - ' return (', - ' ', - ' Hello {this.props.name}', - ' ', - ' );', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {}, + text2: {}, + }); + const Hello = React.createClass({ + getInitialState: function() { + return { condition: true }; + }, + render: function() { + return ( + + Hello {this.props.name} + + ); + } + }); + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' style1: {', - ' color: \'red\',', - ' },', - ' style2: {', - ' color: \'blue\',', - ' }', - '});', - 'export default class MyComponent extends Component {', - ' static propTypes = {', - ' isDanger: PropTypes.bool', - ' };', - ' render() {', - ' return ;', - ' }', - '}', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + style1: { + color: 'red', + }, + style2: { + color: 'blue', + } + }); + export default class MyComponent extends Component { + static propTypes = { + isDanger: PropTypes.bool + }; + render() { + return ; + } + } + `, }, { - code: [ - 'const styles = StyleSheet.create({', - ' text: {}', - '})', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {} + }) + `, }, { - code: [ - 'const Hello = React.createClass({', - ' getInitialState: function() {', - ' return { condition: true }; ', - ' },', - ' render: function() {', - ' const myStyle = this.state.condition ? styles.text : styles.text2;', - ' return (', - ' ', - ' Hello {this.props.name}', - ' ', - ' );', - ' }', - '});', - 'const styles = StyleSheet.create({', - ' text: {},', - ' text2: {},', - '});', - ].join('\n'), + code: ` + const Hello = React.createClass({ + getInitialState: function() { + return { condition: true }; + }, + render: function() { + const myStyle = this.state.condition ? styles.text : styles.text2; + return ( + + Hello {this.props.name} + + ); + } + }); + const styles = StyleSheet.create({ + text: {}, + text2: {}, + }); + `, }, { - code: [ - 'const additionalStyles = {};', - 'const styles = StyleSheet.create({', - ' name: {},', - ' ...additionalStyles', - '});', - 'const Hello = React.createClass({', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - ].join('\n'), + code: ` + const additionalStyles = {}; + const styles = StyleSheet.create({ + name: {}, + ...additionalStyles + }); + const Hello = React.createClass({ + render: function() { + return Hello {this.props.name}; + } + }); + `, }], invalid: [{ - code: [ - 'const styles = StyleSheet.create({', - ' text: {}', - '})', - 'const Hello = React.createClass({', - ' render: function() {', - ' return Hello {this.props.name};', - ' }', - '});', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + text: {} + }) + const Hello = React.createClass({ + render: function() { + return Hello {this.props.name}; + } + }); + `, errors: [{ message: 'Unused style detected: styles.text', }], }, { - code: [ - 'const styles = StyleSheet.create({', - ' foo: {},', - ' bar: {},', - '})', - 'class Foo extends React.Component {', - ' render() {', - ' return ;', - ' }', - '}', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + foo: {}, + bar: {}, + }) + class Foo extends React.Component { + render() { + return ; + } + } + `, errors: [{ message: 'Unused style detected: styles.bar', }], }, { - code: [ - 'const styles = StyleSheet.create({', - ' foo: {},', - ' bar: {},', - '})', - 'class Foo extends React.PureComponent {', - ' render() {', - ' return ;', - ' }', - '}', - ].join('\n'), + code: ` + const styles = StyleSheet.create({ + foo: {}, + bar: {}, + }) + class Foo extends React.PureComponent { + render() { + return ; + } + } + `, errors: [{ message: 'Unused style detected: styles.bar', }], diff --git a/tests/lib/rules/split-platform-components.js b/tests/lib/rules/split-platform-components.js index 49f8c14..a1b6cb7 100644 --- a/tests/lib/rules/split-platform-components.js +++ b/tests/lib/rules/split-platform-components.js @@ -22,93 +22,93 @@ require('babel-eslint'); const ruleTester = new RuleTester(); const tests = { valid: [{ - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ActivityIndicatiorIOS,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ActivityIndicatiorIOS, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, filename: 'Hello.ios.js', }, { - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ProgressBarAndroid,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ProgressBarAndroid, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, filename: 'Hello.android.js', }, { - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' View,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + View, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, filename: 'Hello.js', }, { - code: [ - 'import {', - ' ActivityIndicatiorIOS,', - '} from \'react-native\'', - ].join('\n'), + code: ` + import { + ActivityIndicatiorIOS, + } from 'react-native' + `, filename: 'Hello.ios.js', }, { - code: [ - 'import {', - ' ProgressBarAndroid,', - '} from \'react-native\'', - ].join('\n'), + code: ` + import { + ProgressBarAndroid, + } from 'react-native' + `, filename: 'Hello.android.js', }, { - code: [ - 'import {', - ' View,', - '} from \'react-native\'', - ].join('\n'), + code: ` + import { + View, + } from 'react-native' + `, filename: 'Hello.js', }, { - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ActivityIndicatiorIOS,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ActivityIndicatiorIOS, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, options: [{ iosPathRegex: '\\.ios(\\.test)?\\.js$', }], filename: 'Hello.ios.test.js', }, { - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ProgressBarAndroid,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ProgressBarAndroid, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, options: [{ androidPathRegex: '\\.android(\\.test)?\\.js$', }], @@ -116,50 +116,50 @@ const tests = { }], invalid: [{ - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ProgressBarAndroid,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ProgressBarAndroid, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, filename: 'Hello.js', errors: [{ message: 'Android components should be placed in android files', }], }, { - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ActivityIndicatiorIOS,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ActivityIndicatiorIOS, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, filename: 'Hello.js', errors: [{ message: 'IOS components should be placed in ios files', }], }, { - code: [ - 'const React = require(\'react-native\');', - 'const {', - ' ActivityIndicatiorIOS,', - ' ProgressBarAndroid,', - '} = React', - 'const Hello = React.createClass({', - ' render: function() {', - ' return ;', - ' }', - '});', - ].join('\n'), + code: ` + const React = require('react-native'); + const { + ActivityIndicatiorIOS, + ProgressBarAndroid, + } = React + const Hello = React.createClass({ + render: function() { + return ; + } + }); + `, filename: 'Hello.js', errors: [{ message: 'IOS and Android components can\'t be mixed', @@ -167,32 +167,32 @@ const tests = { message: 'IOS and Android components can\'t be mixed', }], }, { - code: [ - 'import {', - ' ProgressBarAndroid,', - '} from \'react-native\'', - ].join('\n'), + code: ` + import { + ProgressBarAndroid, + } from 'react-native' + `, filename: 'Hello.js', errors: [{ message: 'Android components should be placed in android files', }], }, { - code: [ - 'import {', - ' ActivityIndicatiorIOS,', - '} from \'react-native\'', - ].join('\n'), + code: ` + import { + ActivityIndicatiorIOS, + } from 'react-native' + `, filename: 'Hello.js', errors: [{ message: 'IOS components should be placed in ios files', }], }, { - code: [ - 'import {', - ' ActivityIndicatiorIOS,', - ' ProgressBarAndroid,', - '} from \'react-native\'', - ].join('\n'), + code: ` + import { + ActivityIndicatiorIOS, + ProgressBarAndroid, + } from 'react-native' + `, filename: 'Hello.js', errors: [{ message: 'IOS and Android components can\'t be mixed',