angularjs - Unit test case is failing to load webpack based js file having require to load css -
i using webpack bunlde angular js code. not able write mocha based unit test cases bcz gulp-mocha failing "require" css. following code snippet details.
benefits.js angular js directive:
var utilities = require("./../../../../../utilities/utilities"); var apputilities = require("./../../../../../utilities/apputilities"); require("./../../../../css/benefits.css"); module.exports = { getbenefits: function ($sce) { return { restrict: "e", template: require('html!./../../../../templates/page/benefits.html'), replace: true, scope: { benefits: '=', productpagebenefits: '=', divider: '=' }, link: function (scope, element, attrs) { //get benefit details per given list of key scope.getbenefitslist = function (benefitkeylist, benefits) { return opensiteutilities.getbenefitslist(benefitkeylist, benefits); }; } }; } };
benefits_test.js unit test case file:
describe('the benefits', function () { var benefits = require('../../../../../../../../application/client-src/js/application/directives/productpage/benefits.js'); beforeeach(function () { }); it('should object', function () { benefits.should.be.a('object'); expect(benefits).to.have.property('getbenefits'); }); });
i gettign following error
/my/path/application/client-src/css/benefits.css:1 (function (exports, require, module, __filename, __dirname) { @media (min-widt ^ [16:18:49] { [syntaxerror: unexpected token illegal] name: 'syntaxerror', message: 'unexpected token illegal', stack: 'syntaxerror: unexpected token illegal\n @ module._compile (module.js:439:25)\n @ object.module._extensions..js (module.js:474:10)\n @ module.load (module.js:356:32)\n @ function.module._load (module.js:312:12)\n @ module.require (module.js:364:17)\n @ require (module.js:380:17)\n @ object.<anonymous> (/my/path/application/client-src/js/application/directives/productpage/benefits.js:9:1)\n @ module._compile (module.js:456:26)\n @ object.module._extensions..js (module.js:474:10)\n @ module.load (module.js:356:32)\n @ function.module._load (module.js:312:12)\n @ module.require (module.js:364:17)\n @ require (module.js:380:17)\n @ suite.<anonymous> (/my/path/test/application/client-src/js/application/directives/productpage/benefits_test.js:20:20)\n @ context.describe.context.context (/my/path/node_modules/jumpstart-engine/node_modules/gulp-mocha/node_modules/mocha/lib/interfaces/bdd.js:75:10)\n @ object.<anonymous> (/my/path/test/application/client-src/js/application/directives/productpage/benefits_test.js:19:1)', showstack: false, showproperties: true, plugin: 'gulp-mocha' }
i understand failing bcz gulp-mocha not able understand "css" file. how can write test cases? have move "require(./../benefits.css)
" outside of directive code?
i want keep dependencies in same directive code (using webpack). please help
one option trigger mocha through mocha-loader , set css loaded through null-loader. should fix require
issue encountering.
in case want solve outside of webpack need patch require
somehow. expect want use proxyquire, mockery or rewire in case.
Comments
Post a Comment