# aft-ui > Automated Functional Testing (AFT) core package supporting UI testing via plugins Latest version **12.1.1** (published 2024-05-23) · MIT license · 0 weekly downloads ## Install ```sh npm install aft-ui pnpm add aft-ui yarn add aft-ui bun add aft-ui ``` ## Health **Score 25/100 (F)** — status: abandoned. Positive: has types; no vulnerabilities; high quality score. Warnings: low downloads; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 12.1.1 | | Published | 2024-05-23 | | First published | 2019-11-25 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | CommonJS | | Dependencies | 1 | | Unpacked size | 107.3 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 0 | | Author | Jason Holt Smith | | Maintainers | bicarbon8 | | Keywords | aft, automation, e2e, integration, functional, ui | ## Links - npm: https://www.npmjs.com/package/aft-ui - Repository: https://github.com/bicarbon8/automated-functional-testing - Homepage: https://github.com/bicarbon8/automated-functional-testing#readme - Issues: https://github.com/bicarbon8/automated-functional-testing/issues - npm.io page: https://npm.io/package/aft-ui ## Dependencies (1) - [aft-core](https://npm.io/package/aft-core.md) ^12.1.1 ## Alternatives - [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads - [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads - [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads - [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads - [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads ## Recent versions - 12.1.1 (latest) — 2024-05-23 - 12.1.0 — 2024-05-17 - 12.0.1 — 2024-05-16 - 12.0.0 — 2024-05-15 - 11.2.1 — 2024-05-10 - 11.2.0 — 2024-05-09 - 11.1.1 — 2024-05-07 - 11.1.0 — 2024-04-18 - 11.0.0 — 2024-04-12 - 10.3.0 — 2024-03-28 - 10.2.2 — 2024-03-07 - 10.2.1 — 2023-07-11 - 10.2.0 — 2023-07-07 - 10.1.0 — 2023-05-24 - 10.0.0 — 2023-05-18 - … 18 more at https://npm.io/package/aft-ui/versions ## README # AFT-UI Automated Functional Testing (AFT) package supporting UI testing via plugins supporting the `UiSessionGeneratorPlugin` base class as well as providing ## Installation `> npm i aft-ui` ## Page Object Model (POM) the POM is a standard design pattern used in UI and layout testing. AFT-UI supports this model via an `UiComponent` class that is made up of one or more `UiComponent` classes and / or elements encapsulating logical blocks of functionality on the page. The `aft-ui` package supports UI session instantiation as well as development of libraries used to generate UI test sessions (via the `UiSessionGeneratorManager`, `UiSessionGeneratorPlugin`, classes). ### Creating a Session Generator Plugin (BrowserStack) the `UiSessionGeneratorPlugin` implementation is responsible for creating new UI session instances ```typescript export class BrowserStackAutomateConfig { uiplatform: UiPlatform; url: string = 'https://hub-cloud.browserstack.com/wd/hub/'; api: string = 'https://api.browserstack.com/automate/'; username: string; accessKey: string; } export class BrowserStackAutomateSessionGeneratorPlugin extends UiSessionGeneratorPlugin { override getSession = async (sessionOptions?: Record): Promise => { const cfg = this.aftCfg.getSection(BrowserStackAutomateConfig); let caps: Capabilities = await this.getCapabilities(); caps = merge(caps, sessionOptions); // using lodash merge return await new Builder() .usingServer(cfg.url) .withCapabilities(caps) .build(); } async getCapabilities(): Promise { const bsc = this.aftCfg.getSection(BrowserStackConfig); let capabilities: Capabilities = new Capabilities(); const platform: UiPlatform = bsc.uiplatform; capabilities.set('browserstack.user', bsc.username); capabilities.set('browserstack.key', bsc.accessKey); capabilities.set('platform', platform.os); capabilities.set('platform_version', platform.osVersion) capabilities.set('browserName', platform.browser); capabilities.set('browser_version', platform.browserVersion); return capabilities; } } ``` ## aftconfig.json keys and values supported by aft-ui-selenium package **GridSessionGeneratorPlugin Example using BrowserStack:** the `aft-ui-selenium` package contains a `UiSessionGeneratorPlugin` called `grid-session-generator-plugin` which the below example uses to demonstrate configuration supported by `aft-ui`. this is not to be confused with the above example demonstrating how a BrowserStack `UiSessionGeneratorPlugin` could be created using `aft-ui`. ```json // aftconfig.json { "UiSessionConfig": { "generatorName": "grid-session-generator-plugin", "options": { "url": "https://hub-cloud.browserstack.com/wd/hub", "capabilities": { "browserName": "android", "platformName": "android", "appium:platformVersion": "13.0", "appium:deviceName": "Samsung Galaxy S23", "appium:app": "bs://some-identifier-for-your-uploaded-app", "bstack:options": { "userName": "yourBrowserStackUser", "accessKey": "yourBrowserStackAccessKey", "debug": true } } } } } ``` - **generatorName** - a `string` containing the class name (optionally separated using `-` characters) that is used to get the specific `UiSessionGeneratorPlugin` implementation to be used - **options** - an `object` containing values that will be passed in to any `UiSessionGeneratorPlugin.getSession(sessionOptions)` call. it is up to the plugin to handle this data and the structure will be defined by the plugin being used. _the example above assumes a usage of the `grid-session-generator-plugin` from `aft-ui-selenium` to connect to BrowserStack's Automate service_ --- _Source: https://npm.io/package/aft-ui · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._