nightwatchjs / nightwatch

Integrated end-to-end testing framework written in Node.js and using W3C Webdriver API. Developed at @browserstack
https://nightwatchjs.org
MIT License
11.78k stars 1.31k forks source link

`waitForElementNotPresent` inside section waits for the section element to be gone #3181

Closed lloiser closed 1 year ago

lloiser commented 2 years ago

Describe the bug

Our application uses https://mui.com/ as a component library. It has standard components for displaying Dialogs and Select inputs. Both components will create a separate DOM hierarchy under the body when you open the Dialog or the Select dropdown. Once the Dialog or Select dropdown is gone, the DOM hierarchy is also gone.

For end-to-end testing we are currently using version 1.7.11. In order to test scenarios where we have a Dialog and a Select inside of it we are often relying on sections in nightwatch.

Since the Dialog and Select components will create a separate DOM hierarchy under the body when you open them we are using body as a selector for the section. Using that we can both target the Dialog body and the Select dropdown "inside" the Dialog. Selecting a value in the Select dropdown inside the Dialog will close the Select dropdown and therefore will remove the separate DOM hierarchy.

This has worked in version 1.7.11. The problem is that after an upgrade to version 2.1.4 this no longer works.

All tests that use this section with body selector will run into a timeout because the body is still available even though I only expect the Select dropdown to be gone.

  ✖ Timed out while waiting for element <Section [name=dialog],Element [name=@ten]> to be removed for 5000 milliseconds. - expected "not found" but got: "found" (5105ms)
    at Section.selectValueTen (/Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js:42:26)
    at Page.selectValueTen (/Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js:13:20)
    at Object.test case (/Users/lberanek-remote/projects/tmp/nightwatch/tests/test.e2e.js:5:18) 

The test below uses a custom codesandbox that demonstrates this scenario: https://t4v67b.csb.app/ I have also attached the verbose output of version 2.1.4 and 1.7.11 for comparison.

Sample test

tests/test.e2e.js

```js module.exports = { "test case": (browser) => { const homepage = browser.page.homepage(); homepage.open(); homepage.selectValueTen(); } } ```

pages/homepage.js

```js module.exports = { commands: [{ open() { this.api.url("https://t4v67b.csb.app/"); // loading the code sandbox can take some time this.waitForElementVisible("@button", 30000); }, selectValueTen() { this.click("@button"); const dialog = this.section.dialog; dialog.waitUntilVisible(); dialog.selectValueTen() dialog.close(); } }], elements: { button: "#demo-button" }, sections: { dialog: { selector: "body", elements: { root: "#demo-dialog", select: "#demo-dialog-select", ten: "[data-value=\"10\"]", ok: "#demo-dialog-ok" }, commands: [{ waitUntilVisible() { this.waitForElementVisible("@root"); }, selectValueTen() { // select menu opens and shows the items this.click("@select"); this.waitForElementVisible("@ten"); // wait for animation to finish this.pause(200) // click "Ten" this.click("@ten"); // select menu closes this.waitForElementNotPresent("@ten"); }, close() { this.click("@ok"); // click the "ok" button in the dialog this.waitForElementNotPresent("@root"); // the dialog should be gone now } }] } } }; ```

Run with command

$ nightwatch tests/test.e2e.js

Verbose output 2.1.4

debug.log

