Adding rule for no-unguarded-document + tests (#15)

* Adding rule for no-unguarded-document + tests

Author: scalvert

config/recommended.js

@@ -15,6 +15,8 @@ module.exports = {
     'ember-best-practices/no-attrs': 2,
     'ember-best-practices/no-observers': 2,
     'ember-best-practices/require-dependent-keys': 2,
-    'ember-best-practices/no-lifecycle-events': 2
+    'ember-best-practices/no-lifecycle-events': 2,
+    'ember-best-practices/no-timers': 2,
+    'ember-best-practices/no-unguarded-document': 2
   }
 };

guides/rules/no-timers.md

@@ -1,2 +1,38 @@
 # No Timers
 
+**TL;DR: You should avoid using timers in favor of Ember.later**
+
+In general, it's best to avoid the use of `setTimeout` and `setInterval` in Ember. 
+
+From the Ember documentation:
+
+> You should use this method whenever you need to run some action after a period of time instead of 
+using setTimeout(). This method will ensure that items that expire during the same script execution 
+cycle all execute together, which is often more efficient than using a real setTimeout.
+
+While `setTimeout` maps to `Ember.run.later`, there isn't a direct equivalent of `setInterval`. You
+can accomplish the rough equivalent of `setInterval` by using a recursive `setTimeout`.
+
+Example:
+
+```js
+Ember.Component.extend({
+  init() {
+   this._super(...arguments);
+   this.intervalToken = this.schedule(() => alert('Alert'));
+   this.interval = 1000;
+  }
+
+  schedule(fn) {
+    return Ember.run.later(() => {
+      fn()
+      this.set('intervalToken', this.schedule(fn));
+    }, this.interval);
+  }
+
+  willDestroy() {
+    this._super(...arguments);
+    Ember.run.cancel(this.intervalToken);
+  }  
+});
+```

guides/rules/no-unguarded-document.md

@@ -0,0 +1,23 @@
+# No Unguarded Document References
+
+**TL;DR: Ensure that all document references are guarded inside an if block with the condition `environment.isBrowser()`**
+
+Unguarded document references will break when used with FastBoot. This is due to the Node environment
+not having a global `document` object. 
+
+To protect against errors during server side rendering, you should ensure you're guarding the usages
+of `document` with a check to `environment.isBrowser()`.
+
+Example:
+
+```js
+import Ember from 'ember';
+
+Ember.component.extend({
+  init() {
+    if (environment.isBrowser()) {
+      this.element = document.querySelector('.my-element');
+    }
+  }
+});
+```

lib/rules/no-unguarded-document.js

@@ -0,0 +1,22 @@
+const { isGuarded } = require('../utils/fast-boot');
+
+const MESSAGE = 'Do not use unguarded document references. Please see the following guide for more infromation: http://github.com/chadhietala/ember-best-practices/files/guides/no-unguarded-document.md';
+
+function isDocumentReference(node) {
+  return node.callee.object.name === 'document';
+}
+
+module.exports = {
+  meta: {
+    message: MESSAGE
+  },
+  create(context) {
+    return {
+      CallExpression(node) {
+        if (isDocumentReference(node) && !isGuarded(node)) {
+          context.report(node, MESSAGE);
+        }
+      }
+    };
+  }
+};

tests/lib/rules/no-unguarded-document.js

@@ -0,0 +1,73 @@
+const rule = require('../../../lib/rules/no-unguarded-document');
+const MESSAGE = rule.meta.message;
+const RuleTester = require('eslint').RuleTester;
+const ruleTester = new RuleTester();
+
+ruleTester.run('no-timers', rule, {
+  valid: [
+    {
+      code: `
+        export default Ember.Component.extend({
+          actions: {
+            foo() {
+              if (environment.isBrowser()) {
+                const node = document.querySelector('blah');
+              }
+            }
+          }
+        });`,
+      parserOptions: {
+        ecmaVersion: 6,
+        sourceType: 'module'
+      }
+    },
+    {
+      code: `
+        export default Ember.Component.extend({
+          guarded() {
+            if (environment.isBrowser()) {
+                const node = document.querySelector('blah');
+              }
+          }
+        });`,
+      parserOptions: {
+        ecmaVersion: 6,
+        sourceType: 'module'
+      }
+    }
+  ],
+  invalid: [
+    {
+      code: `
+        export default Ember.Component({
+          actions: {
+            bar() {
+              const node = document.querySelector('blah');
+            }
+          }
+        });`,
+      parserOptions: {
+        ecmaVersion: 6,
+        sourceType: 'module'
+      },
+      errors: [{
+        message: MESSAGE
+      }]
+    },
+    {
+      code: `
+        export default Ember.Component({
+          baz() {
+            const node = document.querySelector('blah');
+          }
+        });`,
+      parserOptions: {
+        ecmaVersion: 6,
+        sourceType: 'module'
+      },
+      errors: [{
+        message: MESSAGE
+      }]
+    }
+  ]
+});