* Just cleaning up. * web: removing sonarjs from yet another branch. * web: everything except the tests are up-to-date. There was a lot, it turns out, we simply weren't using. * web: update package.json to support WebdriverIO 9 This commit: - Upgrades to WebdriverIO 9.1.2 - Resets our `devDependencies` collection to remove all imports that we either were not using or were duplicates of existing dependencies: - *Babel*, of all things - Storybook addon css user preferences, now native to Storybook 8 - SonarJS, *again*, sigh. - React - Fixes a bug where ESLint would report missing features in our build scripts - Fixes a bug where Wdio might not reach a headless browser before timeout - Replaces Rollup's CSSLit with Vite's CSSLit, which actually works without hacks, for testing. - Moves the package-lock scanner to its own script, with better reporting and tool verification, which also cleans up the package.lock file a little. * web: unify unit and end-to-end tests This commit builds on the Upgrade to WebdriverIO 9.1 and provides *two* variants of the wdio.conf file: One in `browser` mode, so that standalone component tests are uploaded to the browser and run independently, and one in `local` mode that allows the Webdriver-DOM framework to run end-to-end tests. This means that both Component and End-to-End tests use the same drivers, same framework, and same versions, and all tests for the WebUI are contained in this folder. * Prettier just opinionatin' all over the place. * Eslint bein' disagreeable. * Tests embedded like ticks. * Someday I'll get prettier to agree with my IDE. * Re-ran the installation with resolutions enforced. * web: fix type errors in tests Typechecking the tests is pretty messy, first because WebdriverIO passes around a lot of `ChainablePromise` objects, which TSC does not know how to resolve to their final form after a full `await`, and second because I used a lot of metaprogramming to provide getters for the different kinds of subtypes (here: providers) that we are targeting. So there are a lot of compromises here, none of which make me spectacularly happy, but they're all well-commented, so there's that. * But I am done with you, orc. * Fixed broken comment.
		
			
				
	
	
		
			63 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			63 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
import { browser } from "@wdio/globals";
 | 
						|
import { Key } from "webdriverio";
 | 
						|
 | 
						|
const CLICK_TIME_DELAY = 250;
 | 
						|
 | 
						|
/**
 | 
						|
 * Main page object containing all methods, selectors and functionality that is shared across all
 | 
						|
 * page objects
 | 
						|
 */
 | 
						|
export default class Page {
 | 
						|
    /**
 | 
						|
     * Opens a sub page of the page
 | 
						|
     * @param path path of the sub page (e.g. /path/to/page.html)
 | 
						|
     */
 | 
						|
    public async open(path: string) {
 | 
						|
        return await browser.url(`http://localhost:9000/${path}`);
 | 
						|
    }
 | 
						|
 | 
						|
    public async pause(selector?: string) {
 | 
						|
        if (selector) {
 | 
						|
            return await $(selector).waitForDisplayed();
 | 
						|
        }
 | 
						|
        return await browser.pause(CLICK_TIME_DELAY);
 | 
						|
    }
 | 
						|
 | 
						|
    /**
 | 
						|
     * Target a specific entry in SearchSelect. Requires that the SearchSelect have the `name`
 | 
						|
     * attribute set, so that the managed selector can find the *right* SearchSelect if there are
 | 
						|
     * multiple open SearchSelects on the board. See `./ldap-form.view:LdapForm.setBindFlow` for an
 | 
						|
     * example, and see `./oauth-form.view:OauthForm:setAuthorizationFlow` for a further example of
 | 
						|
     * why it would be hard to simplify this further (`flow` vs `tentanted-flow` vs a straight-up
 | 
						|
     * SearchSelect each have different a `searchSelector`).
 | 
						|
     */
 | 
						|
 | 
						|
    async searchSelect(searchSelector: string, managedSelector: string, buttonSelector: string) {
 | 
						|
        const inputBind = await $(searchSelector);
 | 
						|
        const inputMain = await inputBind.$('input[type="text"]');
 | 
						|
        await inputMain.click();
 | 
						|
        const searchBlock = await (
 | 
						|
            await $(`div[data-managed-for="${managedSelector}"]`).$("ak-list-select")
 | 
						|
        ).shadow$$("button");
 | 
						|
        let target: WebdriverIO.Element;
 | 
						|
        // @ts-expect-error "Types break on shadow$$"
 | 
						|
        for (const button of searchBlock) {
 | 
						|
            if ((await button.getText()).includes(buttonSelector)) {
 | 
						|
                target = button;
 | 
						|
                break;
 | 
						|
            }
 | 
						|
        }
 | 
						|
        // @ts-expect-error "TSC cannot tell if the `for` loop actually performs the assignment."
 | 
						|
        if (!target) {
 | 
						|
            throw new Error(`Expected to find an entry matching the spec ${buttonSelector}`);
 | 
						|
        }
 | 
						|
        await (await target).click();
 | 
						|
        await browser.keys(Key.Tab);
 | 
						|
    }
 | 
						|
 | 
						|
    public async logout() {
 | 
						|
        await browser.url("http://localhost:9000/flows/-/default/invalidation/");
 | 
						|
        return await this.pause();
 | 
						|
    }
 | 
						|
}
 |