{"id":20648128,"url":"https://github.com/stefanseeger/ts-page-object","last_synced_at":"2026-05-11T07:52:08.412Z","repository":{"id":50379820,"uuid":"518904448","full_name":"stefanseeger/ts-page-object","owner":"stefanseeger","description":null,"archived":false,"fork":false,"pushed_at":"2023-10-07T03:13:16.000Z","size":5151,"stargazers_count":1,"open_issues_count":3,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-02-18T19:18:27.198Z","etag":null,"topics":["angular","monorepo","react","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/stefanseeger.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-07-28T15:42:21.000Z","updated_at":"2022-08-11T08:18:19.000Z","dependencies_parsed_at":"2023-02-13T21:10:49.995Z","dependency_job_id":null,"html_url":"https://github.com/stefanseeger/ts-page-object","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stefanseeger%2Fts-page-object","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stefanseeger%2Fts-page-object/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stefanseeger%2Fts-page-object/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stefanseeger%2Fts-page-object/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stefanseeger","download_url":"https://codeload.github.com/stefanseeger/ts-page-object/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242737016,"owners_count":20177092,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","monorepo","react","typescript"],"created_at":"2024-11-16T17:06:24.577Z","updated_at":"2026-05-11T07:52:03.381Z","avatar_url":"https://github.com/stefanseeger.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# **ts-page-object**, **ngx-page-object** and **react-ts-page-object**\n\nThis repository is a mono repository which contains multiple page-object base projects\n\n## What is a PageObject\n\nThe original idea of a **PageObject** dates back (as far as I know) to [Martin Fowler 2013](https://martinfowler.com/bliki/PageObject.html).\n\nIn short a **PageObject** should be a non HTML based functional API to the web application.\n\nIt is recommended to use one **PageObject** per component and page. That way you will gain maximum reuseability and encapsulation.\n\nExamples for functions in **PageObject**s would be `clickContinue()`, `selectPassenger()`, `getPageTitle()`, `getAge()`\n\nA function in a **PageObject** should **NEVER return HTMLElements**. Instead return `string`, `number`, `boolean`, `objects` or `arrays` (i know arrays are typeof objects in JS).\nAnd if your component or page is containing sub-components you should definetly write a own **PageObject** for the sub component and let the parent return it.\n\n## Why should I use ts-page-object or ngx-page-object\n\nThe **ts-page-object** and **ngx-page-object** are providing you with utility functions to quickly write nice **PageObjects**.\n\n| Function               | Description                                                                                       |\n| ---------------------- | ------------------------------------------------------------------------------------------------- |\n| constructor            | creates the `PageObject` by the HTMLElement and when wanted with the selector                     |\n| $                      | first `HTMLElement` for selector                                                                  |\n| $$                     | all `HTMLElement`s for selector as array                                                          |\n| normalizeText          | Replaces all whitespace characters with a space. Remove multiple consequtive spaces. Strips       |\n| textContent            | textContent of first `HTMLElement`                                                                |\n| normalizedTextContent  | normalized textContent of first `HTMLElement`                                                     |\n| textContents           | array of textContent of all `HTMLElement`s                                                        |\n| normalizedTextContents | array or normalized textContent of all `HTMLElement`s                                             |\n| isDisplayed            | `true` when `HTMLElement` is in DOM                                                               |\n| idDisabled             | `true` when `HTMLElement` has `disabled` `attribute`                                              |\n| waitToAppear           | Resolves `Promise` when `HTMLElement` is in DOM. Waits 3 seconds per default before rejecting.    |\n| waitToDisappear        | Resolved `Promise` when `HTMLElement` is not in DOM. Waits 3 seconds per default before rejecting |\n| getFloat               | textContent as float number                                                                       |\n| getInt                 | textContent as int number                                                                         |\n| blur                   | send blur, input and change event to `HTMLElement`                                                |\n| setValue               | sets value `attribute` of `HTMLInputElement`                                                      |\n| getValue               | get value of value `attribute` of `HTMLInputElement`                                              |\n| click                  | clicks `HTMLElement`                                                                              |\n| isChecked              | `true` when `HTMLInputElement` has `checked` `attribute`                                          |\n| isValid                | `true` when `attribute` `aria-invalid` is not existing                                            |\n| keyUp                  | send `keyup` event with given key to HTMLInputElement                                             |\n\n## How to use\n\nSimply create a class which `extends PageObject` and implement the `getSelector` function that it returns the `HTMLElements` selector.\n\nCheck the demo applications in `packages/demo`\n\n- [Angular](https://github.com/stefanseeger/ts-page-object/tree/main/libs/demo/angular)\n- [React](https://github.com/stefanseeger/ts-page-object/tree/main/libs/demo/react)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstefanseeger%2Fts-page-object","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstefanseeger%2Fts-page-object","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstefanseeger%2Fts-page-object/lists"}