Error when running end-to-end tests in Angular CLI using the ng e2e

Recently, I created a new Angular 4 project using the Angular CLI. Upon running ng e2e, the sample end-to-end test worked flawlessly. However, when I later added a subfolder named services in the app folder and generated a service within it, the ng e2e command started throwing an error:

[09:11:56] E/configParser - Error message: failed loading configuration file protractor.conf.js [09:11:56] E/configParser - Error: Cannot find module 'C:\Projects\new\test-project\src\app\services\protractor.conf.js'

I'm puzzled as to why this is happening. It seems like the e2e script is trying to access the services folder, resulting in this error. Is there any way to prevent this? I am not certain about the solution.

angulartypescripttestingangular-cliangular-e2e

Answer №1

It appears that the protractor.conf.js configuration file is missing from the specified path 

C:\Projects\new\test-project\src\app\services\protractor.co‌​nf.js
. To fix this, you can simply execute ng new some-app and then copy the file over.

In response to your question on Stack Overflow, no, you do not need to create a separate protractor.conf.js for each folder. There is only one configuration file per app. When you generate a service or component, Angular CLI creates a .spec file which is related to karma and can be run using ng t, ng test, or npm run test.

If you are new to Angular, it is advisable to use the latest version of the CLI for a smoother experience.

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

Doughnut Chart with Color Gradients in ng2-charts

Currently, I am exploring the world of Chart.js and ng2-Charts within Angular. Specifically, I am experimenting with Doughnut Charts and have a desire to create a Multi Level Chart. However, I am facing an issue where I am unable to customize the colors fo ...

angulartypescriptchart.jsng2-charts

AngularFire2 Firestore Custom Query: retrieve documents based on current date and time.startTime

Welcome to the world of AngularFire2 and Firestore! My objective is clear: Query data from Firestore where startTime matches currentDateRange. I am facing some challenges with creating a dynamic query in Firestore. After going through the official docume ...

typescripttimestampangularfire2google-cloud-firestore

Leveraging WebStorm's TypeScript support in conjunction with node_modules

Attempting to set up a TypeScript project in WebStorm to import a Node.js module has been a struggle. I made sure to download the necessary TypeScript definition in settings and specified --module commonjs in the compiler settings. However, I keep running ...

node.jstypescriptwebstorm

Tips for adding a time increment of 24 hours to a date variable in Angular 6

My goal is to update a date variable called EndDate stored in localStorage by adding exactly 24 hours to it. The current value in the localStorage is Sun Jun 09 2019 20:39:44 GMT+0530 (India Standard Time). var endDate = new Date(); endDate.setDat ...

angulartypescriptangular6

What are some ways to create a dynamic child server component?

Take a look at the following code snippet // layout.tsx export default function Layout({children}: any) { return <div> {children} </div> } // page.tsx export const dynamic = "force-dynamic"; const DynamicChild = dynamic( ...

typescriptnext.js

Discovering the highest value within an array of objects

I have a collection of peaks in the following format: peaks = 0: {intervalId: 7, time: 1520290800000, value: 54.95125000000001} 1: {intervalId: 7, time: 1520377200000, value: 49.01083333333333} and so on. I am looking to determine the peak with the hig ...

javascripttypescript

I have chosen not to rely on Media Query for ensuring responsiveness in my Angular 2 application, and instead opted to utilize JavaScript. Do you think this approach is considered a

I am in the process of ensuring that my app is fully responsive across all screen sizes. Instead of relying on Media Query, I have chosen to use JavaScript with Angular 2 to achieve this responsiveness, utilizing features such as [style.width], *ngIf="is ...

javascriptangular

Managing the dispatch of a successful action in a component

In my component, I have a form that adds items to a list. Once an item is successfully added, I want to reset the form using form.resetForm();. However, I am struggling to determine when the action of adding the item has been successful. I attempted to sub ...

angularngrx

Navigating in Angular to initiate file retrieval

Is there a way to set up a route in Angular that allows me to download a file? For example, having a route like '/myFile' would result in downloading the file "/assets/files/test.pdf". I've tried using the redirectTo option for routing, bu ...

angularfileroutes

I'm trying to convert the object values into an Array in Angular 8 - any suggestions on how to

I have a set of object values that I need to convert into an array format. var data =[ { "project": "Sciera Internal Application", "hours": { "DATA SCIENCE": 3270, "DEVELOPMENT": 2895 ...

jqueryarraysangular

Understanding and parsing JSON with object pointers

Is it possible to deserialize a JSON in typescript that contains references to objects already existing within it? For instance, consider a scenario where there is a grandparent "Papa" connected to two parents "Dad" and "Mom", who have two children togeth ...

jsontypescriptreference

reconfigure components by resetting settings on a different component

In the interface, I have a section that displays text along with a unique component titled FilterCriteriaList. This component includes custom buttons that alter their color when clicked. My goal is to reset the settings in the FilterCriteriaList component ...

javascriptreactjstypescriptreact-nativereact-hooks

How can I exclude the last parameter from a function type in Typescript?

If I have a function type like this: type FunctionType = (a: number, b: string, c: boolean) => void How can I create a new type with the last parameter removed? type NewFunctionType = OmitLastParameter<FunctionType> Desired type for NewFunctionT ...

typescript

What is the best way to send an observable with parameters through @Input?

The objective is to transfer an http request from Component 1 to Component 2 and initialize its parameters on Component 2. Here is a pseudo code representation of my approach: Component 1 HTML <app-component-2 [obs]="obs"></app-component-1> ...

htmlangulartypescriptparametersobservable

Angular Elements: the crucial link to Material Dependencies

Currently in the process of developing an Angular Element for integration into various projects. This element will serve as a component housing Angular Material components within its template, necessitating the inclusion of a linked Material theme CSS file ...

angularangular-materialangular-elements

Adjusting characteristics in Angular dynamically through JSON

Having trouble changing the value of [icon]="reactAtom" to use a JSON value? Need assistance in updating the [icon] value based on the 'featureItem' received from the parent component. HTML <div> <fa-icon [icon]="reactAtom" class="i ...

jsonangulartypescript

Unable to select multiple checkboxes as they are unresponsive and not registering any clicks

I am facing an issue with rendering multiple checkboxes in a grid cell. I attempted to use formly multicheckbox, but unfortunately the checkboxes did not render properly. So I decided to try a different approach, however, now the checkboxes are not being c ...

angularuser-interfacecheckboxcheckboxlist

Stopping Angular 2 Service Request

I'm working on a menu with category tabs and the following function that gets triggered upon click. this._customerservice.GetCustomersByFilter(this.FilterOptions) //Get Customers by Page Number and CategoryId .subscribe(res => { ...

angularionic-framework

When {} = {} is utilized in an Angular constructor, what is its function?

While going through an Angular dynamic forms tutorial, I came across this code snippet and got confused by the {} = {} in the constructor. Here is the complete snippet: export class QuestionBase<T> { value: T; key: string; label: string; re ...

angulartypescript

Tips for bringing in an enum from TypeScript?

I am working with a module defined in TypeScript that looks like this: declare module MyTypes { export enum MyEnum { GOOD = 'Good', BAD = 'Bad', UNKNOWN = '-' } export interface MyType1 { ...

typescript