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

问题

I have installed Protractor, typescript, jasmine with type globally and also locally. Getting following error while running the test via npm install, please guide if anything wrong with the setup.

import {browser, element, by, By, $, $$, ExpectedConditions} from 'protractor';
^^^^^^
SyntaxError: Unexpected token import
    at createScript (vm.js:56:10)
    at Object.runInThisContext (vm.js:97:10)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at C:\MyFiles\NewTechonologies\Protractor\TypeScript\Test\node_modules\jasmine\lib\jasmine.js:93:5
[13:14:56] E/launcher - Process exited with error code 100
npm ERR! Test failed.  See above for more details. 

Below are the details of files I am using in visual studio code

Conf.ts

import {Config} from 'protractor';

export let config: Config = {

  framework: 'jasmine',
  capabilities: {
    browserName: 'chrome'
  },
  specs: [ '../spec.ts' ],
   onPrepare: () => {
     let globals = require('protractor');
   let browser = globals.browser;
   browser.manage().window().maximize();
   browser.manage().timeouts().implicitlyWait(5000);
    // doing a browser.get will lead to a transpile error. 
    // undefined does not have a get method
  },
  seleniumAddress: 'http://localhost:4444/wd/hub',

  // You could set no globals to true to avoid jQuery '$' and protractor '$'
  // collisions on the global namespace.
  noGlobals: true
};

spec.ts

import {browser, element, by, By, $, $$, ExpectedConditions} from 'protractor';
//import { ElementFinder, browser, by, element } from 'protractor';
import protractor = require('protractor');

describe('protractor with typescript typings', () => {
  beforeEach(() => {
    browser.get('http://www.angularjs.org');
  });

  it('should greet the named user', async() => {
    setTimeout(function() {
    // Whatever you want to do after the wait
}, 4000);
    element(by.model('yourName')).sendKeys('Julie');
    let greeting = element(by.binding('yourName'));
   // expect(greeting.getText()).toEqual('Hello Julie!');
   expect<any>(greeting.getText()).toEqual('Hello Julie!');
  });

  it('should list todos', function() {
    let todoList = element.all(by.repeater('todo in todoList.todos'));
    expect<any>(todoList.count()).toEqual(2);
    expect<any>(todoList.get(1).getText()).toEqual('build an angular app');
  });
});

package.json

{
  "name": "example-typescript",
  "version": "1.0.0",
  "description": "a typescript example",
  "author": "",
  "license": "MIT",
  "scripts": {
    "tsc": "tsc",
    "pretest": "npm run tsc",
    "test": "protractor tmp/conf.js"
  },
  "dependencies": {
    "@types/jasmine": "^2.5.47",
    "@types/jasminewd2": "^2.0.0",
    "jasmine": "^2.4.1",
     "protractor": "file:../",
    "typescript": "~2.1.6"
  },
  "devDependencies": {
    "@types/jasmine": "^2.5.51",
    "@types/jasminewd2": "^2.0.2",
    "ts-node": "^3.0.2"
  }

回答1:

If you don't have a tsconfig.json, create one. To get a basic one, given your configuration, you can do:

npm run tsc -- --init

Edit the module and target properties and make sure they are commonjs and es5 respectively. The error you had is due to the fact that ES6 modules are not yet supported by node. Thus node failed when parsing the import token.

Here is an example of tsconfig.json that should work for you:

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "moduleResolution": "node",
        "sourceMap": true,
        "lib": [
            "dom",
            "es2015",
        ]
    },
    "exclude": [
        "node_modules"
    ]
}

回答2:

As per the comment discussions, i have changed the conf.ts content from ../spec.ts to spec.js and worked fine

conf.ts

import {Config, browser} from 'protractor';
export let config: Config = {

  framework: 'jasmine',
  capabilities: {
    browserName: 'chrome',
    chromeOptions: {
            'args': ['disable-infobars']
        }
  },

  specs: [ 'spec.js' ],
   onPrepare: () => {
     let globals = require('protractor');
   let browser = globals.browser;
   browser.ignoreSynchronization = true;
   browser.manage().window().maximize();
   browser.manage().timeouts().implicitlyWait(5000);
  },
  seleniumAddress: 'http://localhost:4444/wd/hub',
  noGlobals: true
};

来源：https://stackoverflow.com/questions/44454642/import-browser-element-by-by-expectedconditions-from-protractor-e