diff --git a/tests/acceptance/scroll-operator-test.js b/tests/acceptance/scroll-operator-test.js new file mode 100644 index 0000000..fe28ac5 --- /dev/null +++ b/tests/acceptance/scroll-operator-test.js @@ -0,0 +1,102 @@ +import Ember from 'ember'; +import { test } from 'qunit'; +import moduleForAcceptance from '../../tests/helpers/module-for-acceptance'; + +moduleForAcceptance('Acceptance | scroll operator'); + +/** + * This test is seemingly impossible right now. Unable to successfully emulate + * hitting the browser back/forward button due to acceptance tests using + * locationType 'none'. Setting to 'hash' does not seem to help. Need to + * revisit. + * + * test('scroll operator works', function(assert) { + * // Configure location type to simulate browser back button + * this.application.Router.reopen({ + * location: 'hash', + * }); + + * const viewportHeight = Ember.$(window).height(); + * const testScrollTop = viewportHeight + 5; + * + * visit('/').then(() => { + * // Modify page to have scrollable content + * const tallDiv = Ember.$('
').css({ height: viewportHeight * 2 }); + * Ember.$(document.body).append(tallDiv); + + * // scroll to a position + * Ember.$(window).scrollTop(testScrollTop); + * }); + + * + * // navigate away from page and change scrollTop + * visit('/route-a').then(() => { + * Ember.$(window).scrollTop(0); + * }); + * + * // use browser's native back functionality to navigate to previous route + * //window.history.back(); + * visit('/'); + * + * // assert that previous position is preserved + * andThen(function() { + * assert.equal(currentURL(), '/'); + * assert.equal(Ember.$(window).scrollTop(), testScrollTop); + * }); + * }); + **/ + +test('scroll operator does not resume scroll for non-browser triggered transitions', function(assert) { + // get viewport height + const viewportHeight = Ember.$(window).height(); + + // create arbitrary scrollTo value + const testScrollTop = viewportHeight + 5; + + visit('/').then(() => { + // create and append div of 'tall' height + const tallDiv = Ember.$('').css({ height: viewportHeight * 2 }); + Ember.$(document.body).append(tallDiv); + + // scroll to a position + Ember.$(window).scrollTop(testScrollTop); + }); + + // navigate away from page and ensure scroll + visit('/route-a').then(() => { + Ember.$(window).scrollTop(testScrollTop); + }); + + // visit index via app + visit('/'); + + // assert that previous position is reset (equal to 0) + andThen(function() { + assert.equal(currentURL(), '/'); + assert.equal(Ember.$(window).scrollTop(), 0); + }); +}); + +test('reset scroll will reset scroll position to 0', function(assert) { + visit('/').then(() => { + // get viewport height + const viewportHeight = Ember.$(window).height(); + + // create arbitrary scrollTo value + const testScrollTop = viewportHeight + 5; + + // create and append div of 'tall' height + const tallDiv = Ember.$('').css({ height: viewportHeight * 2 }); + Ember.$(document.body).append(tallDiv); + + // scroll to a position + Ember.$(window).scrollTop(testScrollTop); + }); + + visit('/reset-route'); + + andThen(function() { + assert.equal(currentURL(), '/reset-route'); + assert.equal(Ember.$(window).scrollTop(), 0); + }); +}); diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js index 3bba78e..936b281 100644 --- a/tests/dummy/app/router.js +++ b/tests/dummy/app/router.js @@ -6,6 +6,8 @@ const Router = Ember.Router.extend({ }); Router.map(function() { + this.route('route-a'); + this.route('reset-route'); }); export default Router; diff --git a/tests/dummy/app/routes/index.js b/tests/dummy/app/routes/index.js new file mode 100644 index 0000000..7802efb --- /dev/null +++ b/tests/dummy/app/routes/index.js @@ -0,0 +1,4 @@ +import Ember from 'ember'; +import ScrollOperatorMixin from 'ember-scroll-operator/mixins/scroll-operator'; + +export default Ember.Route.extend(ScrollOperatorMixin); diff --git a/tests/dummy/app/routes/reset-route.js b/tests/dummy/app/routes/reset-route.js new file mode 100644 index 0000000..300cedb --- /dev/null +++ b/tests/dummy/app/routes/reset-route.js @@ -0,0 +1,4 @@ +import Ember from 'ember'; +import ResetScrollMixin from 'ember-scroll-operator/mixins/reset-scroll'; + +export default Ember.Route.extend(ResetScrollMixin); diff --git a/tests/dummy/app/routes/route-a.js b/tests/dummy/app/routes/route-a.js new file mode 100644 index 0000000..dd457cb --- /dev/null +++ b/tests/dummy/app/routes/route-a.js @@ -0,0 +1,3 @@ +import Ember from 'ember'; + +export default Ember.Route.extend(); diff --git a/tests/dummy/app/templates/index.hbs b/tests/dummy/app/templates/index.hbs new file mode 100644 index 0000000..e69de29 diff --git a/tests/dummy/app/templates/reset-route.hbs b/tests/dummy/app/templates/reset-route.hbs new file mode 100644 index 0000000..e69de29 diff --git a/tests/dummy/config/environment.js b/tests/dummy/config/environment.js index c59bcd5..07db5ce 100644 --- a/tests/dummy/config/environment.js +++ b/tests/dummy/config/environment.js @@ -5,7 +5,7 @@ module.exports = function(environment) { modulePrefix: 'dummy', environment: environment, baseURL: '/', - locationType: 'auto', + locationType: 'hash', EmberENV: { FEATURES: { // Here you can enable experimental features on an ember canary build