# @anviltech/fui-po

> A collection of protractor page objects

Latest version **1.65.0** (published 2020-03-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install @anviltech/fui-po
pnpm add @anviltech/fui-po
yarn add @anviltech/fui-po
bun add @anviltech/fui-po
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.65.0 |
| Published | 2020-03-23 |
| First published | 2019-09-10 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 19.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Rodrigo Silveira |
| Maintainers | anvil-open-source, luvaas, rodrigo.silveira |

## Links

- npm: https://www.npmjs.com/package/@anviltech/fui-po
- Repository: https://github.com/silicon-valley-innovation-center/fleetmanager-ui/tree/master
- npm.io page: https://npm.io/package/@anviltech/fui-po

## Recent versions

- 1.65.0 (latest) — 2020-03-23
- 1.64.0 — 2020-03-13
- 1.63.0 — 2020-03-10
- 1.62.1 — 2020-03-06
- 1.62.0 — 2020-03-03
- 1.61.0 — 2020-02-26
- 1.60.1 — 2020-02-25
- 1.60.0 — 2020-02-19
- 1.59.0-beta2 — 2020-02-19
- 1.59.0-beta — 2020-02-19
- 1.59.0 — 2020-02-07
- 1.57.4-alpha.2 — 2020-02-05
- 1.57.4-alpha.1 — 2020-02-05
- 1.58.0 — 2020-02-03
- 1.57.3 — 2020-01-14
- … 54 more at https://npm.io/package/@anviltech/fui-po/versions

## README

# Fleet Manager UI Page Objects
The `fui-po` page objects are used by `fleetmanagement-ui` e2e tests and shared with other projects what require them for their e2e tests via the `@anviltech/fui-po` NPM package.

# Building and publishing the @anviltech/fui-po npm package
The `@anviltech/fui-po npm package` is a NPM package aggregating a number of [Typescript Modules](https://www.typescriptlang.org/docs/handbook/modules.html), one per page object; it is a heavily modified version of the [How to Create and Publish an NPM module in TypeScript](https://codeburst.io/https-chidume-nnamdi-com-npm-module-in-typescript-12b3b22f0724) recipe.

The NPM package source is hosted in the `fleetmanagement-ui` repository's `fui-po` folder. The page objects are hosted in the `fui-po/page-objecs` folder and exposed by the `index.ts` module.

The the `fleetmanagement-ui package.json` file includes `yarn scripts` to build and publish the package; `po:build` builds and `po:pub` publishes it.

## Adding a page object to @anviltech/fui-po npm package
We use the `fui-po/index.ts` file to expose page objects; assuming we are adding the `my-new-page-view` page object:
````
// index.ts
...
export { MyNewPageView } from "./page-objects/my-new-page-view.po";
...
````

Next, we add the new file, `fui-po/page-objecs`, to the `fui-po/page-objecs` folder
````
// my-new-page-view.po.ts
import {by, element, browser} from 'protractor';

export class MyNewPageView {
  ...
}

````

Next we build the package:
````
$ yarn po:build
````

## Publishing the @anviltech/fui-po npm package
Update the `fleetmanagement-ui` package.json version, and CHANGELOG; update the `@anviltech/fui-po` package CHANGELOG and README; notice that the new `@anviltech/fui-po` package will be derived from the `fleetmanagement-ui` version.

Next we publish the package:
````
$ yarn po:pub
````

Note that you must have credentials to publish to the `NPM @anviltech` organization.

# Using @anviltech/fui-po page objects
This implementation offers two usage alternatives. The first supports writing E2E tests within the `fleetmanagement-ui` repository and the other writing E2E tests within other repositories sharing the `fleetmanagement-ui` page objects.

## In Fleet Manager UI
The e2e test scripts refer to page objects in the `fui-po/page-objecs` folder:

````
// a fleetmanager-ui e2e spec file
import { browser } from 'protractor';

import { LayoutComponentView } from '../../fui-po/page-objects/layout.component.view.po';
import { NavigationComponentView } from '../../fui-po/page-objects/navigation.component.view.po';
````

Everything else remains the same.

## In other applications
The `fleetmanagement-ui` page objects are found in the `@anviltech/fui-po` npm package, installed as follows:

````
$ yarn -D add @anviltech/fui-po
````

We import `fleetmanagement-ui` page objects slightly differently:
````
// a fleetmanager-ui e2e spec file
import { browser } from 'protractor';

import { LayoutComponentView } from '@anviltech/fui-po';
import { NavigationComponentView } from '@anviltech/fui-po';
````
Everything else remains the same.

---
_Source: https://npm.io/package/@anviltech/fui-po · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._