diff --git a/test/unit/specs/affix.spec.js b/test/unit/specs/affix.spec.js
new file mode 100644
index 00000000..55344ae1
--- /dev/null
+++ b/test/unit/specs/affix.spec.js
@@ -0,0 +1,137 @@
+import { createVue, destroyVM } from '../util';
+
+describe('Affix.vue', () => {
+ let vm;
+ afterEach(() => {
+ destroyVM(vm);
+ });
+
+ it('should create a Affix component without slot', done => {
+ vm = createVue('');
+ const affix = vm.$el.children[0];
+
+ expect(affix.tagName).to.equal('DIV');
+ expect(affix.className).to.equal('');
+ done();
+ });
+
+ it('should create a Affix component contain slot', done => {
+ vm = createVue(`
+
+ Fixed at the top
+
+ `);
+ const slot = vm.$el.children[0].children[0];
+
+ expect(slot.tagName).to.equal('SPAN');
+ expect(slot.className).to.equal('demo-affix');
+ done();
+ });
+
+ it('only set offset-top props', done => {
+ vm = createVue(`
+
+
+ Fixed at the top
+
+
+
+ `, true);
+ const affix = vm.$el.children[0].children[0];
+ const fakeBlock = vm.$el.children[0].children[1];
+
+ expect(affix.classList.contains('ivu-affix')).to.false;
+ expect(affix.style.top).to.equal('');
+ expect(fakeBlock.style.display).to.equal('none');
+ window.scrollTo(0, 10000);
+ setTimeout(()=>{
+ expect(affix.classList.contains('ivu-affix')).to.true;
+ expect(affix.style.top).to.equal('20px');
+ expect(fakeBlock.style.display).to.equal('');
+ done();
+ }, 100);
+ });
+
+ it('only set offset-bottom props', done => {
+ vm = createVue(`
+
+
+
+ Fixed at the top
+
+
+
+ `, true);
+ const affix = vm.$el.children[1].children[0];
+
+ expect(affix.classList.contains('ivu-affix')).to.false;
+ expect(affix.style.bottom).to.equal('');
+ // Affix component haven't run handleScroll function when component mounted in real dom.
+ // use scrollTo() to trigger scroll event.
+ window.scrollTo(0, 100);
+ setTimeout(()=>{
+ expect(affix.classList.contains('ivu-affix')).to.true;
+ expect(affix.style.bottom).to.equal('20px');
+ window.scrollTo(0, 10000);
+ setTimeout(()=>{
+ expect(affix.classList.contains('ivu-affix')).to.false;
+ expect(affix.style.bottom).to.equal('');
+ done();
+ }, 100);
+ }, 100);
+ });
+
+ it('both props are set, only offset-bottom is valid', done => {
+ vm = createVue(`
+
+
+
+ Fixed at the top
+
+
+
+ `, true);
+ const affix = vm.$el.children[1].children[0];
+
+ expect(affix.classList.contains('ivu-affix')).to.false;
+ expect(affix.style.bottom).to.equal('');
+ // Affix component haven't run handleScroll function when component mounted in real dom.
+ // use scrollTo() to trigger scroll event.
+ window.scrollTo(0, 100);
+ setTimeout(()=>{
+ expect(affix.classList.contains('ivu-affix')).to.true;
+ expect(affix.style.bottom).to.equal('20px');
+ window.scrollTo(0, 10000);
+ setTimeout(()=>{
+ expect(affix.classList.contains('ivu-affix')).to.false;
+ expect(affix.style.bottom).to.equal('');
+ done();
+ }, 100);
+ }, 100);
+ });
+
+ it('both props are not set, should fixed top and top equal 0px', done => {
+ vm = createVue(`
+
+
+ Fixed at the top
+
+
+
+ `, true);
+ const affix = vm.$el.children[0].children[0];
+ const fakeBlock = vm.$el.children[0].children[1];
+
+ expect(affix.classList.contains('ivu-affix')).to.false;
+ expect(affix.style.top).to.equal('');
+ expect(fakeBlock.style.display).to.equal('none');
+ window.scrollTo(0, 10000);
+ setTimeout(()=>{
+ expect(affix.classList.contains('ivu-affix')).to.true;
+ expect(affix.style.top).to.equal('0px');
+ expect(fakeBlock.style.display).to.equal('');
+ done();
+ }, 100);
+ });
+
+});
\ No newline at end of file