diff --git a/index.js b/index.js index 36c0064..7891bc2 100644 --- a/index.js +++ b/index.js @@ -80,16 +80,17 @@ async function captureResponsiveDOM(driver, options) { lastWindowWidth = width; } + if (process.env.PERCY_RESPONSIVE_CAPTURE_RELOAD_PAGE) { + await driver.navigate().refresh(); + await driver.executeScript(await utils.fetchPercyDOM()); + } + if (process.env.RESPONSIVE_CAPTURE_SLEEP_TIME) { await new Promise(resolve => setTimeout(resolve, parseInt(process.env.RESPONSIVE_CAPTURE_SLEEP_TIME) * 1000)); } if (process.env.PERCY_ENABLE_LAZY_LOADING_SCROLL) { - let scrollSleep = SCROLL_DEFAULT_SLEEP_TIME; - if (process.env.PERCY_LAZY_LOAD_SCROLL_TIME) { - scrollSleep = parseFloat(process.env.PERCY_LAZY_LOAD_SCROLL_TIME); - } - await module.exports.slowScrollToBottom(driver, scrollSleep); + await module.exports.slowScrollToBottom(driver); } let domSnapshot = await captureSerializedDOM(driver, options); @@ -267,8 +268,13 @@ module.exports.isPercyEnabled = async function isPercyEnabled() { return await utils.isPercyEnabled(); }; -module.exports.slowScrollToBottom = async (driver, timeInSeconds = SCROLL_DEFAULT_SLEEP_TIME) => { - let scrollHeight = Math.min(await driver.executeScript('return document.documentElement.scrollHeight'), CS_MAX_SCREENSHOT_LIMIT); +module.exports.slowScrollToBottom = async (driver, scrollSleep = SCROLL_DEFAULT_SLEEP_TIME) => { + if (process.env.PERCY_LAZY_LOAD_SCROLL_TIME) { + scrollSleep = parseFloat(process.env.PERCY_LAZY_LOAD_SCROLL_TIME); + } + + const scrollHeightCommand = 'return Math.max(document.body.scrollHeight, document.body.clientHeight, document.body.offsetHeight, document.documentElement.scrollHeight, document.documentElement.clientHeight, document.documentElement.offsetHeight);'; + let scrollHeight = Math.min(await driver.executeScript(scrollHeightCommand), CS_MAX_SCREENSHOT_LIMIT); const clientHeight = await driver.executeScript('return document.documentElement.clientHeight'); let current = 0; @@ -278,10 +284,10 @@ module.exports.slowScrollToBottom = async (driver, timeInSeconds = SCROLL_DEFAUL current = clientHeight * page; page += 1; await driver.executeScript(`window.scrollTo(0, ${current})`); - await new Promise(resolve => setTimeout(resolve, timeInSeconds * 1000)); + await new Promise(resolve => setTimeout(resolve, scrollSleep * 1000)); // Recalculate scroll height for dynamically loaded pages - scrollHeight = await driver.executeScript('return document.documentElement.scrollHeight'); + scrollHeight = await driver.executeScript(scrollHeightCommand); } // Get back to top await driver.executeScript('window.scrollTo(0, 0)'); diff --git a/test/index.test.mjs b/test/index.test.mjs index 9b2908b..86da2e3 100644 --- a/test/index.test.mjs +++ b/test/index.test.mjs @@ -16,6 +16,7 @@ describe('percySnapshot', () => { mockedDriver = { getCapabilities: jasmine.createSpy('sendDevToolsCommand').and.returnValue({ getBrowserName: () => 'chrome' }), sendDevToolsCommand: jasmine.createSpy('sendDevToolsCommand').and.returnValue(Promise.resolve()), + navigate: jasmine.createSpy('navigate').and.returnValue({ refresh: jasmine.createSpy('refresh') }), manage: jasmine.createSpy('manage').and.returnValue({ window: jasmine.createSpy('window').and.returnValue({ setRect: jasmine.createSpy('setRect').and.returnValue(Promise.resolve()), @@ -187,6 +188,13 @@ describe('percySnapshot', () => { expect(mockedDriver.executeScript).not.toHaveBeenCalledWith('return window.resizeCount'); }); + it('should reload page if PERCY_RESPONSIVE_CAPTURE_RELOAD_PAGE is set', async () => { + process.env.PERCY_RESPONSIVE_CAPTURE_RELOAD_PAGE = true; + await percySnapshot(mockedDriver, 'Test Snapshot', { responsiveSnapshotCapture: true }); + expect(mockedDriver.navigate().refresh).toHaveBeenCalled(); + delete process.env.PERCY_RESPONSIVE_CAPTURE_RELOAD_PAGE; + }); + it('should wait if RESPONSIVE_CAPTURE_SLEEP_TIME is set', async () => { process.env.RESPONSIVE_CAPTURE_SLEEP_TIME = 1; spyOn(global, 'setTimeout').and.callThrough(); @@ -199,15 +207,11 @@ describe('percySnapshot', () => { it('should scroll if PERCY_ENABLE_LAZY_LOADING_SCROLL is set', async () => { process.env.PERCY_ENABLE_LAZY_LOADING_SCROLL = true; - process.env.PERCY_LAZY_LOAD_SCROLL_TIME = '1.2'; - const mockedScroll = spyOn(percySnapshot, 'slowScrollToBottom').and.resolveTo(true); - await percySnapshot(mockedDriver, 'Test Snapshot', { responsiveSnapshotCapture: true }); - expect(mockedScroll).toHaveBeenCalledWith(mockedDriver, 1.2); + expect(mockedScroll).toHaveBeenCalledWith(mockedDriver); delete process.env.PERCY_ENABLE_LAZY_LOADING_SCROLL; - delete process.env.PERCY_LAZY_LOAD_SCROLL_TIME; }); it('should use minHeight if PERCY_RESPONSIVE_CAPTURE_MIN_HEIGHT is set', async () => { @@ -221,7 +225,7 @@ describe('percySnapshot', () => { await percySnapshot(mockedDriver, 'Test Snapshot', { responsiveSnapshotCapture: true }); expect(mockedDriver.executeScript).toHaveBeenCalledTimes(4); - expect(mockedScroll).toHaveBeenCalledWith(mockedDriver, 0.45); + expect(mockedScroll).toHaveBeenCalledWith(mockedDriver); delete process.env.PERCY_ENABLE_LAZY_LOADING_SCROLL; delete process.env.PERCY_RESPONSIVE_CAPTURE_MIN_HEIGHT; }); @@ -260,8 +264,11 @@ describe('percySnapshot', () => { describe('#slowScrollToBottom', () => { let mockedDriver = { executeScript: jasmine.createSpy('executeScript') }; + beforeEach(() => { + mockedDriver.executeScript.calls.reset(); + }); - it('should scroll to bottom and sleep as set in env', async () => { + it('should scroll to bottom and sleep after loading as set in env', async () => { process.env.PERCY_SLEEP_AFTER_LAZY_LOAD_COMPLETE = 2; mockedDriver.executeScript.and.returnValues(9, 5, true, 9, true, 9, true); spyOn(global, 'setTimeout').and.callThrough(); @@ -273,6 +280,18 @@ describe('#slowScrollToBottom', () => { delete process.env.PERCY_SLEEP_AFTER_LAZY_LOAD_COMPLETE; }); + it('should scroll to bottom and sleep as set in env', async () => { + process.env.PERCY_LAZY_LOAD_SCROLL_TIME = '1.2'; + mockedDriver.executeScript.and.returnValues(9, 5, true, 9, true, 9, true); + spyOn(global, 'setTimeout').and.callThrough(); + + await slowScrollToBottom(mockedDriver); + expect(setTimeout.calls.allArgs()).toEqual([[jasmine.any(Function), 1200], [jasmine.any(Function), 1200], [jasmine.any(Function), 1000]]); + expect(mockedDriver.executeScript).toHaveBeenCalledWith('window.scrollTo(0, 0)'); + expect(mockedDriver.executeScript).toHaveBeenCalledTimes(7); + delete process.env.PERCY_LAZY_LOAD_SCROLL_TIME; + }); + it('should scroll upto 25k px and sleep as passed in function', async () => { mockedDriver.executeScript = jasmine.createSpy('executeScript'); mockedDriver.executeScript.and.returnValues(30000, 15000, true, 30000, true, 30000, true);