```txt [Test E2e] Test Suite ────────────────────────────────────────── ⠋ Starting ChromeDriver on port 9515... Starting ChromeDriver with server_path=/Users/lberanek-remote/projects/tmp/nightwatch/node_modules/chromedriver/lib/chromedriver/chromedriver... Request POST /session { desiredCapabilities: { browserName: 'chrome', 'goog:chromeOptions': { w3c: false, args: [] }, name: 'Test E2e' }, capabilities: { alwaysMatch: { browserName: 'chrome', 'goog:chromeOptions': { w3c: false, args: [] } } } ⠇ Starting ChromeDriver on port 9515... Response 200 POST /session (1464ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: { acceptInsecureCerts: false, acceptSslCerts: false, browserConnectionEnabled: false, browserName: 'chrome', chrome: { chromedriverVersion: '101.0.4951.41 (93c720db8323b3ec10d056025ab95c23a31997c9-refs/branch-heads/4951@{#904})', userDataDir: '/var/folders/r8/4bzg66cd5159gndl0sy_n5lw0000gr/T/.com.google.Chrome.FxTWlL' }, cssSelectorsEnabled: true, databaseEnabled: false, 'goog:chromeOptions': { debuggerAddress: 'localhost:59097' }, handlesAlerts: true, hasTouchScreen: false, javascriptEnabled: true, locationContextEnabled: true, mobileEmulationEnabled: false, nativeEvents: true, networkConnectionEnabled: false, pageLoadStrategy: 'normal', platform: 'Mac OS X', proxy: {}, rotatable: false, setWindowRect: true, strictFileInteractability: false, takesHeapSnapshot: true, takesScreenshot: true, timeouts: { implicit: 0, pageLoad: 300000, script: 30000 }, unexpectedAlertBehaviour: 'ignore', version: '101.0.4951.54', webStorageEnabled: true, 'webauthn:extension:credBlob': true, 'webauthn:extension:largeBlob': true, 'webauthn:virtualAuthenticators': true } ℹ Connected to ChromeDriver on port 9515 (1554ms). Using: chrome (101.0.4951.54) on MAC OS X. Received session with ID: fe83f9e5ed6f8f41dd22c6f1ef59f0c3 → Running [before]: → Completed [before]. Running test case: ─────────────────────────────────────────────────────────────────────────────────────────────────── → Running [beforeEach]: → Completed [beforeEach]. → Running command: url ('https://t4v67b.csb.app/') ⠋ Loading url: https://t4v67b.csb.app/ Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/url ⠴ Loading url: https://t4v67b.csb.app/ Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/url (1307ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: null ℹ Loaded url https://t4v67b.csb.app/ in 1309ms → Completed command: url ('https://t4v67b.csb.app/') (1310ms) → Running command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout...}, 30000) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (19ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (7ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (12ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (1127ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-1' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/execute/sync { script: 'return (function(){return (function(){var k=this||self;function aa(a){return"string"==typeof a}function ba(a,b){a=a.split(".");var c=k;a[0]in c||"undefined"==typeof c.execScript||c.execScript("var "+a... (44027 characters)', args: [ { 'element-6066-11e4-a52e-4f735466cecf': '0.7613805424150168-1', ELEMENT: '0.7613805424150168-1' } ] } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/execute/sync (16ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: true } ✔ Element <#demo-button> was visible after 2703 milliseconds. → Completed command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout...}, 30000) (2706ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout...}) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (8ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-1' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-1/click {} Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-1/click (169ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout...}) (180ms) → Running command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (12ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements { using: 'css selector', value: '#demo-dialog' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements (14ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-3' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/execute/sync { script: 'return (function(){return (function(){var k=this||self;function aa(a){return"string"==typeof a}function ba(a,b){a=a.split(".");var c=k;a[0]in c||"undefined"==typeof c.execScript||c.execScript("var "+a... (44027 characters)', args: [ { 'element-6066-11e4-a52e-4f735466cecf': '0.7613805424150168-3', ELEMENT: '0.7613805424150168-3' } ] } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/execute/sync (17ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: true } ✔ Element

was visible after 46 milliseconds. → Completed command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (46ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (8ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements { using: 'css selector', value: '#demo-dialog-select' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements (12ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-4' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-4/click {} Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-4/click (91ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (114ms) → Running command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (9ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements (12ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-5' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/execute/sync { script: 'return (function(){return (function(){var k=this||self;function aa(a){return"string"==typeof a}function ba(a,b){a=a.split(".");var c=k;a[0]in c||"undefined"==typeof c.execScript||c.execScript("var "+a... (44027 characters)', args: [ { 'element-6066-11e4-a52e-4f735466cecf': '0.7613805424150168-5', ELEMENT: '0.7613805424150168-5' } ] } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/execute/sync (14ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: true } ✔ Element
was visible after 37 milliseconds. → Completed command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (37ms) → Running command: pause (200) → Completed command: pause (200) (205ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (13ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements (9ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-5' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-5/click {} Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-5/click (77ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (101ms) → Running command: waitForElementNotPresent ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (46ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/element/0.7613805424150168-2/elements (7ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-5' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (6ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (6ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (7ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (7ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (6ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (6ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (6ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (7ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (9ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } Request POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements { using: 'css selector', value: 'body' } Response 200 POST /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3/elements (5ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: [ { ELEMENT: '0.7613805424150168-2' } ] } ✖ Timed out while waiting for element
to be removed for 5000 milliseconds. - expected "not found" but got: "found" (5151ms) at Section.selectValueTen (/Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js:42:26) at Page.selectValueTen (/Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js:13:20) at Object.test case (/Users/lberanek-remote/projects/tmp/nightwatch/tests/test.e2e.js:5:18) → Completed command: waitForElementNotPresent ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (5153ms) → Running [afterEach]: → Completed [afterEach]. FAILED: 1 assertions failed and 3 passed (9.9s) → Running [after]: → Completed [after]. → Running command: end () → Running command: session ('delete', [Function]) Request DELETE /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3 Response 200 DELETE /session/fe83f9e5ed6f8f41dd22c6f1ef59f0c3 (52ms) { sessionId: 'fe83f9e5ed6f8f41dd22c6f1ef59f0c3', status: 0, value: null } → Completed command: session ('delete', [Function]) (54ms) Wrote log file to: /Users/lberanek-remote/projects/tmp/nightwatch/logs/test.e2e_chromedriver.log. → Completed command: end () (61ms) ──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────── TEST FAILURE (11.726s): - 1 assertions failed; 3 passed /Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js: –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– 40 | this.click("@ten"); 41 | // select menu closes 42 | this.waitForElementNotPresent("@ten"); 43 | }, 44 | close() { –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– ✖ 1) test.e2e – test case (9.9s) Timed out while waiting for element
to be removed for 5000 milliseconds. - expected "not found" but got: "found" (5151ms) at Section.selectValueTen (/Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js:42:26) at Page.selectValueTen (/Users/lberanek-remote/projects/tmp/nightwatch/pages/homepage.js:13:20) at Object.test case (/Users/lberanek-remote/projects/tmp/nightwatch/tests/test.e2e.js:5:18) ChromeDriver process closed. Wrote report file to: tests_output/CHROME_101.0.4951.54_Mac_OS_X_test.e2e.xml. ```

