Issue encountered during testing does not appear in final compilation and prevents tests from executing

Embarking on my maiden voyage with Angular 5...

Currently in the process of setting up a Jasmine test tutorial found at this link: https://angular.io/guide/testing. However, upon initiation, an error throws me off course:

ERROR in src/app/pizzaplace.service.spec.ts(3,10): error TS2305: Module '"/home/thomas/git/pizza-cloud-site/pizza-cloud-admin/src/app/pizzaplace.service"' has no exported member 'PizzaplaceService'.

This error doesn't surface during a typical compile. Below lies the snippet from pizzaplace.service.ts that's causing turbulence:

@Injectable()
export class PizzaPlaceService {
    //class content
}

The attempts to connect the tests to Chrome result in failure messages such as:

27 02 2018 04:40:38.935:WARN [karma]: No captured browser, open http://localhost:9876/
27 02 2018 04:41:39.693:ERROR [launcher]: Chrome failed 2 times (timeout). Giving up.

The Chrome browser fires up and tries to navigate to: http://localhost:9876/?id=98768812, but is unable to resolve it.

This issue seems linked to the earlier error. Googling the error message yields unrelated results.

This snippet shows my initial unit test:

describe('1st tests', () => {
  it('true is true', () => expect(true).toBe(true));
});

Answer №1

It appears that the issue is related to loading:

PizzaplaceService

However, the correct class name should be:

PizzaPlaceService 
     ^

Answer №2

Addressing the second portion of the inquiry regarding the error message "Chrome have not captured in 60000ms" (and for anyone else who may be struggling with this issue).

To resolve this, I found it necessary to include the option '--no-sandbox' within the chrome flags section of my Karma.conf.js file and also as a chrome argument in my protractor.conf.js file, as it appeared that Chrome was not running with adequate security measures. While browsing in this manner is generally discouraged due to safety concerns, since the browser starts and ends entirely under automation without extensions enabled, I feel the risk is minimal.

I have since switched to using headless Chrome, but encountered the same problem with regular Chrome as well.

My updated Karma configuration now appears as follows:


browsers: ['ChromeHeadless'],
singleRun: true,
customLaunchers: {
  ChromeHeadless: {
    base: 'Chrome',
    flags: [
      '--headless',
      '--disable-gpu',
      '--disable-translate',
      '--disable-extensions',
      '--no-sandbox',  // Added to address the issue of Failed to connect to chrome browser
     '--remote-debugging-port=9222',
    ],
  }
} 

