mirror/webslides
1
0
Fork 0
mirror of https://github.com/webslides/WebSlides.git synced 2025-08-21 12:21:46 +02:00
Code Issues Releases Wiki Activity

Linting

Browse Source
This commit is contained in:
Antonio Laguna
2017-05-29 10:16:40 +02:00
parent 8a9ea037c0
commit c5ee83c940
17 changed files with 147 additions and 255 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
test/plugins/autoslide.test.js
View File

@@ -4,7 +4,8 @@ import AutoSlide from '../../src/js/plugins/autoslide';
jest.useFakeTimers();
beforeAll(() => {
document.body.innerHTML = `<div id="webslides"></div><input id="focusable" />`;
document.body.innerHTML =
`<div id="webslides"></div><input id="focusable" />`;
});
test('AutoSlide plugin', () => {
@@ -20,7 +21,7 @@ test('AutoSlide plugin', () => {
expect(next).not.toBeCalled();
const autoslide = new AutoSlide(webslides);
new AutoSlide(webslides);
DOM.fireEvent(ws, 'ws:init');
// Wait until next execution
@@ -39,5 +40,4 @@ test('AutoSlide plugin', () => {
jest.runTimersToTime(101);
expect(next.mock.calls.length).toBe(2);
});

5
test/plugins/click-nav.test.js
View File

@@ -2,7 +2,8 @@ import DOM from '../../src/js/utils/dom';
import ClickNav from '../../src/js/plugins/click-nav';
beforeAll(() => {
document.body.innerHTML = `<div id="webslides" data-test="test"><p>Text</p></div>`;
document.body.innerHTML =
`<div id="webslides" data-test="test"><p>Text</p></div>`;
});
test('Click nav plugin', () => {
@@ -20,7 +21,7 @@ test('Click nav plugin', () => {
expect(next).not.toBeCalled();
const clicknav = new ClickNav(webslides);
new ClickNav(webslides);
DOM.fireEvent(ws, 'click');
expect(next.mock.calls.length).toBe(1);
});

14
test/plugins/keyboard.test.js
View File

@@ -1,9 +1,9 @@
import DOM from '../../src/js/utils/dom';
import Keyboard from '../../src/js/plugins/keyboard';
import Keys from '../../src/js/utils/keys';
// @TODO: Check to do this with simulant
const simulateKeyEvent = (el, code) => {
const evt = new KeyboardEvent("keydown", {
const evt = new KeyboardEvent('keydown', {
bubbles: true,
cancelableCode: true,
which: code,
@@ -12,7 +12,10 @@ const simulateKeyEvent = (el, code) => {
};
beforeAll(() => {
document.body.innerHTML = `<div id="webslides" data-test="test"><p>Text</p></div><input id="focusable" />`;
document.body.innerHTML = `<div id="webslides" data-test="test">
<p>Text</p>
</div>
<input id="focusable" />`;
});
test('Keyboard plugin', () => {
@@ -20,7 +23,6 @@ test('Keyboard plugin', () => {
const next = jest.fn();
const prev = jest.fn();
const ws = document.getElementById('webslides');
const focusable = document.getElementById('focusable');
let disabled = true;
@@ -29,11 +31,11 @@ test('Keyboard plugin', () => {
goNext: next,
goPrev: prev,
isVertical: false,
isDisabled: () => {return disabled;},
isDisabled: () => disabled,
el: ws
};
const keyboard = new Keyboard(webslides);
new Keyboard(webslides);
expect(goto).not.toBeCalled();
expect(next).not.toBeCalled();

2
test/plugins/navigation.test.js
View File

@@ -31,7 +31,7 @@ test('Navigation plugin', () => {
expect(fakeCounter.childNodes[0].href).toBe('about:blank#');
expect(fakeCounter.childNodes[0].title).toBe('View all slides');
const nav = new Navigation(webslides);
new Navigation(webslides);
const navElem = ws.querySelector('#navigation');
const counter = navElem.querySelector('#counter');

9
test/plugins/scroll.test.js
View File

@@ -18,7 +18,9 @@ beforeAll(() => {
test('Scroll utility', () => {
// Forces mobile detection
window.navigator = {userAgent: 'Android'};
window.navigator = {
userAgent: 'Android'
};
const ws = document.getElementById('webslides');
const next = jest.fn();
const prev = jest.fn();
@@ -26,7 +28,7 @@ test('Scroll utility', () => {
let disabled = true;
const webslides = {
el: ws,
isDisabled: () => {return disabled;},
isDisabled: () => disabled,
isMoving: false,
isVertical: false,
goNext: next,
@@ -38,7 +40,7 @@ test('Scroll utility', () => {
}
};
const scroll = new Scroll(webslides);
new Scroll(webslides);
fireEvent(ws, 'wheel', 300, 200);
expect(next).not.toBeCalled();
@@ -61,5 +63,4 @@ test('Scroll utility', () => {
jest.runTimersToTime(201);
expect(next.mock.calls.length).toBe(1);
expect(prev.mock.calls.length).toBe(1);
});

41
test/plugins/touch.test.js
View File

@@ -1,13 +1,14 @@
import Touch from '../../src/js/plugins/touch';
// Copy of DOM.fireEvent, but using touch offets
const fireEvent = (target, eventType, offsetX, offsetY, touches) => {
const getEvent = (eventType, offsetX, offsetY, touches) => {
const event = new CustomEvent(eventType);
event.offsetX = offsetX;
event.offsetY = offsetY;
event.touches = touches;
target.dispatchEvent(event);
return event;
};
beforeAll(() => {
@@ -17,11 +18,9 @@ beforeAll(() => {
test('Touch utility', () => {
// Overrides userAgent to force mobile detection
const UAProp = Object.getOwnPropertyDescriptor(window.navigator.__proto__, 'userAgent');
Object.getOwnPropertyDescriptor(window.navigator.__proto__, 'userAgent');
Object.defineProperty(window.navigator, 'userAgent', {get: () => 'Android'});
const Touch = require('../../src/js/plugins/touch');
const ws = document.getElementById('webslides');
const next = jest.fn();
const prev = jest.fn();
@@ -30,7 +29,7 @@ test('Touch utility', () => {
let disabled = true;
const webslides = {
el: ws,
isDisabled: () => {return disabled;},
isDisabled: () => disabled,
isMoving: false,
isVertical: false,
goNext: next,
@@ -41,10 +40,10 @@ test('Touch utility', () => {
}
};
const touch = new Touch.default(webslides);
fireEvent(document, 'touchstart', 200, 200, [1]);
fireEvent(document, 'touchmove', 200, 400, [1]);
fireEvent(document, 'touchend', 200, 200, [1]);
const touch = new Touch(webslides);
touch.onStart_(getEvent('touchstart', 200, 200, [1]));
touch.onMove_(getEvent('touchstart', 200, 400, [1]));
touch.onStop_(getEvent('touchstart', 200, 200, [1]));
expect(next).not.toBeCalled();
expect(prev).not.toBeCalled();
@@ -52,28 +51,30 @@ test('Touch utility', () => {
disabled = false;
fireEvent(document, 'touchstart', 800, 200, [1]);
fireEvent(document, 'touchmove', 400, 200, [1]);
fireEvent(document, 'touchend', 400, 200, [1]);
touch.onStart_(getEvent('touchstart', 800, 200, [1]));
touch.onMove_(getEvent('touchstart', 400, 400, [1]));
touch.onStop_(getEvent('touchstart', 400, 200, [1]));
expect(next.mock.calls.length).toBe(1);
expect(prev.mock.calls.length).toBe(0);
expect(zoom.mock.calls.length).toBe(0);
fireEvent(document, 'touchstart', 200, 200, [1]);
fireEvent(document, 'touchmove', 400, 200, [1]);
fireEvent(document, 'touchend', 400, 200, [1]);
touch.onStart_(getEvent('touchstart', 200, 200, [1]));
touch.onMove_(getEvent('touchstart', 400, 200, [1]));
touch.onStop_(getEvent('touchstart', 400, 200, [1]));
expect(next.mock.calls.length).toBe(1);
expect(prev.mock.calls.length).toBe(1);
expect(zoom.mock.calls.length).toBe(0);
fireEvent(document, 'touchstart', 200, 200, [{clientX: 100, clientY: 100}, {clientX: 400, clientY: 400}]);
fireEvent(document, 'touchmove', 400, 200, [{clientX: 200, clientY: 200}, {clientX: 300, clientY: 300}]);
fireEvent(document, 'touchend', 400, 200, [{clientX: 200, clientY: 200}, {clientX: 300, clientY: 300}]);
touch.onStart_(getEvent('touchstart', 200, 200,
[{clientX: 100, clientY: 100}, {clientX: 400, clientY: 400}]));
touch.onMove_(getEvent('touchstart', 400, 200,
[{clientX: 200, clientY: 200}, {clientX: 300, clientY: 300}]));
touch.onStop_(getEvent('touchstart', 400, 200,
[{clientX: 200, clientY: 200}, {clientX: 300, clientY: 300}]));
expect(next.mock.calls.length).toBe(1);
expect(prev.mock.calls.length).toBe(1);
expect(zoom.mock.calls.length).toBe(1);
});

28
test/plugins/video.test.js
View File

@@ -1,52 +1,40 @@
import Video from '../../src/js/plugins/video';
import DOM from '../../src/js/utils/dom';
// Copy of DOM.fireEvent, but using touch offets
const fireEvent = (target, eventType, offsetX, offsetY, touches) => {
const event = new CustomEvent(eventType);
event.offsetX = offsetX;
event.offsetY = offsetY;
event.touches = touches;
target.dispatchEvent(event);
};
beforeAll(() => {
const slides = '12345'.replace(/(\d)/g, '<div id="section-$1" class="slide"><video autoplay="true" /></div>');
const slides = '12345'.replace(/(\d)/g,
'<div id="section-$1" class="slide"><video autoplay="true" /></div>');
document.body.innerHTML = `<div id="webslides">${slides}</div>`;
});
test('Video utility', () => {
const ws = document.getElementById('webslides');
const slides = ws.querySelectorAll('.slide');
const videos = ws.querySelectorAll('video');
const play = jest.fn();
const pause = jest.fn();
videos.forEach( video => {
videos.forEach(video => {
video.play = play;
video.pause = pause;
})
});
const webslides = {
el: ws,
slides: []
};
slides.forEach( slide => webslides.slides.push({el: slide}));
slides.forEach(slide => webslides.slides.push({el: slide}));
expect(ws.querySelectorAll('video[autoplay]').length).toBe(5);
const video = new Video(webslides);
new Video(webslides);
expect(ws.querySelectorAll('video[autoplay]').length).toBe(0);
expect(pause.mock.calls.length).toBe(5);
webslides.slides.forEach( slide => {
webslides.slides.forEach(slide => {
DOM.fireEvent(slide.el, 'slide:enable', {slide: slide});
DOM.fireEvent(slide.el, 'slide:disable', {slide: slide});
})
});
expect(pause.mock.calls.length).toBe(10);
});

50
test/plugins/youtube.test.js
View File

@@ -1,24 +1,16 @@
import YouTube from '../../src/js/plugins/youtube';
import DOM from '../../src/js/utils/dom';
// Copy of DOM.fireEvent, but using touch offets
const fireEvent = (target, eventType, offsetX, offsetY, touches) => {
const event = new CustomEvent(eventType);
event.offsetX = offsetX;
event.offsetY = offsetY;
event.touches = touches;
target.dispatchEvent(event);
};
beforeAll(() => {
const video = '<div id="section-1" class="slide"><div class="embed"><div data-youtube="video" data-youtube-id="CQY3KUR3VzM" data-autoplay data-loop></div></div></div>';
document.body.innerHTML = `<script></script><div id="webslides">${video}</div>`;
const video = '<div id="section-1" class="slide"><div class="embed">' +
'<div data-youtube="video" ' +
' data-youtube-id="CQY3KUR3VzM" ' +
' data-autoplay data-loop></div></div></div>';
document.body.innerHTML =
`<script></script><div id="webslides">${video}</div>`;
});
test('YouTube utility', () => {
const ws = document.getElementById('webslides');
const slides = ws.querySelectorAll('.slide');
const play = jest.fn();
@@ -30,23 +22,32 @@ test('YouTube utility', () => {
el: ws,
slides: []
};
slides.forEach( slide => webslides.slides.push({el: slide}));
slides.forEach(slide => webslides.slides.push({el: slide}));
window.YT = {
Player: function(a, b) {
return { getIframe: () => {
const div = DOM.createNode('div');
div.innerHTML = '<iframe id="widget8" src="https://www.youtube.com/embed/_m67JbGjWnc" title="YouTube video player" allowfullscreen="1" data-youtube-id="_m67JbGjWnc" frameborder="0" height="360" width="640"></iframe>';
webslides.slides[0].el.appendChild(div);
return div.querySelector('iframe');
} }
return {
getIframe: () => {
const div = DOM.createNode('div');
div.innerHTML =
`<iframe id="widget8"
src="https://www.youtube.com/embed/_m67JbGjWnc"
data-youtube-id="_m67JbGjWnc"
frameborder="0" height="360" width="640"></iframe>`;
webslides.slides[0].el.appendChild(div);
return div.querySelector('iframe');
}
};
}
}
};
const youtube = new YouTube(webslides);
new YouTube(webslides);
expect(typeof window.onYouTubeIframeAPIReady).toBe('function');
webslides.el.querySelector('[data-youtube]').dataset = {autoplay: true, youtubeId: 'CQY3KUR3VzM'};
webslides.el.querySelector('[data-youtube]').dataset = {
autoplay: true,
youtubeId: 'CQY3KUR3VzM'
};
window.onYouTubeIframeAPIReady();
@@ -85,5 +86,4 @@ test('YouTube utility', () => {
expect(pause.mock.calls.length).toBe(1);
expect(destroy.mock.calls.length).toBe(1);
expect(create.mock.calls.length).toBe(1);
});

11
test/plugins/zoom.test.js
View File

@@ -5,7 +5,7 @@ jest.useFakeTimers();
// Copy of DOM.fireEvent, but using keydown
const simulateKeyEvent = (el, code) => {
const evt = new KeyboardEvent("keydown", {
const evt = new KeyboardEvent('keydown', {
bubbles: true,
cancelableCode: true,
which: code,
@@ -14,12 +14,12 @@ const simulateKeyEvent = (el, code) => {
};
beforeAll(() => {
const slides = '12345'.replace(/(\d)/g, '<div id="section-$1" class="slide"><div>Slide $1</div></div>');
const slides = '12345'.replace(/(\d)/g,
'<div id="section-$1" class="slide"><div>Slide $1</div></div>');
document.body.innerHTML = `<div id="webslides">${slides}</div>`;
});
test('Zoom utility', () => {
const ws = document.getElementById('webslides');
const slides = ws.querySelectorAll('.slide');
const goto = jest.fn();
@@ -33,9 +33,9 @@ test('Zoom utility', () => {
enable: enable,
disable: disable
};
slides.forEach( slide => webslides.slides.push({el: slide}));
slides.forEach(slide => webslides.slides.push({el: slide}));
const zoom = new Zoom(webslides);
new Zoom(webslides);
const zws = document.querySelector('#webslides-zoomed');
const zoomSlides = zws.querySelectorAll('.slide');
@@ -62,5 +62,4 @@ test('Zoom utility', () => {
expect(disable.mock.calls.length).toBe(1);
expect(enable.mock.calls.length).toBe(1);
expect(goto.mock.calls.length).toBe(1);
});