Skip to content

Commit dc77c52

Browse files
committed
Updated tests
1 parent 42605e4 commit dc77c52

1 file changed

Lines changed: 32 additions & 20 deletions

File tree

test/browser.js

Lines changed: 32 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -25,18 +25,11 @@ test.beforeEach(t => {
2525
global.window = dom.window;
2626
})
2727

28-
const createDomNode = (vendor, src, title, thumbnail) => {
28+
const createDomNode = (params = {}) => {
2929
const node = document.createElement('div');
3030
node.classList.add('lazyframe');
31-
node.setAttribute('data-src', src)
32-
if (vendor) {
33-
node.setAttribute('data-vendor', vendor)
34-
}
35-
if (title) {
36-
node.setAttribute('data-title', title);
37-
}
38-
if (thumbnail) {
39-
node.setAttribute('data-thumbnail', thumbnail);
31+
for (const [ key, value ] of Object.entries(params)) {
32+
node.setAttribute(`data-${key}`, value)
4033
}
4134
document.body.appendChild(node);
4235
return node;
@@ -47,34 +40,38 @@ test('should expose lazyframe()', (t) => {
4740
});
4841

4942
test('should initialize one node with a string selector', (t) => {
50-
createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0')
43+
createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
5144
window.lazyframe('.lazyframe');
5245
t.is(document.querySelectorAll('.lazyframe--loaded').length, 1);
5346
})
5447

5548
test('should initialize mulitple nodes with a string selector', (t) => {
56-
createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0')
57-
createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDC/?rel=0')
49+
createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
50+
createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
51+
5852
window.lazyframe('.lazyframe');
5953
t.is(document.querySelectorAll('.lazyframe--loaded').length, 2);
6054
})
6155

6256
test('should initialize with a single node', (t) => {
63-
const node = createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0')
57+
const node = createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
58+
6459
window.lazyframe(node);
6560
t.is(document.querySelectorAll('.lazyframe--loaded').length, 1);
6661
})
6762

6863
test('should initialize with a nodelist', (t) => {
69-
createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0')
70-
createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDC/?rel=0')
64+
createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0' });
65+
createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDC/?rel=0' });
66+
7167
const nodes = document.querySelectorAll('.lazyframe')
7268
window.lazyframe(nodes);
7369
t.is(document.querySelectorAll('.lazyframe--loaded').length, 2);
7470
})
7571

7672
test('should append an iframe on click', (t) => {
77-
const node = createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0')
73+
const node = createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
74+
7875
window.lazyframe('.lazyframe');
7976
node.click();
8077

@@ -83,8 +80,9 @@ test('should append an iframe on click', (t) => {
8380

8481
test('should call onAppend callback function', (t) => {
8582
let i = 0;
86-
const node1 = createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0')
87-
const node2 = createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0')
83+
const node1 = createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
84+
const node2 = createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0' });
85+
8886
window.lazyframe('.lazyframe', {
8987
onAppend() {
9088
i++;
@@ -98,10 +96,24 @@ test('should call onAppend callback function', (t) => {
9896

9997
test('should use data-title', (t) => {
10098
const title = 'custom title'
101-
const node = createDomNode('youtube', 'http://www.youtube.com/embed/iwGFalTRHDB/?rel=0', title)
99+
const node = createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?rel=0', title });
102100

103101
window.lazyframe('.lazyframe');
104102

105103
node.click()
106104
t.is(document.querySelector('.lazyframe__title').textContent, title)
105+
})
106+
107+
test('should append optional query params from data-src', (t) => {
108+
const query = 'rel=0&p=1'
109+
const node = createDomNode({ vendor: 'youtube', src: 'http://www.youtube.com/embed/iwGFalTRHDA/?' + query });
110+
111+
window.lazyframe('.lazyframe');
112+
113+
node.click()
114+
const iframe = node.querySelector('iframe');
115+
const src = iframe.getAttribute('src');
116+
const [,iframQuery] = src.split('?autoplay=1&')
117+
118+
t.is(iframQuery, query);
107119
})

0 commit comments

Comments
 (0)