Alerts are not dismissed visually but the tests work

[RedX2501]

Using wdio 9 and wdio-electron-service 7.0.1.

I have cloned electron-react-boilerplate and modified App.ts to display alerts:

import { MemoryRouter as Router, Routes, Route } from 'react-router-dom';
import icon from '../../assets/icon.svg';
import './App.css';

function Hello() {
  setTimeout(() => {
    alert('alerting the main window!');
    alert('next alert');
  }, 1_000);
  return (
    <div>
      <div className="Hello">
        <img width="200" alt="icon" src={icon} />
      </div>
      <h1>electron-react-boilerplate</h1>
      <div className="Hello">
        <a
          href="https://electron-react-boilerplate.js.org/"
          target="_blank"
          rel="noreferrer"
        >
          <button type="button">
            <span role="img" aria-label="books">
              📚
            </span>
            Read our docs
          </button>
        </a>
        <a
          href="https://github.com/sponsors/electron-react-boilerplate"
          target="_blank"
          rel="noreferrer"
        >
          <button type="button">
            <span role="img" aria-label="folded hands">
              🙏
            </span>
            Donate
          </button>
        </a>
      </div>
    </div>
  );
}

export default function App() {
  return (
    <Router>
      <Routes>
        <Route path="/" element={<Hello />} />
      </Routes>
    </Router>
  );
}

When you run the following test it passes but the message box is not really dismissed:

import { browser } from '@wdio/globals'

describe('Electron Testing', () => {
    it('find and close alert', async () => {
        await browser.waitUntil(() => browser.isAlertOpen(), { timeout: 40_000, timeoutMsg: 'Alert not opened' });
        await expect(await browser.getAlertText()).toBe('alerting the main window!');
        // pause so I can move the dialog to see if both stay open
        await browser.pause(3_000);
        await browser.acceptAlert();
        await browser.waitUntil(() => browser.isAlertOpen(), { timeout: 40_000, timeoutMsg: 'Alert not opened' });
        await expect(await browser.getAlertText()).toBe('next alert');
        await browser.acceptAlert();
        await expect(await browser.isAlertOpen()).toBe(false);
        // some more pause so I can visually verify the alert is still open
        await browser.pause(5_000);
    })
})

So I'm unsure whether this is really a problem or not.

[christian-bromann]

@RedX2501 with v9 WebdriverIO starts to automatically handle alerts for you, see https://webdriver.io/blog/2024/08/15/webdriverio-v9-release#automatic-dialog-handling. If you are interested in the value of the alert, you have to setup an alert handler.

[RedX2501]

That is really nice.

I'm pretty sure though that in this case i'm not being "surprised" by any alert.

Does this mean that it is expected for them to just be dismissed "logically" but not "visually". Ie they stay being visible even after I "acceptAlert" them?

[christian-bromann]

No, if it is a system alert it should be dismissed logically and visually.