"Transition to" redirects away from acceptance test page

Hey!

I need again your help. I have a web app which uses ember-cli, ember-cli-mocha and ember-simple-auth. Now I wanted to write an acceptance test for the login page.

I used the blueprints to generate all the files and folder structure. I put two tests into my login test. One to check if /login is available and another to check if I can actually login. The second test works, but it redirects me to the page which is specified in simple-auth. Also the page switches to

from --> http://localhost:7357/9367/tests/index.html?hidepassed  
to --> http://localhost:7357/settings 

when I then change something in the code no tests are performed and I only see

Not found: /settings

Did I hooked something up wrong? Is this expected? Where can I start to search for the problem?

Hopefully some of you could give me a tip

You need to have locationType=ā€˜noneā€™ for the test environment for this to work.

Do you mean in environment.js? I tried it but it didnā€™t work. The following code is, what I tried to do after your reply:

module.exports = function (environment) {
    //...
    if (environment === 'test') {
        // ...
        ENV.locationType = 'none';
        // ...
    }
    // ...
    return ENV;
};

Any further tips or tricks how to solve this?

EDIT: just saw that with 0.1.3 locationType should be set to none by default see the changelog

Still found no solutionā€¦ I really need your help with this issue

I bump it again, because I still didnā€™t found a solution. Any help is appreciated. BUMP :wink: Still no solution. Any hint, advice or trick is very appreciated :smile:

You need something like a windowProxy that allows you acceptance tests to change window.location

I threw together a full example - check it out and let me know if you have any questions

https://github.com/toranb/window-location-example/blob/master/tests/acceptance/logout-test.js

1 Like

@toranb thank you for the detailed explanation. The problem is, that I donā€™t call window.location anywhere in my code. What I try to do is basically perform a login on my app. So I visit the login page, then fill in username and password and after that I submit the login form. Then the whole login process of ember-simple-auth kicks in and after that Iā€™m redirected to the page which is specified to be the success-page after the login. So Iā€™m not quite sure if a window proxy could help me in this case?

I just checked out the simple auth example [ 1 ]and there it works just fine. So there must be something wrong with my configurationā€¦

@toranb your example and the simple-auth-examples helped me to figure out that I didnā€™t setup anything wrong. My problem is just a case of ā€œnever-ever test your app after developmentā€. Despite everybody knows and agrees to ā€œwrite tests firstā€ sometimes it happens that test are written afterwards. This was the reason why this issue was so hard to find. Too many dependencies to look for errors. But okay back to topic.

The main problem was that I made a mistake with my fixtures. So one fixture wasnā€™t recognized and a call to the server was made. The server responded correctly with ā€œ401 - unauthorizedā€. I had a sessionInvalidationSucceeded action defined on the application route and there the redirection to /login was done (via direct access to window.location, so Iā€™ll have a good use case for your window-proxy :smile:). So it wasnā€™t the ā€œtransition-toā€ routeAfterAuthentication from simple-auth. It was just a programming error. I didnā€™t spot the problem with the fixture because the redirect was so fast that I didnā€™t see the network request in the chrome developer tools. Even ā€œpreserve logā€ didnā€™t show the request. Donā€™t know why. But yeah, Iā€™m soooo happy that it works now.

Hi, I tried to use the proxy but it failed in my case.

ember s

Tests open in localhost:4200/tests

<!-- app/components/accounts-list/template.hbs -->
<h3>Switch organization:</h3>
<ul class="list-unstyled">
  {{#each currentSession.user.accounts as |account|}}
    <!-- original link changed to action to handle window-proxy -->
    <!-- <li><a href="{{account.url}}">{{account.name}}</a></li> -->
    <li><span  {{action "foo" account.url}}>{{account.name}}</span></li>
  {{/each}}
</ul>
// app/components/accounts-list/component.js
import Ember from 'ember';
import windowProxy from "ntfrontend/utils/window-proxy";

export default Ember.Component.extend({
  classNames: 'account-list',

  actions: {
    foo(url) {
      windowProxy.changeLocation(url);
    },
  }
});
module('Acceptance | organization update', {
  beforeEach: function() {
    application = startApp();
    originalChangeLocation = windowProxy.changeLocation;
    windowProxy.changeLocation = function(url) {
      // also tried without /tests
      url = 'http://myorg.localhost:4200/tests';
      window.location = url;
    };
  },
  afterEach: function() {
    Ember.run(application, 'destroy');
    windowProxy.changeLocation = originalChangeLocation;
  }
});

test('editing organization', function(assert) {
  // login user part
  visit('/auth/login');
  fillIn('#inputEmail', 'admin@admin.com');
  fillIn('#inputPassword', 'pass');
  click('button[type="submit"]');
  // user now is redirected to dashboard with organizations listing
  // but tests start anew and fails
  // end of login user part

  // changes location to http://myorg.localhost:4200/tests
  // and re-run the test that fails after
  click('.account-list span:first');
  
  visit('/organization/edit');
  andThen(function() {
    assert.equal(currentURL(), '/organization/edit');
  });
});

I didnā€™t want to move it to Stackoverflow as the context wasnā€™t held. Code snippets were faster to extract than creating the simple appā€”it this is not enough, Iā€™ll try to to that.

First up Iā€™m confused by this comment

Tests open in localhost:4200/tests

Are you running tests or ember serve ? usually 4200 is the ā€œember sā€ (running app w/ express backend) and 7357 is the testem/qunit runner. Did you give my example a test run and if so what was different between your example and mine?

For anyone stumbling over this, check that you have the following in your environment.js, which makes your transitionTos testable:

if (environment === 'test')
{
    ENV.locationType = 'none';
    ...
}

I needed to mock changing window.location today for a test and I found ember-window-mock, v useful!

2 Likes