EmberJS - Click() helper doesn't work as expected

Question

When passing the JQuery selector to the click() method in emberjs, while testing, the element doesn't get clicked. I'm trying to write a simple acceptance test where an element with an id and an href gets clicked and the URL changes, and then I assert that the page changed.

I added the id to the <a> element id="sidebar-user-profile" and when I try click($('#sidebar-user-profile')) I get the error "Error: Element [object Object] not found.". I tried doing the same, while on the page, in Chrome's console by typing $('#sidebar-user-profile') and it selected that exact element.

I've been trying to get this to work for the past 2 weeks and I'm out of options.

edit: Here's the test that has the error:

test('exists and works /home/user-profile', function(assert) {
  assert.expect(1);
  click('#sidebar-user-profile');
  andThen(function() {
    assert.equal(currentURL(), '/home/user-profile');
  });
});

<li>{{#link-to 'home.user-profile' id="sidebar-user-profile"}}User Profile{{/link-to}}</li>

Answer 1

Click takes a selector not a jquery object, your test would look something like:

click('#sidebar-user-profile');
andThen(() => {
  assert.equal(currentURL(), `/myurl/new`, 'Should go to new route');
});

Edit:

test('exists and works /home/user-profile', function(assert) {
  visit('/home'); // route where your link-to is located
  click('#sidebar-user-profile');
  andThen(function() {
    assert.equal(currentURL(), '/home/user-profile');
  });
});