"Encountering a duplicate identifier problem with Protractor and Typescript version 2.0.0

After deciding to upgrade to Typescript 2.0 alongside Protractor 4.0.5, I encountered several challenges while transitioning from typescript 1.8 and protractor 3.8. Here are the issues I faced:

This is my updated package.json configuration:

{
"dependencies": {
"core-js": "2.2.2",
"rxjs": "5.0.0-beta.6",
"web-request": "^1.0.3",
"zone.js": "0.6.12"
},
"devDependencies": {
"@types/jasmine": "^2.5.35",
"@types/node": "^6.0.45",
"@types/protractor": "^1.5.20",
"@types/selenium-webdriver": "^2.53.33",
"es6-promise": "3.1.2",
"es6-promise-loader": "1.0.1",
...

And here's a snippet of my revised package json:

 "compilerOptions": {
    "target": "es5",
    ...
}

Trying to execute protractor tests with this setup resulted in multiple errors such as:

node_modules\@types\selenium-webdriver\index.d.ts (12,11): Duplicate identifier 'Driver'.
node_modules\@types\selenium-webdriver\index.d.ts (46,11): Duplicate identifier 'Options'.
node_modules\@types\selenium-webdriver\index.d.ts (310,11): Duplicate identifier 'ServiceBuilder'.
...

I'm puzzled by these errors as everything seems properly configured. Shouldn't Protractor 4.0.5 be compatible with typescript 2.0? How can this issue be resolved?

selenium-webdrivertypescriptnpmprotractortypescript2.0

Answer №1

Upgrading to version 5.x of Protractor removed the need for type declarations, so updating your current version should resolve the issue.

If you prefer to remain on version 4.0.5, you can uninstall the webdriver types by executing the following command:

npm uninstall --save-dev @types/selenium-webdriver

Answer №2

Can you please submit a bug report to the protractor team? The issue lies in including the typings of selenium-webdriver in its package, which should not be happening.

In the meantime, you can try implementing this workaround to address the issue:

// tsconfig.json
{
  "exclude": [
    "node_modules/protractor/typings/global/selenium-webdriver"
  ]
}

Answer №3

Here is a suggestion for your configuration. I made adjustments to typeRoots and exclude

{
 "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "noEmitHelpers": true,
    "lib": ["es6", "dom"],
    "types":[
    ],
    "typeRoots": [
        "node_modules/@types"
    ]
  },
  "exclude": [
    "node_modules",
    "node_modules/protractor/node_modules"
  ],
  "filesGlob": [
    "./src/**/*.ts",
    "!./node_modules/**/*.ts"
  ],
  "awesomeTypescriptLoaderOptions": {
    "resolveGlobs": true,
    "forkChecker": true,
    "compiler": "node_modules/typescript"
  },
  "compileOnSave": false,
  "buildOnSave": false,
  "atom": { "rewriteTsconfig": false }
}

If you are working with Protractor in TypeScript, you can check out the template I created: https://github.com/suvroc/protractor-typescript-template

You may find it helpful

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Encountering type-checking errors in the root query due to the specific types assigned to my root nodes in a GraphQL and TypeScript application built using Express

As I delve into the world of typescript/graphql, I encountered a peculiar issue while trying to define the type for one of my root nodes. The root node in question simply fetches a user by ID in the resolve function, and thus, I assigned the 'type&apo ...

typescriptexpressgraphqltypeerror

What is the recommended Node version for building my package?

As I work on developing my package with Node v12.14.0 on my local machine, a recent PR from Dependabot has raised concerns about the compatibility of my library Should I be concerned that using v12 features in my library will make it incompatible with ot ...

node.jsnpmpackage.jsonlts

Tips for creating a default route with parameters in Angular Component Router?

I am trying to set a default route in my sub-component (using useAsDefault: true) and have parameters automatically passed to it, but I can't seem to find any information on how to accomplish this in the documentation. I have a parent component with t ...

angulartypescriptangular2-routing

Leveraging Angular 4-5's HttpClient for precise typing in HTTP requests

Utilizing a helper service to simplify httpClient calls, I am eager to enforce strong typing on the Observable being returned. In my service where I utilize the api Service and attempt to obtain a strongly typed observable that emits: export class ApiU ...

angulartypescript

How does [name] compare to [attr.name]?

Question regarding the [attr.name] and [name], I am utilizing querySelectorAll in my Typescript as shown below: this._document.querySelectorAll("input[name='checkModel-']") However, when I define it in the HTML like this: <input [name]="check ...

htmlangulartypescript

Issues arise when compiling Angular 9 with Ivy in a Docker environment

Looking to create a new Angular 9 project using a custom image based on the official node image. I want to cache the package build without caching the Angular source build. Check out my Dockerfile below: FROM node COPY package.json /mnt/ RUN c ...

angulardockernpm

Attempting to carry out npm install -g process without sudo results in a prefix change

I have followed the instructions on this page: My npm configuration now looks like this: npm config get prefix /home/ranu/npm However, when I try to run npm install -g grunt-cli, I encounter the following error: npm ERR! Error: EACCES, mkdir '/u ...

node.jsubuntunpm

Confused by the error message while trying to create a React App

Decided to dive into React and create a simple app. Installed homebrew and node on my computer, then ran yarn install to build the app. However, upon running yarn start, encountered an error message. -Encountered a problem with the project dependency tree ...

iosnode.jsreactjsnpmcompiler-errors

Managing unordered protocol packets in ExpressJS with MySQL

My ExpressJS server with Node is utilizing the MySQL npm package and everything runs smoothly. However, after leaving the server running for an extended period (such as overnight), I consistently return to find it crashed with a PROTOCOL_PACKETS_OUT_OF_ORD ...

mysqlnode.jsexpressnpmprotocols

Encountering an error during Jest js installation - npm reports: "Class constructor cannot be invoked without 'new'"

Having trouble installing jest with this command npm i jest --save-dev An error message is showing up as follows npm ERR! Windows_NT 6.1.7601 npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files& ...

node.jsnpmjestjs

The error message "Permission denied for npm operation" occurred

Currently, I am working on developing a small application using angular2. The versions of node and npm that I am using are node -v v4.3.1 and npm -v 2.14.12 When I run the command "npm i -g angular-cli" it works without any issues. However, when I try to ...

node.jsnpm

Customize Bootstrap4 variables without making changes to the original source code

I have come across several articles recommending editing the _custom.scss file and recompiling Bootstrap. However, I am actually installing Bootstrap 4 via npm. Therefore, it wouldn't be ideal to modify the contents of Bootstrap in the node_modules fo ...

twitter-bootstrapangularnpmsassbootstrap-4

Parsing the header parameter in a GET request from Angular within the Spring backend

Recently, I delved into Rest services in Spring and learned from a tutorial that sending parameters to the backend can be done securely through the following method: getCompanyDetails(username:string): Observable<CompanyObject>{ const headers = ...

angularspringtypescripthttp

The navigate function fails to function properly in response to HttpClient

Hey there! I am facing an issue with the router.navigate function in Angular. When I try to use it within a subscribe method for httpClient, it doesn't seem to work as expected. Can someone please help me understand why this is happening and how I can ...

angulartypescript

Removing unnecessary files from a frontend npm package in a production environment: Best practices

Having trouble organizing the build process for my frontend web app created with Angular 2 and TypeScript. This is the structure I'm working with: / - dist/ <-- transpiled .js files - src/ <-- .ts files - assets/ - bower_components/ ...

typescriptnpmangularbrowserifynode-modules

Does it follow standard practice for Array.filter to have the capability to also perform mapping on an array of objects?

While experimenting with Array.filter, I made an interesting discovery. By forgetting to include an equality check, my array was unexpectedly mapped instead of filtered. Here is the code snippet that led to this result: const x = [{ name: 'user' ...

javascripttypescriptecmascript-6filter

What is the best method to compare two times and determine if they fall on the same date within an Angular 2/4 application? The time should be in the format of "HH:mm AM

Is there a way to validate if my time period falls on the same date? let startTime = currentSelection.startTimeHr + ":" + currentSelection.startTimeMin + " " + currentSelection.startTimeAMPM; let endTime = currentSelection.stopTimeHr + ":" + currentSele ...

jqueryangulartypescript

Angular2 Eclipse: Eclipse Oxygen's HTML editor detects TypeScript errors in real-time

After installing the Eclipse Oxygen plugin for Angular2, I created a project using the Angular CLI and opened it in Eclipse. However, when trying to convert the project to an Angular project, I couldn't find the option under configuration. Instead, th ...

eclipseangulartypescripteclipse-plugineclipse-oxygen

The String retrieved from the API response does not support displaying line breaks, whereas a hard-coded string can successfully display line breaks

Greetings, My frontend is built on Angular 8, with a Java API service serving as the backend. I need to fetch a String from the backend, which will contain '\n' line breaks. For example: "Instructions:\n1. Key in 122<16 digit ...

javascripthtmlangulartypescriptline-breaks

Get a Google Sheets file in CSV format

Currently, I am in the process of developing cloud functions for pushing data to Google AutoML. I have successfully created a function to generate the necessary data. However, for the next phase, I am curious about the possibility of downloading a Google ...

javascriptnpmgoogle-cloud-platformgoogle-cloud-functions