Additionally, my protractor.conf.js file now includes the following:


  capabilities: {
    browserName: "chrome",
    chromeOptions: {
      binary: process.env.CHROME_BIN,
      args: ['--no-sandbox']
    }

I hope this information proves 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

Issue with installing angular CLI on Windows 10

Having trouble installing Angular CLI with npm on a Windows 10 system I've exhausted all possible solutions Attempted clearing the cache and re-running the installation command - npm install -g @angular/cli - but encountered new errors every tim ...

Utilize SCSS function by passing in variable parameters

Currently, I am utilizing Angular and SCSS for my style needs. In SCSS, I have the ability to declare variables and reuse them later on. For instance: $color-accent: #30bdff; $color-accentLight: mix(white, $color-accent, 90%); However, what happens if a u ...

Type-constrained generic key access for enhanced security

While attempting to create a versatile function that retrieves the value of a boolean property using a type-safe approach, I encountered an issue with the compiler not recognizing the type of my value. type KeyOfType<T, V> = keyof { [P in keyof T a ...

iOS device encounters failure with Ajax CORS request and redirect

I am experiencing an issue where a URL is being redirected to another domain by the server. My test code is very simple: $.ajax({ type:"GET", url:"{MYURL}", success:function(d){alert('response');} }) You can che ...

Implementing multiple URL parameters in AngularJS using ui-router

After receiving the URL from the payment gateway, this is the format: #/app/booking/details?id=25&success=true&paymentId=123&token=xx2311&PayerID=QSWAA My route configuration currently looks like this: .state('app.booking.details&ap ...

Tips for integrating ng2-file-uploader with WebStorm version 2016.1

I am implementing the ng2-file-uploader in my application. I have referred to this Github project but encountered an error. Note: I am new to Angular2 development. Using the latest version of webstorm (2016.1) and Typescript 1.8.2 ERROR in ./~/ng2-file-u ...

Does SharePoint Online support the .webmanifest format? What is the process for creating a Progressive Web Application in SharePoint Online using a supported webmanifest file?

Currently, I am in the process of developing a Progressive Web Application for SharePoint Online by utilizing the Angular 8 PWA build. The service worker and application are running smoothly; however, I have encountered an issue with loading the webmanifes ...

What is the best way to retrieve the results of an indexedDb request beyond the limitations of its callback function?

I am working on a form that has an input box which I want to auto-complete with values from an IndexedDb objectStore. Currently, it is functioning with two overlapping input boxes, using a simple array. However, I am looking to make it work with the values ...

What could be causing my 3D Model to fail to load in three.js when using the glTF loader?

I'm trying to load a 3D object into my three.js project for the first time. I have the object downloaded on my computer and have connected the three.js library and the glTF loader to my HTML document. However, every time I run the code, I encounter th ...

A guide to automatically playing audio on a webpage using HTML and JavaScript

I'm currently in the process of developing a quiz application, and my goal is to have a sound play when a user enters the webpage to initiate the quiz. Initially, I attempted to use JavaScript to trigger the sound on page load, but unfortunately, the ...

Enhancing an identity function with type hinting

I am looking to define a specification for a function that returns its input argument, regardless of its type. The crucial aspect here is to mirror the interface of the argument in the return value. For instance, when I type z. on line 6 as shown in the i ...

Exploring the concepts of function referencing and prototypical inheritance in relation to function scopes

Consider the scenario where there are two distinct directives: angular.module('demo').directive('functional', [function (){ var idempotentMethods = ['idempotentMethod', 'otherIdempotentMethod']; return { res ...

The validation process using jQuery may encounter errors when attempting to validate inputs before an 'require_from_group_exact' input

Utilizing the jQuery Validation Plugin, I am able to validate various inputs on an HTML page. It is necessary for the first name to always be provided, and either an email OR a mobile number but not both. This validation is achieved by using the require_fr ...

Fixing the GLTF Loader Error in Vue JS: Troubleshooting the issue of 'No loaders configured'

I am attempting to integrate a gltf file into a Vue project. Below is the code I have been working on: import * as THREE from 'three' import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'; let scene, camera, renderer; fu ...

The jQuery code functions properly only if it is inserted directly into the console

I'm facing an issue with a Mobile Font markup switch function. It works fine in the console, but not when I run it within a document ready function or call the function separately. It's strange that I have to paste the code directly into the con ...

Creating interactive PDF files using ReactJS

Is there a way to create a PDF using React that supports styling and allows the content to be hidden on the page? I need to have a link in my app that, when clicked, generates a PDF and opens it in a new tab. I've tried out various packages but none s ...

Customizing the Image Insert Dialog in Pagedown Editor

I've developed a custom insertImageDialog hook to enable file uploads directly within the editor. $('div#insertImageDialog input[type=file]').ajaxfileupload({ action: $file.attr('data-action'), ...

Sending data with an AJAX post request from JavaScript to a Python backend

Attempting to pass a dictionary from JavaScript to a Python script using AJAX POST method. Here's the JavaScript code: function foo(){ context = { 'var1': val1, 'var2': val2 } $.ajax({ ...

What is the process for obtaining a JSON file in AngularJS upon clicking a button?

Starting off with AngularJS and feeling excited. I have successfully created a form with two input boxes. Just below the input boxes, I have added: <input ng-model="id.todoList" type="text" name="input" placeholder="Enter tasks here"> <input ng ...

Positioning Images in Tables with Absolute CSS Styling

I need to alternate between two sets of images using JavaScript. To achieve this, I have to use CSS to set the position of each image to absolute so that each new image replaces the old one as it cycles through. My goal is to arrange the image sets in an ...