Skip to content

Commit

Permalink
Port ignoreScrollBehavior from remix-run#388 to the new API
Browse files Browse the repository at this point in the history
  • Loading branch information
gaearon committed Nov 26, 2014
1 parent f05e49d commit 0dce2e9
Show file tree
Hide file tree
Showing 4 changed files with 112 additions and 112 deletions.
84 changes: 84 additions & 0 deletions modules/__tests__/Router-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -346,6 +346,90 @@ describe('Router.run', function () {
});
});

describe('ignoreScrollBehavior', function () {
var routes = (
<Route handler={Nested}>
<Route handler={Foo} ignoreScrollBehavior>
<Route handler={Foo} path='/feed' />
<Route handler={Foo} path='/discover' />
</Route>
<Route path='/search' handler={Foo} ignoreScrollBehavior />
<Route path='/about' handler={Foo} />
</Route>
);

var div, didUpdateScroll;
beforeEach(function (done) {
TestLocation.history = [ '/feed' ];

div = document.createElement('div');
document.body.appendChild(div);

var MockScrollBehavior = {
updateScrollPosition() {
didUpdateScroll = true;
}
};

Router.create({
routes: routes,
location: TestLocation,
scrollBehavior: MockScrollBehavior
}).run(function (Handler) {
React.render(<Handler/>, div, function () {
done();
});
});
});

afterEach(function () {
div.parentNode.removeChild(div);
didUpdateScroll = false;
});

it('calls updateScroll the first time', function () {
expect(didUpdateScroll).toBe(true);
});

describe('decides whether to update scroll on transition', function () {
beforeEach(function () {
didUpdateScroll = false;
});

afterEach(function () {
TestLocation.pop();
});

it('calls updateScroll when no ancestors ignore scroll', function () {
TestLocation.push('/about');
expect(didUpdateScroll).toBe(true);
});

it('calls updateScroll when no ancestors ignore scroll although source and target do', function () {
TestLocation.push('/search');
expect(didUpdateScroll).toBe(true);
});

it('calls updateScroll when source is same as target and does not ignore scroll', function () {
TestLocation.push('/about?page=2');
expect(didUpdateScroll).toBe(true);
});

it('does not call updateScroll when common ancestor ignores scroll', function () {
TestLocation.push('/discover');
expect(didUpdateScroll).toBe(false);
});

it('does not call updateScroll when source is same as target and ignores scroll', function () {
TestLocation.push('/search');
didUpdateScroll = false;

TestLocation.push('/search?q=test');
expect(didUpdateScroll).toBe(false);
});
});
});

describe('makePath', function () {
var router;
beforeEach(function () {
Expand Down
109 changes: 0 additions & 109 deletions modules/components/__tests__/Routes-test.js

This file was deleted.

27 changes: 24 additions & 3 deletions modules/mixins/Scrolling.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,23 @@ var invariant = require('react/lib/invariant');
var canUseDOM = require('react/lib/ExecutionEnvironment').canUseDOM;
var getWindowScrollPosition = require('../utils/getWindowScrollPosition');

function shouldUpdateScroll(state, prevState) {
if (!prevState) {
return true;
}

var routes = state.routes;
var prevRoutes = prevState.routes;

var sharedAncestorRoutes = routes.filter(function (route) {
return prevRoutes.indexOf(route) !== -1;
});

return !sharedAncestorRoutes.some(function (route) {
return route.ignoreScrollBehavior;
});
}

/**
* Provides the router with the ability to manage window scroll position
* according to its scroll behavior.
Expand All @@ -25,8 +42,8 @@ var Scrolling = {
this._scrollHistory[this.state.path] = getWindowScrollPosition();
},

componentDidUpdate: function () {
this._updateScroll();
componentDidUpdate: function (prevProps, prevState) {
this._updateScroll(prevState);
},

componentWillUnmount: function () {
Expand All @@ -40,7 +57,11 @@ var Scrolling = {
return this._scrollHistory[path] || null;
},

_updateScroll: function () {
_updateScroll: function (prevState) {
if (!shouldUpdateScroll(this.state, prevState)) {
return;
}

var scrollBehavior = this.getScrollBehavior();

if (scrollBehavior)
Expand Down
4 changes: 4 additions & 0 deletions modules/utils/createRoutesFromChildren.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,10 @@ function createRoute(element, parentRoute, namedRoutes) {

var route = { name: props.name };

if (props.ignoreScrollBehavior) {
route.ignoreScrollBehavior = true;
}

if (type === Redirect.type) {
route.handler = createRedirectHandler(props.to, props.params, props.query);
props.path = props.path || props.from || '*';
Expand Down

0 comments on commit 0dce2e9

Please sign in to comment.