programing

ReferenceError: 모듈이 정의되지 않음 - 각/라벨 앱을 사용한 카르마/재스민 구성

newsource 2023. 4. 5. 21:58

ReferenceError: 모듈이 정의되지 않음 - 각/라벨 앱을 사용한 카르마/재스민 구성

JSON 데이터만 제공하는 앵글 프런트 엔드에 대한 API 역할을 하는 기존 Angular/Laravel 앱을 가지고 있습니다.각진 앱을 로드하는 페이지,index.php님은 현재 Laravel에서 서비스를 제공하고 있습니다.거기서부터 앵글이 이어받습니다.

나는 카르마/재스민에 대해 시작하려고 하는데 매우 어려움을 겪고 있다.다음을 사용하여 테스트를 실행할 때karma start또는karma start karma.conf.js프로젝트의 루트 디렉토리에서 다음 오류가 발생합니다.

ReferenceError: module is not defined

전체 출력:

INFO [karma]: Karma v0.12.28 server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
WARN [watcher]: Pattern "/Users/raph/coding/webroot/digitalocean/rugapp/public/rugapp/*.js" does not match any file.
INFO [Chrome 39.0.2171 (Mac OS X 10.9.5)]: Connected on socket 3OCUMp_xhrGtlGHwiosO with id 7897120
Chrome 39.0.2171 (Mac OS X 10.9.5) hello world encountered a declaration exception FAILED
    ReferenceError: module is not defined
        at Suite.<anonymous> (/Users/raph/coding/webroot/digitalocean/rugapp/tests/js/test.js:3:16)
        at jasmineInterface.describe (/Users/raph/coding/webroot/digitalocean/rugapp/node_modules/karma-jasmine/lib/boot.js:59:18)
        at /Users/raph/coding/webroot/digitalocean/rugapp/tests/js/test.js:1:1
Chrome 39.0.2171 (Mac OS X 10.9.5): Executed 2 of 2 (1 FAILED) (0.005 secs / 0.003 secs)

단, chrome broswer는 다음과 같이 기동합니다.

여기에 이미지 설명 입력

나의karma.conf.js파일은 다음과 같습니다.

// Karma configuration
// Generated on Mon Dec 22 2014 18:13:09 GMT-0500 (EST)

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: 'public/rugapp/',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [
      '*.html',
      '**/*.js',
      '../../tests/js/test.js',
      '../../tests/js/angular/angular-mocks.js'
    ],


    // list of files to exclude
    exclude: [

    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],


    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['Chrome'],


    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  });
};

나의package.json파일은 다음과 같습니다.

{
  "devDependencies": {
    "gulp": "^3.8.8",
    "karma": "^0.12.28",
    "karma-chrome-launcher": "^0.1.7",
    "karma-jasmine": "^0.3.2",
    "laravel-elixir": "*"
  }
}

test.js

describe("hello world", function() {
    var CreateInvoiceController;
    beforeEach(module("MobileAngularUiExamples"));
    beforeEach(inject(function($controller) {
        CreateInvoiceController = $controller("CreateInvoiceController");
    }));

    describe("CreateInvoiceController", function() {
        it("Should say hello", function() {
            expect(CreateInvoiceController.message).toBe("Hello");
        });
    });
});

describe("true", function() {
    it("Should be true", function() {
        expect(true).toBeTruthy();
    });
});

어떤 도움이라도 주시면 감사하겠습니다.

아마 이게 누군가에게 도움이 될 거야.

제게 해결책은, 그 모든 것을 확실히angular-mocks.js테스트 전에 로딩되어 있었어요확실하지 않은 경우 에서 순서를 제어합니다.karma.conf.js다음 항에 기재되어 있습니다.

// list of files / patterns to load in the browser
files: [
// include files / patterns here

다음으로 각진 어플리케이션을 실제로 로드하기 위해 다음 작업을 수행해야 합니다.

describe("hello world", function() {
    var $rootScope;
    var $controller;
    beforeEach(module("YourAppNameHere"));
    beforeEach(inject(function($injector) {

        $rootScope = $injector.get('$rootScope');
        $controller = $injector.get('$controller');
        $scope = $rootScope.$new();

    }));
    beforeEach(inject(function($controller) {
        YourControllerHere = $controller("YourControllerHere");

    }));

    it("Should say hello", function() {
        expect(YourControllerHere.message).toBe("Hello");
    });

});

그리고 컨트롤러에서는

app.controller('YourControllerHere', function() {

    this.message = "Hello";

});

또 다른 방법:

describe("YourControllerHere", function() {
    var $scope;
    var controller;

    beforeEach(function() {

        module("YourAppNameHere");

        inject(function(_$rootScope_, $controller) {

            $scope = _$rootScope_.$new();
            controller = $controller("YourControllerHere", {$scope: $scope});

        });

    });

    it("Should say hello", function() {
        expect(controller.message).toBe("Hello");
    });

});

테스트를 즐겨보세요!

이 오류는 각도가 모듈을 주입하지 못했음을 의미합니다.대부분의 경우 스크립트 파일에 대한 참조가 누락되어 발생합니다.이 경우 모든 스크립트파일이 카르마의 [files]Configuration에 정의되어 있는지 확인합니다.스크립트 폴더에 중첩된 구조가 있는 경우 반드시 목록에 표시되므로 경로에 각별히 주의하십시오.예를 들어 다음과 같습니다.

Scripts/Controllers/One/1.js 
Scripts/Controllers/One/2.js 

는 다음과 같이 karma.conf.files에 표시됩니다.

Scripts/Controllers/**/*.js

나중에 수색할 사람들을 위해 그냥 여기에 남겨두세요.

Karma(또는 plunkr 또는 jsfiddle 등) 없이 브라우저에서 직접 각도 단위 테스트를 실행하는 경우.그렇다면 그럴지도 모른다

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular-route.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular-cookies.js"></script> 

    <!-- The Mocha Setup goes BETWEEN angular and angular-mocks -->
    <script>
      mocha.setup({
        "ui": "bdd",
        "reporter": "html"
      });
    </script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular-mocks.js"></script>
    <script src="myApp.js"></script>
    <script src="myTest.js"></script> <!-- test is last -->

Mocha Setup은 angular-mock과 angular-mock 사이를 이동합니다.

저도 비슷한 메시지를 접했는데 알고보니 제가 받은 메시지가angular-mocks파일 경로가 잘못되었습니다.npm을 사용하여 설치했습니다.angular그리고.angular-mocks, 그리고 나는 그들의 경로를 잘못 지정했다.Karma.conf.js다음과 같습니다.

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

의 경로를 지정해야 합니다.angular-mocks.js다음과 같이 합니다.

'node_modules/angular-mocks/angular-mocks.js'

매우 단순한 오류이지만 Angular로 시작하는 경우 찾는 데 시간이 걸릴 수 있습니다.JS 유닛 테스트 중 어디를 찾아야 할지 몰랐습니다.

언급URL : https://stackoverflow.com/questions/27622382/referenceerror-module-is-not-defined-karma-jasmine-configuration-with-angular