Scribd
Upload
121 views4 pages

Protractor - Exampletypescript at 5.4.1 Angular - Protractor Github

Protractor

Uploaded by

Hackerzilla
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
121 views4 pages

Protractor - Exampletypescript at 5.4.1 Angular - Protractor Github

Protractor

Uploaded by

Hackerzilla
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Enterprise Marketplace

Sign i Sign u
n p
Why GitHub? Explore Pricing

angular / protractor Watch 528 Star 8.5k Fork 2.4k

Code Issues 544 Pull requests 73 Actions Projects 3 Wiki Security Insights

5.4.1 protractor / exampleTypescript / Create new file Find file History

q i y i g g fix﴾doc﴿: update links in debugging docs to make it show correctly in… … Latest commit 3b29ee7 on Dec 7, 2017

..

asyncAwait fix﴾doc﴿: update links in debugging docs to make it show correctly in… 2 years ago

.gitignore docs﴾await﴿: Update example to show debugging with chrome devtools 3 years ago

README.md chore﴾docs﴿: Document disabling the control flow 3 years ago

angularPage.ts feat﴾typescript﴿: move typescript variable instances from protractor/… ﴾ 4 years ago

conf.ts chore﴾types﴿: clean up TypeScript support ﴾#3520﴿ 4 years ago


confPageObjects.ts docs﴾exampleTypescript﴿: improve comments and readme ﴾#3406﴿ 4 years ago

package.json fix﴾doc﴿: update doc for testing with node 8 async/await and chrome i… 2 years ago

plugins.ts fix﴾types﴿: output plugin typings ﴾#3389﴿ 4 years ago

spec.ts feat﴾typescript﴿: move typescript variable instances from protractor/… ﴾ 4 years ago

specPageObjects.ts chore﴾example﴿: add a protractor typescript example ﴾#3323﴿ 4 years ago

tsconfig.json docs﴾await﴿: Update example to show debugging with chrome devtools 3 years ago

README.md

Protractor with Typescript


Typescript provides code auto completion and helpful hints with a text editor like Microsoft's Visual Studio Code or another text
editor with Typescript support.

Note that this example uses TypeScript 2.0.

Examples
There are two examples in this directory:

Simple Protractor example


Similar to the github protractor example
Files conf.ts and spec.ts
Page objects example
Follows the protractortest.org page objects example
Files confPageObjects.ts , specPageObjects.ts , and angularPage.ts

File organization

exampleTypescript/
|‐ node_modules/ // downloaded node modules
|‐ tmp/ // compiled javascript output
|
|‐ .gitignore // since typescript produces javascript, we should not
| // commit javascript to the repo
|‐ angularPage.ts // page object example
|‐ confPageObjects.ts // configuration for the page objects example
|‐ package.json // node dependencies for the project
|‐ README.md // this file
|‐ spec.ts // spec for the simple protractor example
|‐ specPageObjects.ts // spec for the page objects example
|‐ tsconfig.json // typescript transpile configuration

Getting started
This package.json references the local protractor directory with "protractor": "file: ../" . For the type declarations to work,
from the protractor directory run an npm install to generate the declarations file.

Next, install the exampleTypescript node_modules with:

npm install

Protractor typings
To use Protractor types, you'll need to import protractor . After this is imported, you should have autocompletion hints when
typing.

import {browser, element, by, By, $, $$, ExpectedConditions} from 'protractor';

Although the Protractor configuration file can be written in javascript, creating it in typescript will have some hints. These hints and
the reference configuration can be found in lib/config.ts . Below we are importing the Config interface and applying that
interface to the config variable:

import {Config} from 'protractor';

export let config: Config = {


...
}
Ambient typings

Protractor also uses ambient types including jasmine, jasminewd2, and node. These are brought in via the tsconfig.json file,
which uses npm module resolution to get types from node_modules/@types .

If you are using the jasmine framework for your tests, make sure to do:

npm install ‐‐save‐dev @types/jasmine @types/jasminewd2

Compiling your code


To convert your typescript to javascript ﴾transpiling﴿, you'll use the Typescript compiler ﴾tsc﴿. If you install typescript globally, the
command is tsc . If it is not installed globally, the typescript compiler can be executed with npm run tsc .

Running Protractor
After transpiling your code to javascript, you'll run Protractor like before: protractor conf.js

Helpful links
TypescriptLang.org tutorial
TypescriptLang.org tsconfig.json
Typescript gitter
Typescript stackoverflow

© 2020 GitHub, Inc. Terms Privacy Security Status Help Contact GitHub Pricing API Training Blog About

You might also like