Added eslint to the build

Fixes #102
2015-08-11 16:52:57 +01:00
parent 74925f4439
commit 401f473449
7 changed files with 56 additions and 61 deletions
--- a/.eslintrc
+++ b/.eslintrc
@@ -19,10 +19,6 @@
        "define": true
    },
    "rules": {
-        "quotes": "single",
-        "strict": 0,
-        "no-console": false,
-        "no-shadow": false,
-        "no-underscore-dangle": false
+        "quotes": [2, "single"]
    }
 }
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -2,6 +2,8 @@

 module.exports = function(grunt) {

+  require('load-grunt-tasks')(grunt);
+
  grunt.initConfig({

    paths: {
@@ -12,6 +14,13 @@ module.exports = function(grunt) {

    clean: ['<%= paths.distFolder %>'],

+    eslint: {
+      options: {
+        configFile: '.eslintrc'
+      },
+      target: ['<%= paths.srcFolder %>/Layout.js']
+    },
+
    copy: {
      main: {
        expand: true,
@@ -52,13 +61,7 @@ module.exports = function(grunt) {
    }
  });

-  grunt.loadNpmTasks('grunt-contrib-clean');
-  grunt.loadNpmTasks('grunt-contrib-copy');
-  grunt.loadNpmTasks('grunt-contrib-uglify');
-  grunt.loadNpmTasks('grunt-karma');
-
-  grunt.registerTask('build', ['clean', 'karma' ,'copy', 'uglify']);
+  grunt.registerTask('build', ['eslint', 'clean', 'karma' ,'copy', 'uglify']);

  grunt.registerTask('default', ['build']);
-
 };
--- a/package.json
+++ b/package.json
@@ -3,10 +3,6 @@
  "version": "0.0.2",
  "description": "Reimplementation of CSS layout using pure JavaScript",
  "main": "src/main.js",
-  "scripts": {
-    "pretest": "./node_modules/eslint/bin/eslint.js src",
-    "test": "./node_modules/karma/bin/karma start ./karma.conf.js --single-run"
-  },
  "repository": {
    "type": "git",
    "url": "https://github.com/facebook/css-layout.git"
@@ -18,16 +14,17 @@
  },
  "homepage": "https://github.com/facebook/css-layout",
  "devDependencies": {
-    "eslint": "^0.14.1",
    "grunt": "^0.4.5",
    "grunt-cli": "^0.1.13",
    "grunt-contrib-clean": "^0.6.0",
    "grunt-contrib-copy": "^0.8.0",
    "grunt-contrib-uglify": "^0.9.1",
+    "grunt-eslint": "^17.1.0",
    "grunt-karma": "^0.12.0",
    "jasmine-core": "^2.2.0",
    "karma": "^0.13.8",
    "karma-chrome-launcher": "^0.1.7",
-    "karma-jasmine": "^0.3.5"
+    "karma-jasmine": "^0.3.5",
+    "load-grunt-tasks": "^3.2.0"
  }
 }
--- a/src/JavaTranspiler.js
+++ b/src/JavaTranspiler.js
@@ -140,8 +140,8 @@ var JavaTranspiler = {
    var allTestsInJava = [];
    for (var i = 0; i < allTestsInC.length; i++) {
      allTestsInJava[i] =
-          "  @Test\n" +
-          "  public void testCase" + i + "()\n" +
+          '  @Test\n' +
+          '  public void testCase' + i + '()\n' +
          __transpileSingleTestToJava(allTestsInC[i]);
    }
    return allTestsInJava.join('\n\n');
--- a/src/Layout-test-utils.js
+++ b/src/Layout-test-utils.js
@@ -6,7 +6,7 @@
 * LICENSE file in the root directory of this source tree. An additional grant
 * of patent rights can be found in the PATENTS file in the same directory.
 */
-/* globals document, computeLayout */
+/* globals document, computeLayout, navigator */

 var layoutTestUtils = (function() {

@@ -415,7 +415,7 @@ var layoutTestUtils = (function() {
  // Note(prenaux): Clearly not what I would like, but it seems to be the only
  //                way :( My guess is that since the font on Windows is
  //                different than on OSX it has a different size.
-  if (typeof navigator !== 'undefined' && navigator.userAgent.indexOf("Windows NT") > -1) {
+  if (typeof navigator !== 'undefined' && navigator.userAgent.indexOf('Windows NT') > -1) {
    preDefinedTextSizes.bigHeight = 36;
  }

@@ -450,7 +450,7 @@ var layoutTestUtils = (function() {
      testNamedLayout('expected-dom', expectedLayout, domLayout);
      testNamedLayout('layout-dom', layout, domLayout);
    },
-    testLayoutAgainstDomOnly: function(node, expectedLayout) {
+    testLayoutAgainstDomOnly: function(node) {
      var layout = computeCSSLayout(node);
      var domLayout = computeDOMLayout(node);
      inplaceRoundNumbersInObject(layout);
--- a/src/tests/Layout-test.js
+++ b/src/tests/Layout-test.js
@@ -2122,7 +2122,7 @@ describe('Layout', function() {
      {style: {width: 400, height: 400}, children: [
        {style: {position: 'absolute', top: 100, left: 100, right: 100, bottom: 100, padding: 10}, children: [
          {style: {position: 'absolute', top: 10, left: 10, right: 10, bottom: 10}}
-        ]},
+        ]}
      ]},
      {width: 400, height: 400, top: 0, left: 0, children: [
        {width: 200, height: 200, top: 100, left: 100, children: [
@@ -2137,7 +2137,7 @@ describe('Layout', function() {
      {style: {width: 400, height: 400}, children: [
        {style: {position: 'absolute', top: 100, left: 100, right: 100, bottom: 100, padding: 10, borderWidth: 1}, children: [
          {style: {position: 'absolute', top: 10, left: 10, right: 10, bottom: 10}}
-        ]},
+        ]}
      ]},
      {width: 400, height: 400, top: 0, left: 0, children: [
        {width: 200, height: 200, top: 100, left: 100, children: [
@@ -2152,7 +2152,7 @@ describe('Layout', function() {
      {style: {width: 400, height: 400}, children: [
        {style: {flex: 1, padding: 10}, children: [
          {style: {position: 'absolute', top: 10, left: 10, right: 10, bottom: 10}}
-        ]},
+        ]}
      ]},
      {width: 400, height: 400, top: 0, left: 0, children: [
        {width: 400, height: 400, top: 0, left: 0, children: [
@@ -2195,7 +2195,7 @@ describe('Layout', function() {
        {style: {width: 100, height: 100}},
        {style: {width: 100, height: 100}},
        {style: {width: 100, height: 100}},
-        {style: {width: 100, height: 100}},
+        {style: {width: 100, height: 100}}
      ]},
      {width: 320, height: 200, top: 0, left: 0, children: [
        {width: 100, height: 100, top: 0, left: 0},
@@ -2203,7 +2203,7 @@ describe('Layout', function() {
        {width: 100, height: 100, top: 0, left: 220},
        {width: 100, height: 100, top: 100, left: 0},
        {width: 100, height: 100, top: 100, left: 110},
-        {width: 100, height: 100, top: 100, left: 220},
+        {width: 100, height: 100, top: 100, left: 220}
      ]}
    );
  });
@@ -2330,24 +2330,24 @@ describe('Layout alignContent', function() {
    testLayout(
      {style: {width: 300, height: 380, flexDirection: 'row', flexWrap: 'wrap', alignContent: 'stretch', alignItems: 'flex-start'},
       children: [
-         /* 0 */  {style: {width: 50, height: 50, margin: 10}},
-         /* 1 */  {style: {width: 50, height: 50, margin: 10}},
-         /* 2 */  {style: {width: 50, height: 50, margin: 10}},
-         /* 3 */  {style: {width: 50, height: 50, margin: 10}},
-         /* 4 */  {style: {width: 50, height: 100, margin: 10}},
-         /* 5 */  {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
-         /* 6 */  {style: {width: 50, height: 50, margin: 10}},
-         /* 7 */  {style: {width: 50, height: 100, margin: 10}},
-         /* 8 */  {style: {width: 50, height: 50, margin: 10}},
-         /* 9 */  {style: {width: 50, height: 50, margin: 10}},
+         /* 0 */ {style: {width: 50, height: 50, margin: 10}},
+         /* 1 */ {style: {width: 50, height: 50, margin: 10}},
+         /* 2 */ {style: {width: 50, height: 50, margin: 10}},
+         /* 3 */ {style: {width: 50, height: 50, margin: 10}},
+         /* 4 */ {style: {width: 50, height: 100, margin: 10}},
+         /* 5 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
+         /* 6 */ {style: {width: 50, height: 50, margin: 10}},
+         /* 7 */ {style: {width: 50, height: 100, margin: 10}},
+         /* 8 */ {style: {width: 50, height: 50, margin: 10}},
+         /* 9 */ {style: {width: 50, height: 50, margin: 10}},
         /* 10 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start' }},
         /* 11 */ {style: {width: 50, height: 50, margin: 10}},
         /* 12 */ {style: {width: 50, height: 50, margin: 10}},
         /* 13 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
-         /* 14 */ {style: {width: 50, height: 50, margin: 10}},
-       ],
+         /* 14 */ {style: {width: 50, height: 50, margin: 10}}
+       ]
      },
-      {width: 300, height: 380, top: 0, left: 0,  children: [
+      {width: 300, height: 380, top: 0, left: 0, children: [
        {width: 50, height: 50, top: 10, left: 10},
        {width: 50, height: 50, top: 10, left: 80},
        {width: 50, height: 50, top: 10, left: 150},
@@ -2373,22 +2373,22 @@ describe('Layout alignContent', function() {
      testLayoutAgainstDomOnly(
        {style: {width: 300, height: 380, flexDirection: 'row', flexWrap: 'wrap', alignContent: alignContent, alignItems: alignItems},
         children: [
-           /* 0 */  {style: {width: 50, height: 50, margin: 10}},
-           /* 1 */  {style: {width: 50, height: 50, margin: 10}},
-           /* 2 */  {style: {width: 50, height: 50, margin: 10}},
-           /* 3 */  {style: {width: 50, height: 50, margin: 10}},
-           /* 4 */  {style: {width: 50, height: 100, margin: 10}},
-           /* 5 */  {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
-           /* 6 */  {style: {width: 50, height: 50, margin: 10}},
-           /* 7 */  {style: {width: 50, height: 100, margin: 10}},
-           /* 8 */  {style: {width: 50, height: 50, margin: 10}},
-           /* 9 */  {style: {width: 50, height: 50, margin: 10}},
+           /* 0 */ {style: {width: 50, height: 50, margin: 10}},
+           /* 1 */ {style: {width: 50, height: 50, margin: 10}},
+           /* 2 */ {style: {width: 50, height: 50, margin: 10}},
+           /* 3 */ {style: {width: 50, height: 50, margin: 10}},
+           /* 4 */ {style: {width: 50, height: 100, margin: 10}},
+           /* 5 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
+           /* 6 */ {style: {width: 50, height: 50, margin: 10}},
+           /* 7 */ {style: {width: 50, height: 100, margin: 10}},
+           /* 8 */ {style: {width: 50, height: 50, margin: 10}},
+           /* 9 */ {style: {width: 50, height: 50, margin: 10}},
           /* 10 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start' }},
           /* 11 */ {style: {width: 50, height: 50, margin: 10}},
           /* 12 */ {style: {width: 50, height: 50, margin: 10}},
           /* 13 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
-           /* 14 */ {style: {width: 50, height: 50, margin: 10}},
-         ],
+           /* 14 */ {style: {width: 50, height: 50, margin: 10}}
+         ]
        }
      );
    });
--- a/src/transpile.js
+++ b/src/transpile.js
@@ -20,7 +20,7 @@ global.layoutTestUtils = {
  testLayout: function(node, expectedLayout) {
    allTests.push({name: currentTest, node: node, expectedLayout: expectedLayout});
  },
-  testLayoutAgainstDomOnly: function(node) {
+  testLayoutAgainstDomOnly: function() {
  },
  testRandomLayout: function(node, i) {
    allTests.push({name: 'Random #' + i, node: node, expectedLayout: computeDOMLayout(node)});
@@ -272,15 +272,14 @@ function transpileAnnotatedJStoC(jsCode) {
 }

 function makeConstDefs() {
-  /* eslint no-multi-spaces: 3 */
  var lines = [
-    '#define SMALL_WIDTH '   + layoutTestUtils.textSizes.smallWidth,
-    '#define SMALL_HEIGHT '  + layoutTestUtils.textSizes.smallHeight,
-    '#define BIG_WIDTH '     + layoutTestUtils.textSizes.bigWidth,
-    '#define BIG_HEIGHT '    + layoutTestUtils.textSizes.bigHeight,
+    '#define SMALL_WIDTH ' + layoutTestUtils.textSizes.smallWidth,
+    '#define SMALL_HEIGHT ' + layoutTestUtils.textSizes.smallHeight,
+    '#define BIG_WIDTH ' + layoutTestUtils.textSizes.bigWidth,
+    '#define BIG_HEIGHT ' + layoutTestUtils.textSizes.bigHeight,
    '#define BIG_MIN_WIDTH ' + layoutTestUtils.textSizes.bigMinWidth,
-    '#define SMALL_TEXT "'   + layoutTestUtils.texts.small + '"',
-    '#define LONG_TEXT "'    + layoutTestUtils.texts.big + '"'
+    '#define SMALL_TEXT "' + layoutTestUtils.texts.small + '"',
+    '#define LONG_TEXT "' + layoutTestUtils.texts.big + '"'
  ];
  return lines.join('\n');
 }