diff --git a/extension/jest.config.js b/extension/jest.config.js index bc9bb5d1..a56b83cd 100644 --- a/extension/jest.config.js +++ b/extension/jest.config.js @@ -1,4 +1,5 @@ module.exports = { setupFilesAfterEnv: ['/test/setup.js'], testPathIgnorePatterns: ['/examples'], + testEnvironment: 'jsdom', }; diff --git a/extension/test/chrome/extension.spec.js b/extension/test/chrome/extension.spec.js index 203c754d..5671fbc8 100644 --- a/extension/test/chrome/extension.spec.js +++ b/extension/test/chrome/extension.spec.js @@ -10,10 +10,12 @@ const actionsPattern = /^@@INIT(.|\n)+@@reduxReactRouter\/routerDidChange(.|\n)+@@reduxReactRouter\/initRoutes(.|\n)+$/; describe('Chrome extension', function () { + let driver; + beforeAll(async () => { chromedriver.start(); await delay(2000); - this.driver = new webdriver.Builder() + driver = new webdriver.Builder() .usingServer(`http://localhost:${port}`) .withCapabilities({ chromeOptions: { @@ -23,31 +25,32 @@ describe('Chrome extension', function () { .forBrowser('chrome') .build(); }); + afterAll(async () => { - await this.driver.quit(); + await driver.quit(); chromedriver.stop(); }); it("should open extension's window", async () => { - await this.driver.get(`chrome-extension://${extensionId}/window.html#left`); - const url = await this.driver.getCurrentUrl(); + await driver.get(`chrome-extension://${extensionId}/window.html#left`); + const url = await driver.getCurrentUrl(); expect(url).toBe(`chrome-extension://${extensionId}/window.html#left`); }); it('should match document title', async () => { - const title = await this.driver.getTitle(); + const title = await driver.getTitle(); expect(title).toBe('Redux DevTools'); }); it("should contain inspector monitor's component", async () => { - const val = await this.driver + const val = await driver .findElement(webdriver.By.xpath('//div[contains(@class, "inspector-")]')) .getText(); expect(val).toBeDefined(); }); it('should contain an empty actions list', async () => { - const val = await this.driver + const val = await driver .findElement( webdriver.By.xpath('//div[contains(@class, "actionListRows-")]') ) @@ -56,24 +59,24 @@ describe('Chrome extension', function () { }); Object.keys(switchMonitorTests).forEach((description) => - it(description, switchMonitorTests[description].bind(this)) + it(description, () => switchMonitorTests[description](driver)) ); it('should get actions list', async () => { const url = 'http://zalmoxisus.github.io/examples/router/'; - await this.driver.executeScript(`window.open('${url}')`); + await driver.executeScript(`window.open('${url}')`); await delay(2000); - const tabs = await this.driver.getAllWindowHandles(); + const tabs = await driver.getAllWindowHandles(); - await this.driver.switchTo().window(tabs[1]); - expect(await this.driver.getCurrentUrl()).toMatch(url); - await this.driver.manage().timeouts().pageLoadTimeout(5000); + await driver.switchTo().window(tabs[1]); + expect(await driver.getCurrentUrl()).toMatch(url); + await driver.manage().timeouts().pageLoadTimeout(5000); - await this.driver.switchTo().window(tabs[0]); + await driver.switchTo().window(tabs[0]); - const result = await this.driver.wait( - this.driver + const result = await driver.wait( + driver .findElement( webdriver.By.xpath('//div[contains(@class, "actionListRows-")]') ) diff --git a/extension/test/electron/devpanel.spec.js b/extension/test/electron/devpanel.spec.js index 12110d4c..e2aca5fd 100644 --- a/extension/test/electron/devpanel.spec.js +++ b/extension/test/electron/devpanel.spec.js @@ -9,10 +9,12 @@ const devPanelPath = 'chrome-extension://lmhkpmbekcpmknklioeibfkpmmfibljd/window.html'; describe('DevTools panel for Electron', function () { + let driver; + beforeAll(async () => { chromedriver.start(); await delay(1000); - this.driver = new webdriver.Builder() + driver = new webdriver.Builder() .usingServer(`http://localhost:${port}`) .withCapabilities({ chromeOptions: { @@ -22,33 +24,33 @@ describe('DevTools panel for Electron', function () { }) .forBrowser('electron') .build(); - await this.driver.manage().timeouts().setScriptTimeout(10000); + await driver.manage().timeouts().setScriptTimeout(10000); }); afterAll(async () => { - await this.driver.quit(); + await driver.quit(); chromedriver.stop(); }); it('should open Redux DevTools tab', async () => { - if (!(await this.driver.getCurrentUrl()).startsWith('devtools')) { - const originalWindow = await this.driver.getWindowHandle(); - const windows = await this.driver.getAllWindowHandles(); + if (!(await driver.getCurrentUrl()).startsWith('devtools')) { + const originalWindow = await driver.getWindowHandle(); + const windows = await driver.getAllWindowHandles(); for (const window of windows) { if (window === originalWindow) continue; - await this.driver.switchTo().window(window); - if ((await this.driver.getCurrentUrl()).startsWith('devtools')) { + await driver.switchTo().window(window); + if ((await driver.getCurrentUrl()).startsWith('devtools')) { break; } } } - expect(await this.driver.getCurrentUrl()).toMatch( + expect(await driver.getCurrentUrl()).toMatch( /devtools:\/\/devtools\/bundled\/devtools_app.html/ ); - await this.driver.manage().timeouts().pageLoadTimeout(5000); + await driver.manage().timeouts().pageLoadTimeout(5000); - const id = await this.driver.executeAsyncScript(function (callback) { + const id = await driver.executeAsyncScript(function (callback) { let attempts = 5; function showReduxPanel() { if (attempts === 0) { @@ -71,17 +73,17 @@ describe('DevTools panel for Electron', function () { }); expect(id).toBe('chrome-extension://lmhkpmbekcpmknklioeibfkpmmfibljdRedux'); - const className = await this.driver + const className = await driver .findElement(webdriver.By.className(id)) .getAttribute('class'); expect(className).not.toMatch(/hidden/); // not hidden }); it('should have Redux DevTools UI on current tab', async () => { - await this.driver + await driver .switchTo() .frame( - this.driver.findElement( + driver.findElement( webdriver.By.xpath(`//iframe[@src='${devPanelPath}']`) ) ); @@ -89,7 +91,7 @@ describe('DevTools panel for Electron', function () { }); it('should contain INIT action', async () => { - const element = await this.driver.wait( + const element = await driver.wait( webdriver.until.elementLocated( webdriver.By.xpath('//div[contains(@class, "actionListRows-")]') ), @@ -101,23 +103,23 @@ describe('DevTools panel for Electron', function () { }); it("should contain Inspector monitor's component", async () => { - const val = await this.driver + const val = await driver .findElement(webdriver.By.xpath('//div[contains(@class, "inspector-")]')) .getText(); expect(val).toBeDefined(); }); Object.keys(switchMonitorTests).forEach((description) => - it(description, switchMonitorTests[description].bind(this)) + it(description, () => switchMonitorTests[description](driver)) ); /* it('should be no logs in console of main window', async () => { - const handles = await this.driver.getAllWindowHandles(); - await this.driver.switchTo().window(handles[1]); // Change to main window + const handles = await driver.getAllWindowHandles(); + await driver.switchTo().window(handles[1]); // Change to main window - expect(await this.driver.getTitle()).toBe('Electron Test'); + expect(await driver.getTitle()).toBe('Electron Test'); - const logs = await this.driver.manage().logs().get(webdriver.logging.Type.BROWSER); + const logs = await driver.manage().logs().get(webdriver.logging.Type.BROWSER); expect(logs).toEqual([]); }); */ diff --git a/extension/test/utils/e2e.js b/extension/test/utils/e2e.js index db6eea92..200e59be 100644 --- a/extension/test/utils/e2e.js +++ b/extension/test/utils/e2e.js @@ -4,16 +4,16 @@ export const delay = (time) => new Promise((resolve) => setTimeout(resolve, time)); export const switchMonitorTests = { - 'should switch to Log Monitor': async function () { - await this.driver + 'should switch to Log Monitor': async function (driver) { + await driver .findElement(webdriver.By.xpath('//button[text()="Inspector"]')) .click(); await delay(500); // Wait till menu is fully opened - await this.driver + await driver .findElement(webdriver.By.xpath('//button[text()="Log monitor"]')) .click(); await delay(500); - await this.driver.findElement( + await driver.findElement( webdriver.By.xpath( '//div[div[button[text()="Reset"]] and .//div[button[text()="Revert"]]]' ) @@ -21,27 +21,27 @@ export const switchMonitorTests = { await delay(500); }, - 'should switch to Chart Monitor': async function () { - await this.driver + 'should switch to Chart Monitor': async function (driver) { + await driver .findElement(webdriver.By.xpath('//button[text()="Log monitor"]')) .click(); await delay(500); // Wait till menu is fully opened - await this.driver + await driver .findElement(webdriver.By.xpath('//button[text()="Chart"]')) .click(); await delay(500); - await this.driver.findElement( + await driver.findElement( webdriver.By.xpath('//*[@class="nodeText" and text()="state"]') ); await delay(500); // Wait till menu is closed }, - 'should switch back to Inspector Monitor': async function () { - await this.driver + 'should switch back to Inspector Monitor': async function (driver) { + await driver .findElement(webdriver.By.xpath('//button[text()="Chart"]')) .click(); await delay(1000); // Wait till menu is fully opened - await this.driver + await driver .findElement(webdriver.By.xpath('//button[text()="Inspector"]')) .click(); await delay(1500); // Wait till menu is closed diff --git a/packages/devui/jest.config.js b/packages/devui/jest.config.js index afe39ab7..0d26c6e5 100644 --- a/packages/devui/jest.config.js +++ b/packages/devui/jest.config.js @@ -1,4 +1,5 @@ module.exports = { preset: 'ts-jest', setupFilesAfterEnv: ['/tests/setup.ts'], + testEnvironment: 'jsdom', }; diff --git a/packages/react-base16-styling/jest.config.js b/packages/react-base16-styling/jest.config.js index 8824c114..2786a53d 100644 --- a/packages/react-base16-styling/jest.config.js +++ b/packages/react-base16-styling/jest.config.js @@ -1,3 +1,4 @@ module.exports = { preset: 'ts-jest', + testEnvironment: 'jsdom', }; diff --git a/packages/react-dock/jest.config.js b/packages/react-dock/jest.config.js index 8824c114..2786a53d 100644 --- a/packages/react-dock/jest.config.js +++ b/packages/react-dock/jest.config.js @@ -1,3 +1,4 @@ module.exports = { preset: 'ts-jest', + testEnvironment: 'jsdom', }; diff --git a/packages/redux-devtools-app/jest.config.js b/packages/redux-devtools-app/jest.config.js index 547c49dd..257086bf 100644 --- a/packages/redux-devtools-app/jest.config.js +++ b/packages/redux-devtools-app/jest.config.js @@ -1,4 +1,5 @@ module.exports = { preset: 'ts-jest', setupFilesAfterEnv: ['/test/setup.ts'], + testEnvironment: 'jsdom', }; diff --git a/packages/redux-devtools-inspector-monitor-test-tab/jest.config.js b/packages/redux-devtools-inspector-monitor-test-tab/jest.config.js index 547c49dd..257086bf 100644 --- a/packages/redux-devtools-inspector-monitor-test-tab/jest.config.js +++ b/packages/redux-devtools-inspector-monitor-test-tab/jest.config.js @@ -1,4 +1,5 @@ module.exports = { preset: 'ts-jest', setupFilesAfterEnv: ['/test/setup.ts'], + testEnvironment: 'jsdom', }; diff --git a/packages/redux-devtools-inspector-monitor-trace-tab/jest.config.js b/packages/redux-devtools-inspector-monitor-trace-tab/jest.config.js index 8824c114..2786a53d 100644 --- a/packages/redux-devtools-inspector-monitor-trace-tab/jest.config.js +++ b/packages/redux-devtools-inspector-monitor-trace-tab/jest.config.js @@ -1,3 +1,4 @@ module.exports = { preset: 'ts-jest', + testEnvironment: 'jsdom', };