Verbose output 1.7.11

debug.log

```txt Starting ChromeDriver on port 9515... ChromeDriver up and running on port 9515 with pid: 90661 (131ms). [Test E2e] Test Suite ===================== ⠋ Connecting to localhost on port 9515... Request POST /session { desiredCapabilities: { browserName: 'chrome', 'goog:chromeOptions': { w3c: false, args: [] }, name: 'Test E2e' } ⠋ Connecting to localhost on port 9515... Response 200 POST /session (1709ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: { acceptInsecureCerts: false, acceptSslCerts: false, browserConnectionEnabled: false, browserName: 'chrome', chrome: { chromedriverVersion: '101.0.4951.41 (93c720db8323b3ec10d056025ab95c23a31997c9-refs/branch-heads/4951@{#904})', userDataDir: '/var/folders/r8/4bzg66cd5159gndl0sy_n5lw0000gr/T/.com.google.Chrome.t53yQf' }, cssSelectorsEnabled: true, databaseEnabled: false, 'goog:chromeOptions': { debuggerAddress: 'localhost:59188' }, handlesAlerts: true, hasTouchScreen: false, javascriptEnabled: true, locationContextEnabled: true, mobileEmulationEnabled: false, nativeEvents: true, networkConnectionEnabled: false, pageLoadStrategy: 'normal', platform: 'Mac OS X', proxy: {}, rotatable: false, setWindowRect: true, strictFileInteractability: false, takesHeapSnapshot: true, takesScreenshot: true, timeouts: { implicit: 0, pageLoad: 300000, script: 30000 }, unexpectedAlertBehaviour: 'ignore', version: '101.0.4951.54', webStorageEnabled: true, 'webauthn:extension:credBlob': true, 'webauthn:extension:largeBlob': true, 'webauthn:virtualAuthenticators': true } ℹ Connected to localhost on port 9515 (1745ms). Using: chrome (101.0.4951.54) on Mac OS X platform. Received session with ID: d45a6fd03d7040e599d0882bc7edf4fb → Running [before]: → Completed [before]. Running test case: → Running [beforeEach]: → Completed [beforeEach]. → Running command: url ('https://t4v67b.csb.app/') Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/url { url: 'https://t4v67b.csb.app/' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/url (1841ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: null } → Completed command: url ('https://t4v67b.csb.app/') (1844ms) → Running command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout, retryInterval, message}, 30000) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (14ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (12ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (8ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (992ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-1' } ] } Request GET /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-1/displayed Response 200 GET /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-1/displayed (12ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: true } ✔ Element <#demo-button> was visible after 3061 milliseconds. → Completed command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout, retryInterval, message}, 30000) (3063ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout, retryInterval, message}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: '#demo-button' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (6ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-1' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-1/click {} Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-1/click (102ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement, abortOnFailure, suppressNotFoundErrors, timeout, retryInterval, message}) (110ms) → Running command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (12ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '#demo-dialog' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (35ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-3' } ] } Request GET /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-3/displayed Response 200 GET /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-3/displayed (9ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: true } ✔ Element

was visible after 59 milliseconds. → Completed command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (59ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (6ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '#demo-dialog-select' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (9ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-4' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-4/click {} Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-4/click (101ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (118ms) → Running command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (10ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (12ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-5' } ] } Request GET /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-5/displayed Response 200 GET /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-5/displayed (12ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: true } ✔ Element
was visible after 35 milliseconds. → Completed command: waitForElementVisible ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (35ms) → Running command: pause (200) → Completed command: pause (200) (203ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (9ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-5' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-5/click {} Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-5/click (61ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (77ms) → Running command: waitForElementNotPresent ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (26ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (11ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-5' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '[data-value="10"]' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (6ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [] } ✔ Element
was not present after 555 milliseconds. → Completed command: waitForElementNotPresent ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (557ms) → Running command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (6ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '#demo-dialog-ok' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (10ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-6' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-6/click {} Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-6/click (44ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: null } → Completed command: click ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (60ms) → Running command: waitForElementNotPresent ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '#demo-dialog' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-3' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements { using: 'css selector', value: 'body' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [ { ELEMENT: '0.8299799198819697-2' } ] } Request POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements { using: 'css selector', value: '#demo-dialog' } Response 200 POST /session/d45a6fd03d7040e599d0882bc7edf4fb/element/0.8299799198819697-2/elements (7ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: [] } ✔ Element
was not present after 534 milliseconds. → Completed command: waitForElementNotPresent ({name, __index, __selector, locateStrategy, pseudoSelector, parent, resolvedElement}) (534ms) → Running [afterEach]: → Completed [afterEach]. OK. 5 assertions passed. (6.688s) → Running [after]: → Completed [after]. → Running command: end () → Running command: session ('delete', [Function]) Request DELETE /session/d45a6fd03d7040e599d0882bc7edf4fb Response 200 DELETE /session/d45a6fd03d7040e599d0882bc7edf4fb (104ms) { sessionId: 'd45a6fd03d7040e599d0882bc7edf4fb', status: 0, value: null } → Completed command: end () (106ms) → Completed command: session ('delete', [Function]) (105ms) Wrote report file to: tests_output/CHROME_101.0.4951.54_Mac_OS_X_test.e2e.xml. Wrote log file to: /Users/lberanek-remote/projects/tmp/nightwatch/chromedriver.log. ChromeDriver process closed. ```

