Skip to content

Commit

Permalink
solved ie issue
Browse files Browse the repository at this point in the history
  • Loading branch information
@fisshy
fisshy committed Dec 5, 2017
1 parent 0811a56 commit 8aa2c8d
Show file tree
Hide file tree
Showing 6 changed files with 58 additions and 55 deletions.
2 changes: 1 addition & 1 deletion karma.conf.js
View file
Expand Up @@ -4,7 +4,7 @@ module.exports = function (config) {

config.set({

browsers: [ 'Chrome', 'Firefox' ],
browsers: [ 'Chrome', 'Firefox'],
frameworks: [ 'mocha' ],
reporters: [ 'mocha' ],

Expand Down
18 changes: 9 additions & 9 deletions modules/__tests__/animate-scroll-test.js
View file
Expand Up @@ -68,7 +68,7 @@ describe('AnimateScroll', () => {
animateScroll.scrollTo(120, { duration: duration });

setTimeout(() => {
expect(window.scrollY).toEqual(120);
expect(window.scrollY || window.pageYOffset).toEqual(120);
done();
}, waitDuration);
});
Expand All @@ -95,7 +95,7 @@ describe('AnimateScroll', () => {
animateScroll.scrollTo(200, { duration: duration });

setTimeout(() => {
expect(window.scrollY).toEqual(200);
expect(window.scrollY || window.pageYOffset).toEqual(200);

done();
}, waitDuration);
Expand All @@ -109,7 +109,7 @@ describe('AnimateScroll', () => {
animateScroll.scrollToTop({ duration: duration });

setTimeout(() => {
expect(window.scrollY).toEqual(0);
expect(window.scrollY || window.pageYOffset).toEqual(0);
done();
}, waitDuration);
});
Expand All @@ -121,7 +121,7 @@ describe('AnimateScroll', () => {

setTimeout(() => {
var offset = 16;
expect(window.scrollY).toEqual(node.offsetHeight - window.innerHeight + offset);
expect(window.scrollY || window.pageYOffset).toEqual(node.offsetHeight - window.innerHeight + offset);
done();
}, waitDuration);
});
Expand All @@ -134,13 +134,13 @@ describe('AnimateScroll', () => {
animateScroll.scrollMore(10, { duration: duration });

setTimeout(() => {
expect(window.scrollY).toEqual(121);
expect(window.scrollY || window.pageYOffset).toEqual(121);

animateScroll.scrollMore(10, { duration: duration });

// do it again!
setTimeout(() => {
expect(window.scrollY).toEqual(131);
expect(window.scrollY || window.pageYOffset).toEqual(131);

done();
}, waitDuration);
Expand All @@ -154,7 +154,7 @@ describe('AnimateScroll', () => {
animateScroll.scrollTo(120, { duration: 0 });

setTimeout(() => {
expect(window.scrollY).toEqual(120);
expect(window.scrollY || window.pageYOffset).toEqual(120);
done();
}, 100);
});
Expand All @@ -163,10 +163,10 @@ describe('AnimateScroll', () => {
it('can take a function as a duration argument', (done) => {
render(tallComponent, node, () => {
animateScroll.scrollTo(120, { duration: (v) => v });
expect(window.scrollY).toEqual(0);
expect(window.scrollY || window.pageYOffset).toEqual(0);

setTimeout(() => {
expect(window.scrollY).toEqual(120);
expect(window.scrollY || window.pageYOffset).toEqual(120);
done();
}, 150);
});
Expand Down
42 changes: 20 additions & 22 deletions modules/__tests__/page-test.js
View file
Expand Up @@ -11,10 +11,8 @@ import expect from 'expect';
import assert from 'assert';
import sinon from 'sinon';

const wait = (ms) => {
return new Promise((res, rej) => {
setTimeout(res, ms);
})
const wait = (ms, cb) => {
setTimeout(cb, ms);
}

describe('Page', () => {
Expand Down Expand Up @@ -73,7 +71,7 @@ describe('Page', () => {
})

it('it is at top in start', (done) => {
expect(window.scrollY).toEqual(0);
expect(window.scrollY || window.pageYOffset).toEqual(0);
done();
});

Expand All @@ -89,15 +87,15 @@ describe('Page', () => {

Rtu.Simulate.click(link);

var scrollStart = window.scrollY;
var scrollStart = window.scrollY || window.pageYOffset;

/* Let it scroll, duration is based on param sent to Link */

setTimeout(() => {

var scrollStop = Math.round(scrollStart + expectedScrollTo)

expect(window.scrollY).toEqual(scrollStop);
expect(window.scrollY || window.pageYOffset).toEqual(scrollStop);

expect(link.className).toEqual('active');

Expand All @@ -122,13 +120,13 @@ describe('Page', () => {
Rtu.Simulate.click(link);

/* Let it scroll, duration is based on param sent to Link */
var scrollStart = window.scrollY;
var scrollStart = window.scrollY || window.pageYOffset;

setTimeout(() => {

var scrollStop = Math.round(scrollStart + expectedScrollTo)

expect(window.scrollY).toEqual(scrollStop);
expect(window.scrollY || window.pageYOffset).toEqual(scrollStop);

expect(link.className).toEqual('active');

Expand All @@ -140,7 +138,7 @@ describe('Page', () => {

})

it('should call onSetActive', async () => {
it('should call onSetActive', (done) => {

let onSetActive = sinon.spy();
let onSetInactive = sinon.spy();
Expand Down Expand Up @@ -169,17 +167,17 @@ describe('Page', () => {

Rtu.Simulate.click(link);

await wait(scrollDuration + 500);

expect(onSetActive.calledOnce).toEqual(true);

link = node.querySelectorAll('a')[4];

Rtu.Simulate.click(link);

await wait(scrollDuration + 500);

expect(onSetInactive.calledOnce).toEqual(true);
wait(scrollDuration + 500, () => {
expect(onSetActive.calledOnce).toEqual(true);

link = node.querySelectorAll('a')[4];

Rtu.Simulate.click(link);

wait(scrollDuration + 500, () => {
expect(onSetInactive.calledOnce).toEqual(true);
done();
})
})
});

});
47 changes: 26 additions & 21 deletions modules/__tests__/scroll-cancellation-test.js
View file
@@ -1,9 +1,9 @@
/* React */
import { render, unmountComponentAtNode, findDOMNode } from 'react-dom'
import Rtu from 'react-dom/test-utils'
import React from 'react'
import expect from 'expect'
import assert from 'assert';
import Rtu from 'react-dom/test-utils'
import React from 'react'
import expect from 'expect'
import assert from 'assert';
import scroll from '../mixins/animate-scroll.js';

describe('Scroll cancelation', () => {
Expand All @@ -14,49 +14,54 @@ describe('Scroll cancelation', () => {

beforeEach(function () {
unmountComponentAtNode(node);
window.scrollTo(0,0);
window.scrollTo(0, 0);
});

describe("when scrolling is triggered by keydown handlers", () => {
it("can scroll on keydown multiple times in a row", async () => {
it("can scroll on keydown multiple times in a row", (done) => {
const duration = 100;
const distance = 100;

class TestComponent extends React.Component {
handleKeyDown = () => {
scroll.scrollMore(distance, { smooth: true, duration });
}
render () {
render() {
return (
<div>
<input onKeyDown={this.handleKeyDown} />
<div style={{height: "3000px", width: "100%", background: "repeating-linear-gradient(to bottom, white, black 100px)"}}/>
<div style={{ height: "3000px", width: "100%", background: "repeating-linear-gradient(to bottom, white, black 100px)" }} />
</div>
);
}
}

render(<TestComponent/>, node);
render(<TestComponent />, node);

dispatchDOMKeydownEvent(13, node.querySelector('input'));
await wait(duration*2);
expect(window.scrollY).toBeGreaterThanOrEqualTo(distance);
wait(duration * 2, () => {
expect(window.scrollY || window.pageYOffset).toBeGreaterThanOrEqualTo(distance);

dispatchDOMKeydownEvent(13, node.querySelector('input'));
await wait(duration*2);
expect(window.scrollY).toBeGreaterThanOrEqualTo(distance * 2);
dispatchDOMKeydownEvent(13, node.querySelector('input'));
wait(duration * 2, () => {
expect(window.scrollY || window.pageYOffset).toBeGreaterThanOrEqualTo(distance * 2);

dispatchDOMKeydownEvent(13, node.querySelector('input'));
wait(duration * 2, () => {
expect(window.scrollY || window.pageYOffset).toBeGreaterThanOrEqualTo(distance * 3);
done();
});

})

})

dispatchDOMKeydownEvent(13, node.querySelector('input'));
await wait(duration*2);
expect(window.scrollY).toBeGreaterThanOrEqualTo(distance * 3);
});
});
});

const wait = (ms) => {
return new Promise((res, rej) => {
setTimeout(res, ms);
})
const wait = (ms, cb) => {
setTimeout(cb, ms);
}

const dispatchDOMKeydownEvent = (keyCode, element) => {
Expand Down
2 changes: 1 addition & 1 deletion modules/mixins/utils.js
View file
Expand Up @@ -23,7 +23,7 @@ const getHash = () => {
const filterElementInContainer = (container) => (element) => container.contains ? container != element && container.contains(element) : !!(container.compareDocumentPosition(element) & 16)

const scrollOffset = (c, t) => c === document ?
t.getBoundingClientRect().top + window.scrollY : getComputedStyle(c).position === "relative" ? t.offsetTop : (t.offsetTop - c.offsetTop)
t.getBoundingClientRect().top + (window.scrollY || window.pageYOffset) : getComputedStyle(c).position === "relative" ? t.offsetTop : (t.offsetTop - c.offsetTop)

export default {
pushHash,
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
@@ -1,6 +1,6 @@
{
"name": "react-scroll",
"version": "1.7.2",
"version": "1.7.3",
"description": "A scroll component for React.js",
"main": "modules",
"repository": {
Expand Down

0 comments on commit 8aa2c8d

Please sign in to comment.