Karma has encountered an error: The variable "angular" cannot be found

For the past week, I've been attempting to run Karma in my project. I followed a tutorial on AngularJS Unit Testing, but when I execute karma start, an error appears in the console:

PhantomJS 2.1.1 (Linux 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /home/user/workspace/UnitTest/app/app.js:1

I initially suspected that the error was within my project, so I created a new one, but the issue persisted.

This is how my karma.conf.js looks like:

module.exports = function(config) {
config.set({
   basePath: '',
  frameworks: ['jasmine'],
files: [
  'app/*.js', 
  'tests/*.js',
  'node_modules/angular/angular.js', 
  'node_modules/angular/angular.min.js',
  'node_modules/angular-mocks/angular-mocks.js'
],

exclude: [
],

preprocessors: {
},
reporters: ['progress'],

// web server port
port: 9876,

colors: true,

logLevel: config.LOG_INFO,

autoWatch: true,

browsers: ['PhantomJS'], 

customLaunchers: {
  Chrome_without_security: {
    base: 'PhantomJS',
    flags: ['--disable-web-security']
  }
},

singleRun: false,

concurrency: Infinity
})
}

Here's the content of app.js:

angular.module('MyApp', [])
  .filter('reverse',[function(){
    return function(string){
    return string.split('').reverse().join('');
   }
}])

I also attempted switching the node version, but unfortunately, it did not resolve the issue.

Answer №1

The best approach was to place the angular imports above the app files in the following order:

files: [
  'node_modules/angular/angular.js', 
  'node_modules/angular/angular.min.js',
  'node_modules/angular-mocks/angular-mocks.js',
  'app/*.js', 
  'tests/*.js'
]

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

Leveraging the proxy configuration in React to fetch information from a backend powered by Featherjs

I'm facing a bit of confusion trying to connect my Featherjs backend service, which is running locally on localhost:3030/forms, with a create-react-app client on localhost:3000. In order to establish this connection, I updated the package.json file o ...

Converting user input from a string to an object in JavaScript: a comprehensive guide

Is there a way to transform user input string into objects when given an array of strings? ["code:213123", "code:213123", "code:213123"] I am looking to convert this array into an array of objects with the following format: [{code: "213123"},...] ...

The Adobe Brackets Live Preview feature is currently experiencing difficulty connecting to the Node.js server

I'm encountering an issue while trying to run a Node.js server using Adobe Brackets. When I initiate live preview (with the URL being http://localhost:SOMERANDOMPORT/path/to/file.html), and start the server, typing http://localhost:3000/test into anot ...

Issue with NextJs function not receiving the specified argument variable

Currently, I am focused on developing a Shopify website and fine-tuning the functionality of the shopping cart. My onClick event triggers a function that initiates the process of adding items to the cart. The first step involves checking if there is an exi ...

Exploring the potentials of REST services using the .Net 2.0 framework in conjunction with integrating REST consumption in JavaScript

According to Wikipedia, REST is defined as REST is considered to be the architectural style of the World Wide Web. It was developed alongside the HTTP/1.1 protocol, while building upon the design of HTTP/1.0 The practices of REST have been in existence ...

React for loop executes only a single time no matter the size of the array

I'm struggling with a Form that allows multiple checkboxes. The goal is to add the value to an array of objects when the user clicks a checkbox, and remove it when they unclick it. However, this process only works correctly if the value is the last on ...

Problems arise when a controller within an ng-repeat needs to pass data to another controller, based on the specific ng-repeat element that was clicked

My goal is to achieve the following: I am working with two controllers that communicate with each other through a service (Check out my code on jsFiddle: http://jsfiddle.net/GeorgiAngelov/a9WLr/1/). The concept: The concept here is to have changes made ...

Issue with Box2Dweb's Rope Joint functionality has been identified

I am facing an issue with the Rope Joint code in Box2dweb. Despite running the code in my browser, I am only seeing a blank canvas with no activity. However, when I remove the lines that define the joints (the eight lines following //joints), the code ru ...

Searching for a nested object in Javascript using regular expressions

Presenting my data structure: var foo = { "Category1": [ {"Company1": {"URL": ["DomainName1", "DomainName2"]}}, ... ], ... } Typically, I access DomainName1 like this: foo["Category1"][0][" ...

How do you prevent overlapping divs from being clickable in order to access content below?

Currently, I am utilizing a JPG overlay with decreased opacity for a particular effect. However, I am interested in keeping it solely as an aesthetic effect and making the content beneath that division clickable. Do you think this is achievable? Thanks! I ...

Are there any libraries available that can assist with managing forms similar to how Google Contacts handles them

By default, Google Contacts has a feature where the form displays values with some of them being read only. However, when you click on a value, it converts the field into an editable form so you can easily make changes. After editing and pressing enter, th ...

What could be causing the error "POST http://localhost:3000/upload 404 (Not Found)?"

I have been working on a project that combines a React frontend with a Django backend. One of the key functionalities I've implemented is file upload, where users can upload files from the React interface and have them processed in the Django backend ...

What is the best way to remove items from a JSON object array using PHP?

I've got some PHP code and JSON data to showcase: PHP Code: <?php if (!empty($_POST) && isset($_POST['savechanges']) && $_POST['savechanges'] == 1 && isset($_SESSION['pageadmin'])) { $ou ...

Issue encountered when attempting to install Vue-cli due to error with the chalk

Issue with VUE-CLI configuration: internal/modules/cjs/loader.js:596 throw err; ^ Error: 'chalk' module not found at Function.Module._resolveFilename (internal/modules/cjs/loader.js:594:15) at Function.Module._load (internal/modu ...

Export data from Angular Material data table to Excel format

I'm currently utilizing the angular material data table to showcase data in a tabular layout. I have a requirement to add a feature that enables the export of tabular data to an Excel sheet. Unfortunately, I haven't been able to locate any resour ...

AngularJS - make it a practice to set a default parameter for every Resource

I have encountered a situation where the API I am working with requires a :groupId parameter in the URL for many operations. Is there a simple way to eliminate the need to pass $routeParams.groupId in every function call? var app = angular.module('pl ...

Organize a collection containing various spans using jQuery

Having trouble sorting a list with spans inside. For example: <a href="">Sort by name</a> <a href="">Sort by year</a> <a href="">Sort by fruit</a> <ul> <li> <span class="name">Carl</span> & ...

Utilizing modals for form validation in Angular

Having trouble implementing form validation within a modal pop up? Read on for some guidance. In my view, here is an example of how the form is structured: <script type="text/ng-template", id="modalVideoNew"> <div class="ngdialog-message"> ...

Objects of equal nature combine and sift through

I am looking to categorize objects based on their status ID and also retrieve data and CSR counts for each item. Each StatusName has multiple items: [ { "StatusId": 2, "StatusName": "ordered", " ...

The re-rendering of a functional component utilizing React.useCallback and React.memo() is occurring

I was delving into React concepts and eager to experiment with some new things. Here are a few questions that crossed my mind: Does every functional child component re-render when the parent state changes, even if it doesn't have any props? It seems ...