title: Nightwatch ERROR: Unable to locate element: using: css selector
body: <p>I am a newbie to nightwatch and javascript and for the life of me I am getting stuck at some weird places. I am trying to do a simple test which just clicks on three different tab menu items one at a time. When I run the code I get an <strong>ERROR: Unable to locate element: "@Performing_AF" using: css selector.</strong></p>
  
  <p>If I go ahead and use the css selector directly opposed to using elements the code works. Can someone guide me as to where I am going wrong?</p>
  
  <p>The URL I am testing is: <a href="https://www.nypl.org/" rel="nofollow noreferrer">https://www.nypl.org/</a></p>
  
  <p>Here is <strong>/pages/homepage.js</strong></p>
  
  <pre><code>    var elements = {
       searchbutton: '.nyplHomepageApp button[name = "Search Button"]',
       Authortalksconversations: '.titleTabs #tab-0',
       Exibitions: '.titleTabs #tab-1',
       Performing_AF: '.titleTabs #tab-2',
       Other_Events: '.titleTabs #tab-3',
       DonateButton: '#donateButton',
       Shop: '#shopTopLink',
       loadicon: '.dcom-loader',
       searchboxbutton: 'button[type="submit"]',
       inputsearch: '.desktopSearch-form-inputBox #desktopSearch-form-searchInput'
  
     };
  
     var quicksearch = {
       go: function()
       {
               this
                       .waitForElementVisible('body', 6000)
                       .api.pause(2000)
                       .click('@Exibitions')
                       .pause(2000)
                       .click('@Other_Events')
                       .pause(2000)
                       .click('@Performing_AF')
  
       }
  
    };
  
   module.exports = {
       elements,
       commands: [quicksearch]
   };      
  </code></pre>
  
  <p>And here is tests/homepagetest.js</p>
  
  <pre><code>     module.exports = {
  
  'Q': function(browser) {
      var goto = browser.page.homepage();
      goto.go;
  
  
      //browser.end();
          }
  
     }
  </code></pre>