Configuration

nightwatch.json

I have used the automatically generated default config and adjusted `src_folders` and `page_objects_path`. ```js // // Refer to the online docs for more details: // https://nightwatchjs.org/gettingstarted/configuration/ // // _ _ _ _ _ _ _ // | \ | |(_) | | | | | | | | // | \| | _ __ _ | |__ | |_ __ __ __ _ | |_ ___ | |__ // | . ` || | / _` || "_ \ | __|\ \ /\ / / / _` || __| / __|| "_ \ // | |\ || || (_| || | | || |_ \ V V / | (_| || |_ | (__ | | | | // \_| \_/|_| \__, ||_| |_| \__| \_/\_/ \__,_| \__| \___||_| |_| // __/ | // |___/ // module.exports = { src_folders: ["tests/"], page_objects_path: ["pages/"], webdriver: {}, test_settings: { default: { disable_error_log: false, launch_url: "https://nightwatchjs.org", screenshots: { enabled: false, path: "screens", on_failure: true }, desiredCapabilities: { browserName: "firefox" }, webdriver: { start_process: true, server_path: "" } }, firefox: { desiredCapabilities: { browserName: "firefox", alwaysMatch: { acceptInsecureCerts: true, "moz:firefoxOptions": { args: [ // "-headless", // "-verbose" ] } } }, webdriver: { start_process: true, server_path: "", cli_args: [ // very verbose geckodriver logs // "-vv" ] } }, chrome: { desiredCapabilities: { browserName: "chrome", "goog:chromeOptions": { // More info on Chromedriver: https://sites.google.com/a/chromium.org/chromedriver/ // // w3c:false tells Chromedriver to run using the legacy JSONWire protocol (not required in Chrome 78) w3c: true, args: [ //"--no-sandbox", //"--ignore-certificate-errors", //"--allow-insecure-localhost", //"--headless" ] } }, webdriver: { start_process: true, server_path: "", cli_args: [ // --verbose ] } } } }; ```

