CODEWITHSUNDEEP
ember.jsjshint
Boaz
Boaz

Reputation: 5084

JSHint "X is not defined" is wrong

I have an ember.js project (ember_cli) with the following:

Sessions.hbs:

<form class="form-horizontal">
    <div class="form-group">
        <label class="control-label col-xs-1 col-xl-1">Username:</label>
        <div class="col-xs-4 col-xl-4">
          {{view Ember.TextField classBinding=":sessions-query" valueBinding="FilterUserName"}}
        </div>
    </div>
    <div class="form-group">
        <div class="col-xs-1 col-xl-1">
            <button id="query-sessions" {{action "querySessions"}}>Search</button>
        </div>
    </div>
</form>

sessions.js (controller): 

export default Ember.ArrayController.extend({
  actions: {
    querySessions: function () {
      var arr_simple_params = {};
      if ((typeof FilterUserName !== "undefined") && (FilterUserName !== "")) {
        arr_simple_params["user_name"] = FilterUserName;
      }
      ....
    }
  }
});

JSHint gives me: controllers/sessions.js: line 25, col 55, 'FilterUserName' is not defined.

But when I actually use the variable (the rest of the method is using it to build a query string) everything works

So I was wondering why it happens (and not just suppress the warning...)

Upvotes: 0

Views: 209

Answers (1)

Buck Doyle
Buck Doyle

Reputation: 6397

JSHint is upset because you’re referencing a global variable. You should either import FilterUserName like this, at the beginning of the controller:

import FilterUserName from 'path-to-filter'

or warn JSHint that you’re using a global:

/* global FilterUserName */

You can also add FilterUserName to .jshintrc if you’re using it elsewhere.

Upvotes: 3

Related Questions