Steps for porting protractor test project from javascript to typescript

Question

installed node and verified npm is working
added following to package json "dependencies": {}, "devDependencies": { "@angular/cli": "^7.0.4", "@types/jasmine": "~2.5.45", "@types/jasminewd2": "~2.0.3", "@types/node": "~8.9.4", "jasmine-core": "~2.99.1", "jasmine-reporters": "^2.3.1", "jasmine-spec-reporter": "~4.2.1", "prettier": "1.14.3", "protractor": "~5.3.0", "protractor-beautiful-reporter": "1.2.5", "stylelint": "^9.5.0", "stylelint-config-standard": "^18.2.0", "stylelint-scss": "^3.3.0", "ts-node": "~5.0.1", "tsc": "^1.20150623.0", "tslint": "~5.9.1", "typescript": "~2.7.2" } }
ran npm install

Tried to run npm run protractor conf.js

I get this error: { import { browser } from 'protractor';
^^^^^^

Syntax error unexpected token import.

From my understanding this happens because the project was not transpiled.

This is the step that i am stuck at. I tried to run ng build, hoping that this will transpile for me,but I get another error that my project is not angular.

Any help would be appeciated.

Batajus Batajus · Accepted Answer · 2018-11-14T19:30:40

At first you need a tsconfig.json next to your package.json.

The tsconfig.json can look like this (for more detail please see here):

{
    "compilerOptions": {
        "outDir": "dist/",
        "target": "es5"
    },
    "include": [
        "./src/**/*"  <-- Dynamic path to your test files
    ]
}

To compile i suggest to add following to the scripts section in your package.json:

...
"scripts": {
    ....
    "compile": "./node_modules/.bin/tsc"
    ....
}
...

After executing npm run compile you should have a dist directory in your project.

Now to execute your tests you need to adjust the path to your test files in your conf.js to from something like this:

./dist/sample-test.e2e.ts

to

./dist/sample-test.e2e.js

And now you should be able to execute your tests again ;-)

Update: After installing Typescript you have an executable in your ./node_modules/.bin directory, which you need to compile your *.ts files to *.js.

Steps for porting protractor test project from javascript to typescript

1 Answers