Your Environment

Executable Version
nightwatch --version 2.1.4
npm --version 8.3.0
node --version v16.13.1
Browser driver Version
NAME VERSION
chromedriver 101.0.0
geckodriver 3.0.1
OS Version
NAME VERSION
macOS Big Sur 11.6.5
AutomatedTester commented 1 year ago

When we upgrade to Selenium 4.5 we will be able to take better advantage of the new Select package that they ship and allow us to solve this problem better.

ldziadkowiec commented 1 year ago

We experience exactly same issue. Wanted to do an upgrade from 1.7.13 to 2.4.2. Mostly seems to work, but .waitForElementNotPresent() does not. Our test PO structure has many sections and ofter waitFor synchronize methods.

example method inside a subsection: waitForModelNotLocked() { return this.waitForElementNotPresent( '@lockedModelIndicator', this.api.globals.waitForComputationTimeout, 'Waiting for model to be not locked...' ); },

We are waiting for loading indicator which should be not present after data model are loaded. Once the element @lockedModelIndicator is gone, the NWJS still queries for parent section which is logically still present and keeps going until timeout. This behavior is regression over 1.7.13.

` → Running command: waitForElementNotPresent ({name, index, selector, locateStrategy, pseudoSelector, parent, resolvedElement}, 90000, 'Waiting for model to be not locked...') Request POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/elements
{ using: 'css selector', value: '.Header_container' } Response 200 POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/elements (32ms) { sessionId: 'f1de732d57c5c8165a91de5828aa4cb5', status: 0, value: [ { ELEMENT: '0.9229013749709771-8' } ] } Request POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/element/0.9229013749709771-8/elements
{ using: 'css selector', value: '.uno.lock-closed' } Response 200 POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/element/0.9229013749709771-8/elements (15ms) { sessionId: 'f1de732d57c5c8165a91de5828aa4cb5', status: 0, value: [ { ELEMENT: '0.9229013749709771-9' } ] } Request POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/elements
{ using: 'css selector', value: '.Header_container' } Response 200 POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/elements (37ms) { sessionId: 'f1de732d57c5c8165a91de5828aa4cb5', status: 0, value: [ { ELEMENT: '0.9229013749709771-8' } ] } Request POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/elements
{ using: 'css selector', value: '.Header_container' } Response 200 POST /wd/hub/session/f1de732d57c5c8165a91de5828aa4cb5/elements (11ms) {

 sessionId: 'f1de732d57c5c8165a91de5828aa4cb5',
 status: 0,
 value: [ { ELEMENT: '0.9229013749709771-8' } ]

} `

This behavior make no sense, and should be fixed as it was in V1.

ldziadkowiec commented 1 year ago

When we upgrade to Selenium 4.5 we will be able to take better advantage of the new Select package that they ship and allow us to solve this problem better.

Can you please elaborate about the workaround ? I found this bug very limitating, practically I would have to flatten whole page-object structure just to fix the behavior for us. I'm very surprised that nobody really care for half a year.

dil-lberanek commented 1 year ago

@AutomatedTester I have updated to the latest nightwatch version (2.6.10) which uses selenium-webdriver: 4.6.1 and it still does not work. IMO this is not related to selenium, instead it is caused by nightwatch doing an additional "not present" check on the section selector, which in my case is body and therefore always exists.

ldziadkowiec commented 1 year ago

@beatfactor I have seen that you were fixing many issues recently, but this regression in behavior stays intact. Is there anything which is blocking the fix like better issue description with example ? I do not understand why this regression has zero attention while other minor bugs were fixed in no time.