diff options
author | Tim Zallmann <tzallmann@gitlab.com> | 2017-07-24 20:36:52 +0300 |
---|---|---|
committer | Jacob Schatz <jschatz@gitlab.com> | 2017-07-24 20:36:52 +0300 |
commit | 52b8a0db689c2df968776a1f369ea6a6db245d39 (patch) | |
tree | 4955f45d5d19c1d32aee8bc496041acdd74763cb /spec/javascripts/lazy_loader_spec.js | |
parent | 3a26bce80eb739ca3f552dfe71e39b9a177eb36e (diff) |
Resolve "Lazy load images on the Frontend"
Diffstat (limited to 'spec/javascripts/lazy_loader_spec.js')
-rw-r--r-- | spec/javascripts/lazy_loader_spec.js | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/spec/javascripts/lazy_loader_spec.js b/spec/javascripts/lazy_loader_spec.js new file mode 100644 index 00000000000..1d81e4e2d1a --- /dev/null +++ b/spec/javascripts/lazy_loader_spec.js @@ -0,0 +1,57 @@ +import LazyLoader from '~/lazy_loader'; + +let lazyLoader = null; + +describe('LazyLoader', function () { + preloadFixtures('issues/issue_with_comment.html.raw'); + + beforeEach(function () { + loadFixtures('issues/issue_with_comment.html.raw'); + lazyLoader = new LazyLoader({ + observerNode: 'body', + }); + // Doing everything that happens normally in onload + lazyLoader.loadCheck(); + }); + describe('behavior', function () { + it('should copy value from data-src to src for img 1', function (done) { + const img = document.querySelectorAll('img[data-src]')[0]; + const originalDataSrc = img.getAttribute('data-src'); + img.scrollIntoView(); + + setTimeout(() => { + expect(img.getAttribute('src')).toBe(originalDataSrc); + expect(document.getElementsByClassName('js-lazy-loaded').length).toBeGreaterThan(0); + done(); + }, 100); + }); + + it('should lazy load dynamically added data-src images', function (done) { + const newImg = document.createElement('img'); + const testPath = '/img/testimg.png'; + newImg.className = 'lazy'; + newImg.setAttribute('data-src', testPath); + document.body.appendChild(newImg); + newImg.scrollIntoView(); + + setTimeout(() => { + expect(newImg.getAttribute('src')).toBe(testPath); + expect(document.getElementsByClassName('js-lazy-loaded').length).toBeGreaterThan(0); + done(); + }, 100); + }); + + it('should not alter normal images', function (done) { + const newImg = document.createElement('img'); + const testPath = '/img/testimg.png'; + newImg.setAttribute('src', testPath); + document.body.appendChild(newImg); + newImg.scrollIntoView(); + + setTimeout(() => { + expect(newImg).not.toHaveClass('js-lazy-loaded'); + done(); + }, 100); + }); + }); +}); |